前端菜鳥是這樣入門學習web前端的，請點進來！

如今從事IT方向的人有不少。因爲Web前端薪資水平高，職業前景廣闊，崗位缺口大，就業口徑寬，想經過學習Web前端開發從而進入到該行業工做的人愈來愈多。固然也有不少人在猶豫不知道web前端開發都學哪些內容？零基礎的能夠學會嗎？好很差學.

前端涉及到的東西太多了，本身也很浮躁，看了挺多書，但是代碼缺敲得卻很少。技術菜，又什麼都想學，好比如今糾結要不要先學scss或者php或者angularjs,backbone等框架，仍是深刻學習html5+css3？

在我看來前端這20%的東西大概就是經常使用的html標籤，css的盒子模型，基本的原生js，以及熟練使用jquery，ajax，常見瀏覽器的兼容。拿下這些東西意義非凡，一方面證實你適合作前端這份工做，另外一方面這些技能能讓你找到一份工做。讓你可以從容地去學習剩下的80%。

總之就是專心對付最重要的東西，那些什麼less、sass、angular這類的東西，當你把我以前說的基礎打好以後，學習起來暢通無阻，隨學隨用。最後我以爲最難的就是實踐，只有實踐才能學到真正的技術，新人很難參與一些有價值有意義的項目，沒有這些項目又很難成長，因此本身有項目可參與應該珍惜，沒項目應該多造一些有價值的輪子。

怎麼零基礎學習web前端。

1.先說一下學習完web前端以後能幹什麼

學完web前端以後你能夠開發網頁，作h5動畫，作手機端app，能夠作本身的博客網站，能夠作微信公衆號開發，能夠開發小程序，能夠結合nwjs作電腦客戶端軟件：好比微信的pc版，釘釘的pc版 都是web前端來作的

2.怎麼開始學習

兩條路：自學或者找培訓班，這塊咱們一點就過，我主要講下怎麼去自學。

對於自學最直接的方式就是看視頻學習，能夠是在線視頻

視頻找好了以後，若是你不想中途放棄，或者，浪費太多時間又沒效果的話。就找找一個引路人，引路人固然是能力越強越好，找引路人的目的在於爲你制定學習計劃，把控學習質量，及時糾正錯誤的學習方向，教你正確的學習方式。給你作心理輔導。爲你及時打氣持續性補充你的信心。

我以前接觸和輔導過不少自學的學生，有成功的也有放棄的，放棄的那些同窗基本都是輸在錯誤的學習思路和心理迷茫期。聽他們抱怨說：沒有人去指導他們，天天學完就學完了，次日接着學，可是東西太亂都串不起來，也都不知道是幹嗎用的，尤爲是js部分，這種問題徹底能夠把一我的摧毀！因此 我一直對個人學生強調：有問題必定要去問，去解決，千萬不要不懂裝懂，弄明白了再往下走，人的心理是很脆弱的，一旦倒了可能就再也站不起來了。敬告各位新入行的同窗，除非你以前有過編程經驗，否則就找個引路人指導你。

3.列一個學習大綱

01.環境搭建

前端環境很好搭建，一個開發工具便可，webstorm，hbuilder，vscode，sublime。初學者建議sublime 也不要裝插件，沒有語法提示，能夠打基礎

02.html基礎

帶你去認識html，讓你學習去運行html，等瀏覽器上面打開你的頁面的時候，你會有很強的成就感，而後開始學習html的基礎標籤

03.css基礎

html是勾勒，css是染色，基礎的css學完你會有種想寫頁面的衝動，這時候你不用抑制住那種感受，直接按照本身所想開寫，這是你的第一個項目

04，js基礎

js是頁面的邏輯，做爲一個web前端工程師，js是很核心的部分，也是很難的部分。js的學習以後放長一些，尤爲是前一週，要讓本身去熟悉那種語法環境，培養本身的開發思路，並且有一點就是學完一個星期的知識以後，及時和你的指引人溝通，看卡本身的理解是否有誤，還有就是學習思路是否有問題，他會給你指出那些東西須要多學習，哪些不經常使用，還有就是給你點一下你學的這些在項目中會是怎麼去應用，理論聯繫實際是最好的學習方式。

05.純ja操做dom和jquery

