從倔強(qiáng)青銅到最強(qiáng)王者的成長(zhǎng)之路：

HTML+CSS基礎(chǔ)-->JavaScript基礎(chǔ)語(yǔ)法--> HTML5新API+CSS3動(dòng)畫 -->JavaScript高級(jí)（jquery，面向?qū)ο螅惒?，AJAX等）--> Vue全家桶 --> 移動(dòng)端開發(fā)(微信公眾號(hào)，微信小程序，uniapp) --> 中后臺(tái)開發(fā)（數(shù)據(jù)大屏，登錄鑒權(quán)，增上改查，動(dòng)態(tài)權(quán)限等） --> 面試題/簡(jiǎn)歷。

倔強(qiáng)青銅：整站靜態(tài)頁(yè)面開發(fā)

專門為零基礎(chǔ)的你打造，首先介紹什么是web前端開發(fā)，你的知道自己學(xué)會(huì)之后能干啥。

然后你需要跟著老師講的內(nèi)容一點(diǎn)點(diǎn)學(xué)習(xí)html和css基礎(chǔ)，學(xué)完這塊內(nèi)容大概需要5天。很多初學(xué)者就想一上來就搞個(gè)大項(xiàng)目做，但寫頁(yè)面就像玩拼圖，你得掌握前面5天所有的基本內(nèi)容，少一個(gè)零件你都拼不完整。

當(dāng)你有了一整套html和css的基礎(chǔ)體系，這里不要求你多熟練。接下來你需要跟著老師用一個(gè)整站的項(xiàng)目來熟悉之前所有的知識(shí)點(diǎn)。項(xiàng)目時(shí)間是4天，我們會(huì)給你提供專業(yè)的UI設(shè)計(jì)稿，帶你實(shí)現(xiàn)完整的整站網(wǎng)頁(yè)。

秩序白銀：掌握javascript基礎(chǔ)語(yǔ)法

第一個(gè)階段都是寫網(wǎng)頁(yè)，到這里你才真正的接觸到“編程”。

• js基礎(chǔ)編程語(yǔ)法。包括變量聲明，數(shù)據(jù)類型，數(shù)組，對(duì)象，for循環(huán)，if邏輯判斷等，你要學(xué)會(huì)用js實(shí)現(xiàn)常見的算法，比如數(shù)組排序。

• DOM，利用js對(duì)網(wǎng)頁(yè)元素進(jìn)行操作的api，動(dòng)態(tài)創(chuàng)建刪除修改頁(yè)面元素。

• BOM，利用js對(duì)瀏覽器進(jìn)行操作的api，利用js實(shí)現(xiàn)輪播和其他常見網(wǎng)頁(yè)特效。

榮耀黃金：掌握J(rèn)avaScript高級(jí)應(yīng)用

在這里你將接觸到j(luò)s的高級(jí)應(yīng)用部分，探究js對(duì)象更深層次的組成，深入理解js語(yǔ)言本身。

• flex布局和jQuery等。

• ajax和異步數(shù)據(jù)交互，文件上傳，跨域，websocket等。

• js對(duì)象，構(gòu)造函數(shù)，原型鏈，面向?qū)ο?，繼承。

• 正則表達(dá)式，閉包，緩存函數(shù)，偏函數(shù)，函數(shù)柯里化等。

• es6箭頭函數(shù)，數(shù)組方法補(bǔ)充，proxy，promise等。

尊貴鉑金：掌握vue全家桶

你將掌握一種和前面全然不同的一個(gè)js框架vue，也是你以后工作中最常用的一個(gè)技術(shù)棧。vue的學(xué)習(xí)除了vue本身，還要學(xué)習(xí)vue有關(guān)的其他周邊技術(shù)棧。

• vue基礎(chǔ)語(yǔ)法。

• vue-router路由，vue-cli腳手架。

• vuex狀態(tài)管理。

• axios使用與封裝，mock，代理配置。

• elementUI。

• es6模塊和webpack。

永恒鉆石：掌握移動(dòng)端開發(fā)

