自學(xué)前端，前端開發(fā)的學(xué)習(xí)路線是什么？

自學(xué)前端其實(shí)很辛苦，需要有強(qiáng)大的自制力和堅(jiān)持下去的學(xué)習(xí)心，并且做好詳細(xì)的學(xué)習(xí)規(guī)劃嚴(yán)格執(zhí)行；如果你想學(xué)前端，下面的學(xué)習(xí)路線或許對你有幫助。

前端完整學(xué)習(xí)路線

第一階段:

HTML CSS:HTML進(jìn)階、CSS進(jìn)階、div css布局、HTML css整站開發(fā)。

JavaScript基礎(chǔ):Js基礎(chǔ)教程、js內(nèi)置對象常用方法、常見DOM樹操作大全、ECMAscript、DOM、BOM、定時(shí)器和焦點(diǎn)圖。

JS基本特效:常見特效、例如:tab、導(dǎo)航、整頁滾動(dòng)、輪播圖、JS制作幻燈片、彈出層、手風(fēng)琴菜單、瀑布流布局、滾動(dòng)事件、滾差視圖。

JS高級特征:正則表達(dá)式、排序算法、遞歸算法、閉包、函數(shù)節(jié)流、作用域鏈、基于距離運(yùn)動(dòng)框架、面向?qū)ο蠡A(chǔ)。

JQuery:基礎(chǔ)使用懸著器、DOM操作、特效和動(dòng)畫、方法鏈、拖拽、變形、JQueryUI組件基本使用。

第二階段:HTML5和移動(dòng)Web開發(fā)

HTML5:HTML5新語義標(biāo)簽、HTML5表單、音頻和視頻、離線和本地存儲、SVG、Web Socket、Canvas。

CSS3:CSS3新選擇器、偽元素、臉色表示法、邊框、陰影、background系列屬性改變、Transition、動(dòng)畫、景深和深透、3D效果制作、Velocity.js框架、元素進(jìn)場、出場策略、炫酷CSS3網(wǎng)頁制作。

Bootstrap:響應(yīng)式概念、媒體查詢、響應(yīng)式網(wǎng)站制作、刪格系統(tǒng)、刪格系統(tǒng)原理、Bootstrap常用模板、LESS和SASS。

移動(dòng)Web開發(fā):跨終端WEB和主流設(shè)備簡介、視口、流式布局、彈性盒子、rem、移動(dòng)終端JavaScript事件、手機(jī)中常見JS效果制作、Zepto.js、手機(jī)聚劃算頁面、手機(jī)滾屏。

第三階段:HTTP服務(wù)和AJAX編程

WEB服務(wù)器基礎(chǔ):服務(wù)器基礎(chǔ)知識、Apache服務(wù)器和其他WEB服務(wù)器介紹、Apache服務(wù)器搭建、HTTP介紹。

PHP基礎(chǔ):PHP基礎(chǔ)語法、使用PHP處理簡單的GET或者POST請求。

AJAX上篇:Ajax簡介和異步的概念、Ajax框架的封裝、XMLHttpRequest對象詳細(xì)介紹方法、兼容性處理方法、Ajax框架的封裝、Ajax中緩存問題、XML介紹和使用。

AJAX下篇:JSON和JSON解析、數(shù)據(jù)綁定和模板技術(shù)、JSONP、跨域技術(shù)、圖片預(yù)讀取和lazy-load技術(shù)、JQuery框架中的AjaxAPI、使用Ajax實(shí)現(xiàn)爆布流案例額。

第四階段:面向?qū)ο筮M(jìn)階

面向?qū)ο蠼K極篇:從內(nèi)存角度到理解JS面向?qū)ο?、基本類型、?fù)雜類型、原型鏈、ES6中的面向?qū)ο?、屬性讀寫權(quán)限、設(shè)置器、訪問器。

面向?qū)ο笕筇卣?繼承性、多態(tài)性、封裝性、接口。

設(shè)計(jì)模式:面向?qū)ο缶幊趟季S、單例模式、工廠模式、策略模式、觀察者模式、模板方法模式、代理模式、裝飾者模式、適配器模式、面向切面編程。

第五階段:封裝一個(gè)屬于自己的框架

框架封裝基礎(chǔ):事件流、冒泡、捕獲、事件對象、事件框架、選擇框架。

