零基礎學習web前端開發,看看一下建議少走彎路

時光程序圜 發佈 2020-01-12T12:07:03+00:00

1.先說一下學習完web前端之後能幹什麼學完web前端之後你可以開發網頁,做h5動畫,做手機端app,可以做自己的博客網站,可以做微信公眾號開發,可以開發小程序,可以結合nwjs做電腦客戶端軟體:比如微信的pc版,釘釘的pc版 都是web前端來做的2.


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.純js操作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特效方面的,要求就是非常酷,帥到沒朋友
第二個項目側重邏輯處理,用來升華你的邏輯能力
這兩個項目可以從網上搜幾個網站來模仿,之前我的學生有做過:蘋果官網,魅族官網,花瓣網,網易雲音樂,在行等很多網站,做的也很不錯。

關鍵字: