前端學習路線

1、HTML標籤和CSS基礎

熟練使用HTML和CSS實現靜態頁面佈局，標準還原UI設計稿

難點：

大量的標籤和語法知識，須要系統的學習和大量整站練習

一、HTML標籤和CSS基礎

二、CSS語法（頁面皮膚）

三、常見佈局

四、配合UI設計師，實現相關PC端UI設計稿

2、javascript基礎

學習javascript基礎語法，編程技巧，培養編程思惟能力，編寫具備動效和交互的網頁。

難點：

用編程思惟解決實際需求

一、git和github倉庫使用

二、js基礎語法、數據類型、循環、對象、數組、邏輯控制等

三、常見算法的js實現，好比排序等

四、DOM操做API（頁面元素的操做）

五、BOM操做API（瀏覽器對象，歷史記錄，打開關閉窗口等）

六、綜合練習（柱狀圖排序/輪播圖/放大鏡/購物車/拖拽/todolist），而且使用git上傳到github倉庫。

七、jquery以及jquery相關案例實現

3、HTML5新增API，CSS3動畫以及移動端開發

移動端開發，實現響應式網頁開發；能夠適配各類尺寸的設備，掌握當下流行的響應式UI框架。

難點：

案例綜合性比較強，很是考驗以前所學知識點的熟練度

一、HTML5新增API（語義化標籤/音頻/本地存儲等）

二、CSS3（動畫，過渡等）

三、移動端開發適配，flex佈局

四、移動端jQ-zepto

五、sass、less等CSS預處理器

六、響應式開發以及layui，bootstrap等流行UI框架

七、項目練習：使用移動端/響應式開發還原設計稿；H5活動頁（動畫較多），頁面側欄滑動字母選擇城市，具備本地存儲功能的待辦項網頁。

4、JS高級，canvas,nodejs和ajax

接觸js高級編程技巧，強化js編程能力，學習經過ajax獲取後臺數據原理和方法，瞭解web服務器原理實現可具備動態數據的網頁，具有基本的網站開發能力

難點：

理解web服務器原理及利用動態數據實現需求的邏輯。

一、面向對象編程、做用域、原型、閉包、this、同步異步等

二、詳細學習ES六、ES7新的語法

三、lodash.js

四、前端繪圖canvas，圖表可視化庫如Echarts等，案例（小球動畫/面向對象封裝）

五、nodejs,express模板引擎原理，HTTP協議

六、正則表達式

七、元素ajax以及ajax封裝，jquery的ajax使用

八、ajax跨域的原理及解決方法

九、mock.js介紹及使用，調試工具postman，apizza的介紹和使用

十、項目練習：使用面向對象編程方式實現完整的輪播插件，使用node搭建基本的後臺服務器，完善在線待辦列表，用ajax獲取後臺數據。

十一、項目練習：使用layui框架配合後臺接口，實現相對完整的影視信息展現網站，包括用戶註冊，登陸，查看用戶數據，查看電影列表，電影詳情，演員列表，演員詳情，預告片等功能。

5、前端流行框架VUE，打包工具webpack，element-ui框架等

熟練掌握vue框架及全家桶的使用，先後端分離，提升開發效率

難點：

vue-router和vuex的靈活使用

一、vue入門，基礎語法，typescript語法，雙向綁定原理，組件化，組件通訊等

二、vue進階，vue腳手架，vue-devtool調試工具，axios，自定義過濾器，自定義指令，發佈訂閱設計模式，組件封裝複用等

三、vue-router及vuex

四、模塊化規範，webpack安裝配置，打包文件，懶加載等前端程工程化工具

五、深刻vue原理，MVVM，虛擬DOM，diff算法源碼，vue組件如何渲染和更新的，用Js實現hash路由，常見性能優化

六、element-ui介紹及使用，以及api工具類的axios封裝

七、案例：vue實現完整的todo-list

6、跨平臺開發

進行小程序，混合app等跨平臺開發

一、小程序開發

二、小程序框架

三、小程序項目開發，學院入學報名系統，不凡音樂小程序

四、公衆號開發學習

五、uniapp開發學習

六、此階段項目練習多爲熟悉語法，練手預熱

7、實戰階段

一、PC整站：響應式開發

攝影/婚紗/家居/旅行等整站（有設計稿）

二、vue項目：移動端開發

蟲蟲電影移動端開發

三、vue項目：PC中後臺開發 

element-ui使用

vue-element-admin後臺框架的介紹和使用

經常使用vue第三方庫的介紹和使用，好比：tinymce富文本，markdown編輯器等。

完整案例：學員管理系統

權限（用戶，角色，資源）

四、vue項目：樂居移動web+中後臺（商城）

先後移動端設計稿講解

後臺功能邏輯和交互邏輯講解

後臺接口（很多於80個）功能介紹

中後臺重點，難點功能點實現

前臺接口功能和使用介紹

前臺功能實現

五、uiapp開發

樂居移動端uiapp版本

打包H5版本，微信小程序版本，app版本

六、公衆號開發

jssdk的介紹和使用，好比相機，錄音，定位等

微信用戶基本信息調用

微信jssdk支付和網頁支付

8、面試指導、踏入江湖、新的征程

一、此階段指導簡歷，模擬簡歷

二、大量面試題詳解和原理實現，好比實現promise Axios，節流防抖等

三、企業上門招聘

四、投遞簡歷、面試、就業後仍需保持學習，已在程序員之路越走越遠。