框架封裝中級:運(yùn)動(dòng)原理、單物體運(yùn)動(dòng)框架、多物體運(yùn)動(dòng)框架、運(yùn)動(dòng)框架面向?qū)ο蠓庋b。

框架封裝高級和補(bǔ)充:JQuery框架雛形、可擴(kuò)展性、模塊化、封裝屬于傳智自己的框架。

第六階段:模塊化組件開發(fā)

面向組件編程:面向組件編程的方式、面向組件編程的實(shí)現(xiàn)原理、面向組件編程實(shí)戰(zhàn)、基于組件化思想開發(fā)網(wǎng)站應(yīng)用程序。

面向模塊編程:AMD設(shè)計(jì)規(guī)范、CMD設(shè)計(jì)規(guī)范、RequireJS，LoadJS、淘寶的SeaJS。

第七階段:主流的流行框架

Web開發(fā)工作流:GIT/SVN、Yeoman腳手架、NPMer依賴管理工具、Grunt/Gulp/Webpack。

MVC/MVVM/MVW框架:Angular.js、Backbone.js、Knockout/Ember。

常用庫:React.js、Vue.js、Zepto.js。

第八階段:HTML5原生移動(dòng)應(yīng)用開發(fā)

Cordova:WebApp/NativeApp/HybirdApp簡介、Cordova簡介、與PhoneGap之間的關(guān)系、開發(fā)環(huán)境搭建、Cordova實(shí)戰(zhàn)(創(chuàng)建項(xiàng)目，配置，編譯，調(diào)試，部署發(fā)布)。

Ionic:Ionic簡介和同類對比、模板項(xiàng)目解析、常見組件及使用、結(jié)合Angular構(gòu)建APP、常見效果(下拉刷新，上拉加載，側(cè)滑導(dǎo)航，選項(xiàng)卡)。

React Native:React Native簡介、React Native環(huán)境配置、創(chuàng)建項(xiàng)目，配置，編譯，調(diào)試，部署發(fā)布、原生模塊和UI組件、原生常用API。

HTML5 :HTML5 中國產(chǎn)業(yè)聯(lián)盟、HTML5 Plus Runtime環(huán)境、HBuilder開發(fā)工具、MUI框架、H5 開發(fā)和部署。

第九階段: Node.js全棧開發(fā):

快速入門:Node.js發(fā)展、生態(tài)圈、Io.js、Linux/Windows/OS X環(huán)境配置、REPL環(huán)境和控制臺程序、異步編程，非阻塞I/O、模塊概念，模塊管理工具、開發(fā)流程，調(diào)試，測試。

核心模塊和對象:全局對象global，process，console，util、事件驅(qū)動(dòng)，事件發(fā)射器、加密解密，路徑操做。

祝你學(xué)有所成！

前端開發(fā)自學(xué)路線是什么？

這里整理了一份web前端學(xué)習(xí)路線的思維導(dǎo)圖，需要掌握和學(xué)習(xí)的內(nèi)容如下：

第一階段：專業(yè)核心基礎(chǔ)

階段目標(biāo)：

1. 熟練掌握HTML5、CSS3、Less、Sass、響應(yīng)書布局、移動(dòng)端開發(fā)。

2. 熟練運(yùn)用HTML+CSS特性完成頁面布局。

4. 熟練應(yīng)用CSS3技術(shù)，動(dòng)畫、彈性盒模型設(shè)計(jì)。

5. 熟練完成移動(dòng)端頁面的設(shè)計(jì)。

6. 熟練運(yùn)用所學(xué)知識仿制任意Web網(wǎng)站。

7. 能綜合運(yùn)用所學(xué)知識完成網(wǎng)頁設(shè)計(jì)實(shí)戰(zhàn)。

知識點(diǎn)：

1、Web前端開發(fā)環(huán)境，HTML常用標(biāo)簽，表單元素，Table布局，CSS樣式表，DIV+CSS布局。熟練運(yùn)用HTML和CSS樣式屬性完成頁面的布局和美化，能夠仿制任意網(wǎng)站的前端頁面實(shí)現(xiàn)。

2、CSS3選擇器、偽類、過渡、變換、動(dòng)畫、字體圖標(biāo)、彈性盒模型、響應(yīng)式布局、移動(dòng)端。熟練運(yùn)用CSS3來開發(fā)網(wǎng)頁、熟練開發(fā)移動(dòng)端，整理網(wǎng)頁開發(fā)技巧。

