看完nodejs實(shí)戰(zhàn)后的一個(gè)作品,在第一章的基礎(chǔ)上使用了bootstrap使其更美觀,交互性更強(qiáng),并添加了表單驗(yàn)證功能,模版也從書上的ejs換成了jade,以及一些其他的小改動(dòng)。
大家好 ,這是我的個(gè)人技術(shù)博客作品,整體的網(wǎng)站是基于node.js,express框架配合jade模版引擎寫的一個(gè)網(wǎng)站。主頁為純手寫代碼,使用@media實(shí)現(xiàn)響應(yīng)式布局。斷點(diǎn)分別設(shè)置425px以下、425-1280、1280以上三種情況。后臺(tái)頁面則使用bootsrap框架實(shí)現(xiàn)頁面,數(shù)據(jù)庫使用mongodb,moment時(shí)間模塊,與數(shù)據(jù)庫交互則使用mongoose工具模塊。前后臺(tái)的數(shù)據(jù)交互使用js實(shí)現(xiàn)基本的增、刪、改、查。 作品描述至此,謝謝
此作品仿照小米官網(wǎng)按照我自己的想法實(shí)現(xiàn)的一個(gè)商城應(yīng)用。 目前實(shí)現(xiàn)了前臺(tái)的功能,主要有登錄注冊(cè),商品展示,購(gòu)物車等模塊。為了日后的完善和擴(kuò)展, 我采用了前后端分離的架構(gòu)設(shè)計(jì)。前端使用ui-router構(gòu)建頁面路由, 通過使用指令,服務(wù),模板,控制器完成前端的MVC分層,各個(gè)模板頁面則使用基本的HTML/CSS3等技術(shù), 結(jié)合JS完成頁面的基本交互效果。由于沒有數(shù)據(jù)庫, 項(xiàng)目的測(cè)試數(shù)據(jù)是JSON格式的數(shù)據(jù)文件,通過AJax請(qǐng)求完成整個(gè)前臺(tái)功能的數(shù)據(jù)交互, 后期再考慮實(shí)現(xiàn)一個(gè)管理系統(tǒng)及數(shù)據(jù)庫,還有前端頁面資源的異步加載及性能優(yōu)化。作品演示地址:weboey.github.io/XiaoMiStore
使用bootstrap、html、css3完成建筑性公司的網(wǎng)頁模板,以藍(lán)色為主,仿造織夢(mèng)模板的布局進(jìn)行設(shè)置。
html5中canvas標(biāo)簽制作小游戲,運(yùn)用體積碰撞,池,幀等實(shí)現(xiàn)
用HTML5、CSS3、ES6、Ajax、JS的Touch事件等技術(shù)開發(fā)一款移動(dòng)端的web閱讀器。閱讀器有個(gè)性化的閱讀設(shè)置,并且會(huì)通過Html5的Localstorage把設(shè)置的背景顏色、字體大小等信息儲(chǔ)存在本地。閱讀器的文章內(nèi)容是通過Ajax異步讀取后臺(tái)Json數(shù)據(jù),并渲染html來完成最終顯示效果。
我自己寫的個(gè)人網(wǎng)頁作品,本打算寫成響應(yīng)式的,但因?yàn)橛悬c(diǎn)事暫時(shí)不想弄了,這是初級(jí)版本,已在www.loserhua.com上線,后期還會(huì)一直完善,努力學(xué)習(xí)中。。。
根據(jù)慕課網(wǎng)遠(yuǎn)人老師的HTML5移動(dòng)web App閱讀器的課程,我制作了此閱讀器作品,運(yùn)用了html5、css3,JavaScript;雖然這是我是我第一次參加實(shí)戰(zhàn)項(xiàng)目的訓(xùn)練,但是收獲卻很多。由于時(shí)間緊迫且服務(wù)器通信的相關(guān)知識(shí)我并不了解,只是實(shí)現(xiàn)了頁面的結(jié)構(gòu)操作等,所以并不完美。作品地址:http://read.t.imooc.io/。
晴寶,最簡(jiǎn)潔的天氣應(yīng)用。(Build by Ionic2) 一天學(xué)習(xí)完“ionic2”的實(shí)戰(zhàn)項(xiàng)目,第二天則花一天開發(fā)完成。 github:https://github.com/airingursb/sunnybaby,詳情可見README。 目前,該項(xiàng)目已獲60個(gè)star,16個(gè)fork。
以中國(guó)人民大學(xué)為題材做的一個(gè)首頁
項(xiàng)目地址: http://119.29.198.184/ 影院前線是一個(gè)快速獲取電影下載資源的網(wǎng)站 ,項(xiàng)目采用NodeJS+MongoDB,同時(shí)支持PC端和移動(dòng)端。 主要數(shù)據(jù)來源于豆瓣,是在Node建站課程基礎(chǔ)之上完善的,加入了自己的設(shè)計(jì)和其它新的功能,移動(dòng)端使用SUI框架來進(jìn)行搭建。
這個(gè)作品是我在慕課網(wǎng)購(gòu)買HTML5 移動(dòng)Web App閱讀器實(shí)戰(zhàn)時(shí)開發(fā)的,學(xué)習(xí)了基本的前端開發(fā)流程,苦逼的我還在小公司打拼,沒有基本的前端開發(fā)流程,想法-原型-設(shè)計(jì)-開發(fā)-測(cè)試-上線,沒有用戶體驗(yàn),學(xué)習(xí)后我知道我在一個(gè)項(xiàng)目中的地位,該做什么,什么的交往解讀,設(shè)計(jì)解讀,我一直都是拿到設(shè)計(jì)直接開工寫代碼,沒有整體的思路,流水線式的開發(fā),更不知道什么模塊化開發(fā),可復(fù)用的代碼,學(xué)習(xí)HTML5 移動(dòng)Web App閱讀器這個(gè)實(shí)戰(zhàn),我知道,什么是模塊化開發(fā),編寫可復(fù)用的代碼,怎樣的開發(fā)思路,知道了性能優(yōu)化,等等,獲益匪淺 。
使用html+css對(duì)網(wǎng)站進(jìn)行布局,輪播圖使用jquery插件/原生js進(jìn)行編寫,用到圓角等少量的css3和html5。
該作品是一個(gè)防微信的及時(shí)聊天工具項(xiàng)目,項(xiàng)目主界面跟微信主界面非常相似。能夠?qū)崿F(xiàn)通過搜索加好友、通過掃碼加好友,與好友進(jìn)行文字聊天(目前只實(shí)現(xiàn)了文字聊天),上傳用戶頭像等功能。服務(wù)器使用Structs、Hibernate、Spring等框架實(shí)現(xiàn)。
zealer 官網(wǎng)首爾,運(yùn)用了html5 css3動(dòng)畫 bootstrap jQuery scss等
120.27.120.44,域名還在備案中 實(shí)現(xiàn)了單個(gè)博客的留言,但是還有一些模塊沒想好寫什么