少年,你想在vue的世界裏掌控雷電嗎,沒錯,看這個分享就對了!

界面清爽美觀的Vue2版Cnode社區webapp

一、 先看效果圖

圖片描述

手機端掃碼,pc端點擊這裏,github地址在這裏,喜歡就給star吧~
css

二、 主要功能

一、炫酷入場動畫,loading加載動畫
二、權限驗證,即未登陸用戶不能隨便跳轉頁面(vue-router實現)
三、從主頁跳往詳情頁,再從詳情頁返回時恢復到原來狀態(sessionStorage實現)
四、自寫vue插件實現全局提示和回到頂部功能
五、登陸、發表話題、查看消息、查看話題等基本功能

三、 技術棧

一、vue2+vue-router2-vuex2全家桶
二、axios,做爲替代vue-resource的數據請求模塊(尤大大推薦的)
三、flexible.js,font-size+rem的移動適配庫
四、reset.css,animate.css,iconfont.css,github-markdown-
   css,fastclick.js,zepto.js一些工具類庫

四、心得

首先感謝Cnode社區提供的API。
        作這個項目的初衷是想完整走一遍vue全家桶流程,固然這個目的是達到了,
    可是我感受收穫最大的並非這個,而是移動端的適配問題,不只搞明白了
    適配的原理(font-size+rem),還對flex佈局等理解更加深入了。此外
    還有不少收穫,好比作數據緩存,一些git操做,一些sbulimetext插件,
    以及webpack工具的運用等。

五、將來開發計劃

目前基本功能都已實現,後期還想在該應用上繼續優化,包括:
    一、作服務端渲染(SSR),解決SEO和首次加載緩慢問題;
    二、嘗試作成最近較火的漸進式渲染(PWA)應用;

六、 最後

謝謝你們閱讀,但願一塊兒交流,共同進步!(聽說給了star的小夥伴更容易打通奇經八脈以及任督二脈,功力大增~~~)
相關文章
相關標籤/搜索