3、預(yù)編譯css技術(shù)：less、sass基礎(chǔ)知識、以及插件的運(yùn)用、BootStrap源碼分析。能夠熟練使用 less、sass完成項(xiàng)目開發(fā)，深入了解BootStrap。

4、使用HTML、CSS、LESS、SASS等技術(shù)完成網(wǎng)頁項(xiàng)目實(shí)戰(zhàn)。通過項(xiàng)目掌握第一階段html、css的內(nèi)容、完成PC端頁面設(shè)計(jì)和移動(dòng)端頁面設(shè)計(jì)。

第二階段：Web后臺技術(shù)

階段目標(biāo):

1. 了解JavaScript的發(fā)展歷史、掌握Node環(huán)境搭建及npm使用。

2. 熟練掌握J(rèn)avaScript的基本數(shù)據(jù)類型和變量的概念。

3. 熟練掌握J(rèn)avaScript中的運(yùn)算符使用。

4. 深入理解分支結(jié)構(gòu)語句和循環(huán)語句。

5. 熟練使用數(shù)組來完成各種練習(xí)。

6.熟悉es6的語法、熟練掌握J(rèn)avaScript面向?qū)ο缶幊獭?/p>

7.DOM和BOM實(shí)戰(zhàn)練習(xí)和H5新特性和協(xié)議的學(xué)習(xí)。

知識點(diǎn)：

1、軟件開發(fā)流程、算法、變量、數(shù)據(jù)類型、分之語句、循環(huán)語句、數(shù)組和函數(shù)。熟練運(yùn)用JavaScript的知識完成各種練習(xí)。

2、JavaScript面向?qū)ο蠡A(chǔ)、異常處理機(jī)制、常見對象api，js的兼容性、ES6新特性。熟練掌握J(rèn)avaScript面向?qū)ο蟮拈_發(fā)以及掌握es6中的重要內(nèi)容。

3、BOM操作和DOM操作。熟練使用BOM的各種對象、熟練操作DOM的對象。

4、h5相關(guān)api、canvas、ajax、數(shù)據(jù)模擬、touch事件、mockjs。熟練使用所學(xué)知識來完成網(wǎng)站項(xiàng)目開發(fā)。

第三階段：數(shù)據(jù)庫和框架實(shí)戰(zhàn)

階段目標(biāo)：

1. 綜合運(yùn)用Web前端技術(shù)進(jìn)行頁面布局與美化。

2. 綜合運(yùn)用Web前端開發(fā)框架進(jìn)行Web系統(tǒng)開發(fā)。

3. 熟練掌握Mysql、Mongodb數(shù)據(jù)庫的發(fā)開。

4. 熟練掌握vue.js、webpack、elementui等前端框技術(shù)。

5. 熟練運(yùn)用Node.js開發(fā)后臺應(yīng)用程序。

6. 對Restful，Ajax，JSON，開發(fā)過程有深入的理解,掌握git的基本技能。

知識點(diǎn)：

1、數(shù)據(jù)庫知識，范式，MySQL配置，命令，建庫建表，數(shù)據(jù)的增刪改查，mongodb數(shù)據(jù)庫。深入理解數(shù)據(jù)庫管理系統(tǒng)通用知識及MySQL數(shù)據(jù)庫的使用與管理，為Node.js后臺開發(fā)打下堅(jiān)實(shí)基礎(chǔ)。

2、模塊系統(tǒng)，函數(shù)，路由，全局對象，文件系統(tǒng)，請求處理，Web模塊，Express框架，MySQL數(shù)據(jù)庫處理，RestfulAPI，文件上傳等。熟練運(yùn)用Node.js運(yùn)行環(huán)境和后臺開發(fā)框架完成Web系統(tǒng)的后臺開發(fā)。

3、vue的組件、生命周期、路由、組件、前端工程化、webpack、elementui框架。Vue.js框架的基本使用有清晰的理解，能夠運(yùn)用Vue.js完成基礎(chǔ)前端開發(fā)、熟練運(yùn)用Vue.js框架的高級功能完成Web前端開發(fā)和組件開發(fā)，對MVVM模式有深刻理解。

4、需求分析，數(shù)據(jù)庫設(shè)計(jì)，后臺開發(fā)，使用vue、node完成pc和移動(dòng)端整站開發(fā)。于Node.js+Vue.js+Webpack+Mysql+Mongodb+Git，實(shí)現(xiàn)整站項(xiàng)目完整功能并上線發(fā)布。

