去哪網(wǎng)APP
?? 項(xiàng)目演示地址:http://118.25.39.84
基于Vue 全家桶 (2.x)制作的
去哪網(wǎng)APP項(xiàng)目羞延,項(xiàng)目完整、功能完備、UI美觀竹习、交互一流。
技術(shù)棧
【前端】
Vue:構(gòu)建用戶界面的 MVVM 框架列牺,核心是響應(yīng)的數(shù)據(jù)綁定和組系統(tǒng)件
vue-router:為單頁(yè)面應(yīng)用提供的路由系統(tǒng)整陌,項(xiàng)目上線前使用了路由懶加載技術(shù),來(lái)異步加載路由優(yōu)化性能
vuex:Vue 集中狀態(tài)管理,在多個(gè)組件共享某些狀態(tài)時(shí)非常便捷
axios:服務(wù)端通訊泌辫∷婵洌基于Promise的網(wǎng)絡(luò)請(qǐng)求插件
vue-lazyload:第三方圖片懶加載庫(kù),優(yōu)化頁(yè)面加載速度
better-scroll:iscroll 的優(yōu)化版震放,使移動(dòng)端滑動(dòng)體驗(yàn)更加流暢
stylus:css 預(yù)編譯處理器
ES6:ECMAScript
vue-awesome-swiper: 圖片輪播插件
fastClick: 解決300毫秒點(diǎn)擊事件延遲問(wèn)題
stylus-loader: 一像素邊框問(wèn)題
新一代語(yǔ)法宾毒,模塊化、解構(gòu)賦值殿遂、Promise诈铛、Class 等方法非常好用
【后端數(shù)據(jù)】
使用本地模擬數(shù)據(jù)
【自動(dòng)化構(gòu)建及其他工具】
vue-cli:Vue 腳手架工具,快速初始化項(xiàng)目代碼
ESLint:代碼風(fēng)格檢查工具墨礁,規(guī)范代碼書寫
收獲
對(duì) vue 的組件幢竹、指令、選項(xiàng)饵溅、模版渲染妨退、事件綁定、計(jì)算屬性等有了一定了解
了解了 vue 組件之間的交互蜕企、傳值
熟悉了在 vue 項(xiàng)目中使用第三方插件(組件)
熟悉了組件化咬荷、模塊化的開發(fā)思維
熟悉了 vue-router 控制路由和子路由的方式
再次熟悉項(xiàng)目開發(fā)流程:項(xiàng)目分析設(shè)計(jì) -> 項(xiàng)目環(huán)境搭建 -> 依賴安裝 -> 頁(yè)面架構(gòu)設(shè)計(jì) -> 組件開發(fā) -> 測(cè)試聯(lián)調(diào) -> 發(fā)布上線
體會(huì)到組件化、模塊化開發(fā)帶來(lái)的便捷
體會(huì)到將對(duì)象封裝成類(ES6 class) 的便捷性轻掩,以及利用工廠方式初始化類實(shí)例
學(xué)會(huì)利用過(guò)渡效果及動(dòng)畫效果制作良好的用戶交互體驗(yàn)
作者:你的小白
鏈接:http://www.reibang.com/p/d928eb5a6b49
來(lái)源:簡(jiǎn)書
簡(jiǎn)書著作權(quán)歸作者所有幸乒,任何形式的轉(zhuǎn)載都請(qǐng)聯(lián)系作者獲得授權(quán)并注明出處。