移動(dòng)端適配是當(dāng)下最常見的一種需求，除了移動(dòng)端網(wǎng)頁(yè)適配，還要掌握微信小程序開發(fā)，微信公眾號(hào)開發(fā)，還有混合app開發(fā)。

• rem適配移動(dòng)端開發(fā)，響應(yīng)式適配移動(dòng)端開發(fā)。

• sass/less等css預(yù)處理器，移動(dòng)端touch事件。

• 微信公眾號(hào)開發(fā)，網(wǎng)頁(yè)授權(quán)，jssdk，微信支付。

• 項(xiàng)目：原生vue技術(shù)棧實(shí)現(xiàn)移動(dòng)端樂購(gòu)商城。

• 項(xiàng)目：原生微信小程序?qū)崿F(xiàn)螢火蟲電影。

至尊星耀：掌握uniapp混合開發(fā)技術(shù)

當(dāng)下你必須要掌握一門混合開發(fā)技術(shù)，毫無疑問uniapp是目前最流行的。一套代碼幫你解決微信小程序，h5頁(yè)面，android和ios各大平臺(tái)開發(fā)需求。

• 項(xiàng)目：樂居商城移動(dòng)端。

• uniapp介紹，創(chuàng)建項(xiàng)目，基礎(chǔ)語(yǔ)法。

• 需求分析，設(shè)計(jì)稿解讀，swagger接口文檔說明。

• 樂居項(xiàng)目登錄鑒權(quán)，訂單邏輯分析。

• 集成第三方服務(wù)，打包。

最強(qiáng)王者：獨(dú)立完成中后臺(tái)項(xiàng)目開發(fā)

雖然軟件開發(fā)模式的發(fā)展，目前bs架構(gòu)的軟件大部分采用前后端分離模式。一般項(xiàng)目會(huì)分為前臺(tái)部分（pc頁(yè)面或者移動(dòng)端）+中后臺(tái)（某某管理系統(tǒng)）+后臺(tái)服務(wù)（java/php）。除了前臺(tái)部分，中后臺(tái)也是前端開發(fā)者要負(fù)責(zé)開發(fā)的內(nèi)容。這里你要學(xué)會(huì)如何利用vue全家桶技術(shù)棧實(shí)現(xiàn)常規(guī)的中后臺(tái)應(yīng)用開發(fā)。

• 項(xiàng)目：樂居商城后臺(tái)管理系統(tǒng)。

• 中后臺(tái)框架搭建，登錄認(rèn)證，數(shù)據(jù)可視化。

• 常見的數(shù)據(jù)列表，條件查詢，分頁(yè)查詢，富文本編輯等。

• 文件上傳，excel導(dǎo)出。

• 用戶動(dòng)態(tài)權(quán)限。

• 代理解決跨域問題，項(xiàng)目打包和部署。

榮耀王者：完善簡(jiǎn)歷

恭喜你！如果前面的內(nèi)容你都已經(jīng)掌握，你已經(jīng)跨入最強(qiáng)王者段位。不要急，接下來你還需要再補(bǔ)充兩塊內(nèi)容就可以輕松的去找到一份前端開發(fā)工程師的崗位。

• 前端常見面試題匯總（正在補(bǔ)充...）。

• 簡(jiǎn)歷，面試技巧，注意事項(xiàng)。

補(bǔ)充：

這里列舉了一系列硬核知識(shí)點(diǎn)，在整個(gè)的學(xué)習(xí)體系里我們還包含了部分軟知識(shí)，但文檔目錄沒有被體現(xiàn)：

• git常用命令和協(xié)同開發(fā)；

• markdown語(yǔ)法；

• sketch設(shè)計(jì)稿使用，ps切圖，像素大師等；

• gitee和github倉(cāng)庫(kù)管理；

• 自己搭建并啟動(dòng)java后臺(tái)服務(wù)接口，包括jdk，mysql，redis等；

• 網(wǎng)頁(yè)調(diào)用微信拍照，錄音，語(yǔ)音翻譯等智能接口；

• 掌握接口測(cè)試工具appize;

• 了解swagger接口文檔使用；

• 了解前后端開發(fā)模式和項(xiàng)目打包方式；