第四階段：移動(dòng)端和微信實(shí)戰(zhàn)

階段目標(biāo)：

1.熟練掌握React.js框架，熟練使用React.js完成開發(fā)。

2.掌握移動(dòng)端開發(fā)原理，理解原生開發(fā)和混合開發(fā)。

3.熟練使用react-native和Flutter框架完成移動(dòng)端開發(fā)。

4.掌握微信小程序以及了解支付寶小程序的開發(fā)。

5.完成大型電商項(xiàng)目開發(fā)。

知識點(diǎn)：

1、React面向組件編程、表單數(shù)據(jù)、組件通信、監(jiān)聽、生命周期、路由、Redux基本概念。練使用react完成項(xiàng)目開發(fā)、掌握Redux中的異步解決方案Saga。

2、react-native、開發(fā)工具、視圖與渲染、api操作、Flutter環(huán)境搭建、路由、ListView組件、網(wǎng)絡(luò)請求、打包。練掌握react-native和Flutter框架，并分別使用react-native和Flutter分別能開發(fā)移動(dòng)端項(xiàng)目。

3、微信小程序基本介紹、開發(fā)工具、視圖與渲染、api操作、支付寶小程序的入門和api學(xué)習(xí)。掌握微信小程序開發(fā)了解支付寶小程序。

4、大型購物網(wǎng)站實(shí)戰(zhàn)，整個(gè)項(xiàng)目前后端分離開發(fā)；整個(gè)項(xiàng)目分為四部分：PC端網(wǎng)頁、移動(dòng)端APP、小程序、后臺管理。團(tuán)隊(duì)協(xié)作開發(fā)，使用git進(jìn)行版本控制。目期間可以擴(kuò)展Three.js 、TypeScript。

對于如何學(xué)習(xí)WEB前端，或者在學(xué)習(xí)WEB前端過程中遇見問題自己無法解決，可以到這個(gè)WEB前端裙，里面有最新的學(xué)習(xí)路線和教程，可以跟著學(xué)，有什么不懂的地方可以隨時(shí)在里面問，后面就是這個(gè)WEB前端裙：731255295。

前端入門應(yīng)該如何規(guī)劃自己的學(xué)習(xí)路徑

給你幾點(diǎn)建議和學(xué)習(xí)路線，參考一下：

1、作為一個(gè)初學(xué)者，你必須明確系統(tǒng)的學(xué)習(xí)方案，我建議一定有一個(gè)指導(dǎo)的人，全靠自己學(xué)，放棄的幾率非常大，在你對于web前端還沒有任何概念的時(shí)候，需要一個(gè)人領(lǐng)進(jìn)門，之后就都靠自己鉆研，第一步就是確定web前端都需要哪些內(nèi)容，并且在多少時(shí)間內(nèi)學(xué)完，建議時(shí)間6個(gè)月保底。

2、視頻為主，書為輔。很多初學(xué)者在學(xué)習(xí)前端的時(shí)候非常喜歡去買書，但是最后的結(jié)果是什么？看來看去什么都不會寫，所以在這里給大家提醒，書可以看，但是是在建立于你已經(jīng)對于某個(gè)知識點(diǎn)有了具體操作的執(zhí)行后，在用書去鞏固概念，這樣更加利于你對于知識的理解。

3、對于學(xué)習(xí)技術(shù)來講，掌握一個(gè)學(xué)習(xí)方法是非常重要的，其實(shí)對于學(xué)習(xí)web前端來講，學(xué)習(xí)方法確實(shí)很多都是相通的，一旦學(xué)習(xí)方法不對，可能就會造成“方法不對，努力白費(fèi)”。其實(shí)關(guān)于這方面還是很多的，我就簡單說個(gè)例子，有的人邊聽課邊跟著敲代碼，這樣就不對，聽課的時(shí)候就專心聽，做題的時(shí)候就專心做題，這都是過來人的經(jīng)驗(yàn)，一定要聽。根據(jù)每個(gè)人的不同，可能學(xué)習(xí)方法也會有所出路，找到適合你自己的學(xué)習(xí)法方法是學(xué)習(xí)的前提。