這階段要知道怎麼去用js來更改頁面的元素，怎麼去寫dom事件，通過一番聯繫後，再引入jquery，不要本末倒置，有個同窗學完jquery以後說發誓之後再不用原生js操做dom！而後被我狠狠罵了一頓

06，開始你的ui框架之旅

這個階段我推薦從bootstrap開始，這個框架很經典，響應式的珊格系統被後來框架一直沿用，在我線下教學的那幾年，我都會帶着學生一塊兒看bootstrap的源碼，讓他們學會這種設計思想，由於以後對他們太有用了，當時他們很痛苦，如今他們提及來以爲很受益，若是能夠，你也要去看看源碼，先學會去定製bootstrap，公司注重二次開發，定製 bootstrap正好能夠練手。

07.開始深刻css3

基礎學完css3要提上日程，這時你會看到不同的世界

08.深刻js

這階段你就要去解讀原型鏈，原型替換，this指向，es6，es7的新語法，

09.學一套主流mv*框架

vue，react，angular2選一種，

我建議從vue開始，react的jsx語法不適合你入門去學習，angular2的typescript語法糖難度也比較高，vue學起來平滑些，結合vue，學一下vue-router，vuex，element ui，axios，webpack。作個項目玩一下這個全家桶

10.升級後臺語言nodejs

這個不做要求，你在學vue的時候其實已經在用nodejs了，你用的npm就是nodejs的一部分，這個階段說的是nodejs編程，比較難理解，畢竟是寫服務器的東西，不過前面基礎打牢固，讓別人一點撥就能上手，技術不難，難在思路轉換。

3.總結作項目

兩個項目，

一個是側重於css特效方面的，要求就是很是酷，帥到沒朋友

第二個項目側重邏輯處理，用來昇華你的邏輯能力

這兩個項目能夠從網上搜幾個網站來模仿，以前個人學生有作過：蘋果官網，魅族官網，花瓣網，網易雲音樂，在行等不少網站，作的也很不錯。

4.面試技巧培養階段

這個階段要培養下公司項目的具體流程以及面試技巧的培養，面試回答思路，若是有同窗想多瞭解這方面，我很樂意給你們講解

由於如今web前端這個職業很是火，這個不是最重要，重要的在五年以後，web前端發展前景是勢不可擋的。可是我如今看到的問題是，你們看到web前端這個職業發展很是好，將來前景也是很是好，掙錢也是很是多，可是你們都忽略了一個東西，既然是這麼好的職業，那麼它必定沒有那麼容易讓你勝任這個工做，咱們都知道如今前端的競爭很是大，而這種競爭是在新手之中的競爭，在初級工程師、中級工程師、高級工程師是沒有競爭的，不少人眼紅前端工程師工資這麼高，本身也想這樣去拿高薪，可是你們不知道當初這些人在學習前端的時候是怎麼學習的，纔有今天，爲了不你們有這樣錯誤的思想，我給你們下面幾個建議：

1、在現在前端開發競爭這麼激烈的時代，千萬不要着急去找工做，尤爲是不可相信那種速成四個月培訓，而後去找工做的，你們不妨想一下，五年的速成和五年後的速成，找工做的性質能同樣？五年的差距，最後還用同一個方法速成，你以爲工做好找嗎？

2、如今的前端不是以前的網頁製做，如今的前端更加高端，新手學習前端必須有一個學習規劃，有一套系統的學習方案，這個方案的學習時間最好是半年，天天應該學習什麼，內心應該有數，每一個知識點應該作什麼案例，並且要天天堅持學，一天都不能夠停，一旦停了就不想學習了，因此說如今學習前端不是智商的問題，看誰能夠慢慢的挺過去，韌性強。

3、要有人去指導，其實這個我好像談了無數次，如今一個新手想要所有經過本身學習前端，而且找到工做，首先這種可能性很是的小，若是誰能單憑本身一我的的力量自學前端找到工做，那麼這我的必定是一我的才，可是這種人只有1%，因此必定要有一個能夠幫你解決小問題的人，否則會走不少彎路，得不償失。

若是你們對於學習前端有任何問題，學習方法，學習路線，如何學習有效率的問題，能夠隨時來諮詢我，或者缺乏系統學習資料的，我作這行年頭比較久，自認爲仍是比較有經驗的，能夠幫助你們提出建設性建議，603985993這是個人web前端交流qun，有任何問題能夠隨時來諮詢我。