4、不建議自己一個(gè)人瞎學(xué)，在我了解學(xué)習(xí)編程的這些人來看，從零基礎(chǔ)開始學(xué)并且最后成功做這份工作的其實(shí)并沒有幾個(gè)，我覺得大部分原因就是因?yàn)樗麄兌疾涣私鈝eb前端是干什么的，學(xué)什么的，就盲目的買書看，到處找視頻看，最后看著看著就放棄了，所以我建議初學(xué)者在沒有具體概念之前，還是找有經(jīng)驗(yàn)的人請教一下，聊過之后你就會知道web前端具體是干什么的，該怎么學(xué)，這是我個(gè)人的小建議，可以不采納。

自學(xué)前端的路線：

第1階段：前端頁面重構(gòu)(4周)

內(nèi)容包含了：(PC端網(wǎng)站布局項(xiàng)目、HTML5+CSS3基礎(chǔ)項(xiàng)目、WebApp頁面布局項(xiàng)目)

第2階段：JavaScript高級程序設(shè)計(jì)(5周)

內(nèi)容包含：(原生JavaScript交互功能開發(fā)項(xiàng)目、面向?qū)ο筮M(jìn)階與ES5/ES6應(yīng)用項(xiàng)目、JavaScript工具庫自主研發(fā)項(xiàng)目)

第3階段：PC端全棧項(xiàng)目開發(fā)(3周)

內(nèi)容包含：(jQuery經(jīng)典交互特效開發(fā)、HTTP協(xié)議、Ajax進(jìn)階與PHP/JAVA開發(fā)項(xiàng)目、前端工程化與模塊化應(yīng)用項(xiàng)目、PC端網(wǎng)站開發(fā)項(xiàng)目、PC端管理信息系統(tǒng)前端開發(fā)項(xiàng)目)

第4階段：移動(dòng)端項(xiàng)目開發(fā)(6周)

內(nèi)容包含：(Touch端項(xiàng)目、微信場景項(xiàng)目、應(yīng)用Angular+Ionic開發(fā)WebApp項(xiàng)目、應(yīng)用Vue.js開發(fā)WebApp項(xiàng)目、應(yīng)用React.js開發(fā)WebApp項(xiàng)目)

第5階段：混合(Hybrid,ReactNative)開發(fā)(1周)

內(nèi)容包含：(微信小程序開發(fā)、ReactNative、各類混合應(yīng)用開發(fā))

第6階段：NodeJS全棧開發(fā)(1周)

內(nèi)容包括：(WebApp后端系統(tǒng)開發(fā)、一、NodeJS基礎(chǔ)與NodeJS核心模塊二、Express三、noSQL數(shù)據(jù)庫)

前端入門必讀書籍推薦：

《JavaScript DOM 編程藝術(shù)》

超級前端暢銷書，作為前端程序員必讀兩遍以上的書籍，這本書籍特別適合初學(xué)前端的新人，前端的核心技術(shù)就是JavaScript，同時(shí)也是前端的難點(diǎn)。而這本書非常適合入門，通俗易懂，生動(dòng)的案例可以讓初學(xué)者更好的進(jìn)行理解。所提及的很多編程思想?yún)s適合低中級層次的前端開發(fā)者學(xué)習(xí)。

《JavaScript權(quán)威指南》

同樣是前端程序員必讀的一本書籍，不僅適合初學(xué)者，還適合那些已經(jīng)在做前端工作的程序員進(jìn)行隨時(shí)翻閱。里面涵蓋了JavaScript的所有內(nèi)容，以及web瀏覽器所實(shí)現(xiàn)的JavaScript API。對于了解js的基礎(chǔ)知識，比如對象，數(shù)組，語法，作用域，閉包等等都很有幫助。

《JavaScript 高級程序設(shè)計(jì)》

如果你想把JavaScript非常完全的系統(tǒng)學(xué)習(xí)一遍，我強(qiáng)烈推薦這本書，這本書可以一直保留，在用這本書的過程中還可以畫下重點(diǎn)，以后可以作為參考，是工作中非常強(qiáng)力的幫手。面試的時(shí)候也可以很好的應(yīng)用上，我們俗稱的“紅寶書”。

《你不知道的JavaScript》

這本書不適合前端的初學(xué)者，想要深入的了解JavaScript原理，這是每一個(gè)前端程序員必須要研究的一本書籍。要讓不求甚解的JavaScript開發(fā)者迎難而上，深入語言內(nèi)部，弄清楚JavaScript每一個(gè)零部件的用途。如果可以把這本書吃透，那么以后理解任何東西都可以很快的理解和掌握。

《Vue.js權(quán)威指南》

Vue作為現(xiàn)在前端的主流框架，在國內(nèi)應(yīng)用最為廣泛，所以了解Vue原理必須要啃一本Vue的書籍。我之所以推薦這本，是因?yàn)檫@本書對于引導(dǎo)初用Vue的開發(fā)者有著質(zhì)的提升。從基礎(chǔ)知識到主流打包以及源碼解析，還有很多實(shí)踐的案例，都是一本不錯(cuò)的實(shí)用性書籍。主要內(nèi)容包括數(shù)據(jù)綁定、指令、表單控件綁定、過濾器、組件、表單驗(yàn)證、服務(wù)通信、路由和視圖、vue-cli、測試開發(fā)和調(diào)試、源碼解析及主流打包構(gòu)建工具等。該書內(nèi)容全面，講解細(xì)致，示例豐富，適用于各層次的開發(fā)者。

《編程之美》

無論是什么崗位的程序員，必讀的一本書籍，沒有讀過這本書的程序員幾乎都是假程序員。這本書有60道算法和程序設(shè)計(jì)題目，這些題目大部分在近年的筆試，面試中出現(xiàn)過，或者是被微軟員工熱烈討論過。作者試圖從書中各種有趣的問題出發(fā)，引導(dǎo)讀者發(fā)現(xiàn)問題，分析問題，解決問題，尋找更優(yōu)的解法?？梢源蠓忍岣咦约旱木幊趟季S和對于這個(gè)行業(yè)的深入思考，最終變成技術(shù)大牛。

相關(guān)的視頻教程需要的話，留言告訴我。

如何快速學(xué)習(xí)前端

自學(xué)前端是一個(gè)非常辛苦的過程，最不可缺少的就是堅(jiān)持下去的決心以及合理的學(xué)習(xí)計(jì)劃。接下來我簡單說一下自學(xué)前端需要注意的幾點(diǎn)以及自學(xué)前端的路線。

自學(xué)方法：

1、作為一個(gè)初學(xué)者，你必須明確系統(tǒng)的學(xué)習(xí)方法，我建議一定要有一個(gè)指導(dǎo)人，全靠自己學(xué)，放棄的幾率非常大，在你對web前端還沒有任何概念的時(shí)候，需要一個(gè)人領(lǐng)進(jìn)門，之后就靠自己鉆研，第一步就是確定web前端都需要學(xué)哪些東西，并且在多少時(shí)間內(nèi)學(xué)完，建議時(shí)間6個(gè)月保底。

2、視頻為主，書為輔。很多初學(xué)者在學(xué)習(xí)前端的時(shí)候非常喜歡去買書，但是最后的結(jié)果是什么？看來看去什么都不會寫。所以在這里告訴大家，書可以看，但是是建立在你已經(jīng)對于某個(gè)知識點(diǎn)有了具體的操作的執(zhí)行后，再用書去鞏固概念，這樣更加利于你對知識的理解。

3、對于學(xué)習(xí)技術(shù)來講，掌握一個(gè)學(xué)習(xí)方法是非常重要的，其實(shí)對于學(xué)習(xí)web前端來講，學(xué)習(xí)方法確實(shí)很多都是相通的，一旦學(xué)習(xí)方法不對，可能就會造成“方法不對，努力白費(fèi)”。其實(shí)關(guān)于這方面還是很多的，我就簡單說個(gè)例子，有的人邊聽課邊跟著敲代碼，這樣就不對，聽課的時(shí)候就專心聽，做題的時(shí)候就專心做題，這都是過來人的經(jīng)驗(yàn)，一定要聽。根據(jù)每個(gè)人的不同，可能學(xué)習(xí)方法也會有所出路，找到適合你自己的學(xué)習(xí)法方法是學(xué)習(xí)的前提。

不建議自己一個(gè)人瞎學(xué)，在我了解學(xué)習(xí)編程的這些人來看，從零基礎(chǔ)開始學(xué)并且最后成功做這份工作的其實(shí)并沒有幾個(gè)，我覺得大部分原因就是因?yàn)樗麄兌疾涣私鈝eb前端是干什么的，學(xué)什么的，就盲目的買書看，到處找視頻看，最后看著看著就放棄了，所以我建議初學(xué)者在沒有具體概念之前，還是找有經(jīng)驗(yàn)的人請教一下，聊過之后你就會知道web前端具體是干什么的，該怎么學(xué)，這是我個(gè)人的小建議，可以不采納。

推薦一個(gè)自學(xué)前端的路線，你可以參考一下：

第1階段：前端頁面重構(gòu)(4周)

內(nèi)容包含了：(PC端網(wǎng)站布局項(xiàng)目、HTML5+CSS3基礎(chǔ)項(xiàng)目、WebApp頁面布局項(xiàng)目)

第2階段：JavaScript高級程序設(shè)計(jì)(5周)

內(nèi)容包含：(原生JavaScript交互功能開發(fā)項(xiàng)目、面向?qū)ο筮M(jìn)階與ES5/ES6應(yīng)用項(xiàng)目、JavaScript工具庫自主研發(fā)項(xiàng)目)

第3階段：PC端全棧項(xiàng)目開發(fā)(3周)

內(nèi)容包含：(jQuery經(jīng)典交互特效開發(fā)、HTTP協(xié)議、Ajax進(jìn)階與PHP/JAVA開發(fā)項(xiàng)目、前端工程化與模塊化應(yīng)用項(xiàng)目、PC端網(wǎng)站開發(fā)項(xiàng)目、PC端管理信息系統(tǒng)前端開發(fā)項(xiàng)目)

第4階段：移動(dòng)端項(xiàng)目開發(fā)(6周)

內(nèi)容包含：(Touch端項(xiàng)目、微信場景項(xiàng)目、應(yīng)用Angular+Ionic開發(fā)WebApp項(xiàng)目、應(yīng)用Vue.js開發(fā)WebApp項(xiàng)目、應(yīng)用React.js開發(fā)WebApp項(xiàng)目)

第5階段：混合(Hybrid,ReactNative)開發(fā)(1周)

內(nèi)容包含：(微信小程序開發(fā)、ReactNative、各類混合應(yīng)用開發(fā))

第6階段：NodeJS全棧開發(fā)(1周)

內(nèi)容包括：(WebApp后端系統(tǒng)開發(fā)、一、NodeJS基礎(chǔ)與NodeJS核心模塊二、Express三、noSQL數(shù)據(jù)庫)

相關(guān)的視頻教程你需要的話，可以加一下我的交流群，里面都有，其他的資料也可以問我要。

前端學(xué)習(xí)路線是什么樣的？

自學(xué)前端路線：

第1階段：前端頁面重構(gòu)（5周）

內(nèi)容包含了PC端網(wǎng)站布局、HTML5+CSS3基礎(chǔ)項(xiàng)目、webAPP頁面布局項(xiàng)目

度2階段：JavaScript高級程序設(shè)計(jì)（5周）

內(nèi)容包含：原生JavaScript交互功能項(xiàng)目開發(fā)、面向?qū)ο筮M(jìn)階與ES5/ES6應(yīng)用項(xiàng)目、JavaScript工具庫自主研發(fā)項(xiàng)目

第3階段：PC端全棧項(xiàng)目開發(fā)（3周）

內(nèi)容包含：JQuery經(jīng)典交互特效開發(fā)、HTTP協(xié)議、Ajax進(jìn)階與PHP/JAVA開發(fā)項(xiàng)目、前端工程化與模塊化應(yīng)用項(xiàng)目、PC端網(wǎng)站開發(fā)項(xiàng)目、PC端管理信息系統(tǒng)前端開發(fā)項(xiàng)目

第4階段：移動(dòng)端項(xiàng)目開發(fā)（6周）

內(nèi)容包含：Touch端項(xiàng)目、微信場景項(xiàng)目、應(yīng)用Angular+Ionic開發(fā)webApp項(xiàng)目、應(yīng)用Vue.js開發(fā)webApp項(xiàng)目、應(yīng)用React.js開發(fā)webApp項(xiàng)目

第5階段：混合（HyBrid、RectNative）開發(fā)（1周）

內(nèi)容包含：微信小程序開發(fā)、ReactNative、各類混合應(yīng)用開發(fā)

第6階段：Node.js全棧開發(fā)（1周）

內(nèi)容包含：webApp后端系統(tǒng)開發(fā)（1.Node.js基礎(chǔ)與Node.js核心模塊 2.Express 3.noSQL數(shù)據(jù)庫）

自學(xué)前端路線圖：

相關(guān)配套視頻教程在這里：網(wǎng)頁鏈接。