web前端工程師學習路線指南

沿着一條鄉間小路，走着走着，分叉愈來愈多，選擇也愈來愈多，迷路成爲了必然。

對於編程初學者來講，甚至「這條路」在哪都找不到。

今天，W3Cschool新手村村長將扮演指路人的角色，講解如何零基礎入門前端，學習前端，再也不迷茫。

1.入門

有人說：只要有恆心，鐵杵磨成針。這不對，學習重在興趣，而不在恆心。當你通宵達旦的玩遊戲，捧着本身喜好的名著談天說地時，不是由於有恆心，而是由於興趣。只有不感興趣的東西，才須要恆心的妥協。

因此請拋棄恆心，擁抱興趣。

一個好的啓蒙老師，不須要教會你任何本領，卻能培養你對一件事的興趣和良好的學習習慣。

對於廣大的前端學員來講，瞭解這個領域和培養學習興趣尤其重要，這意味着你能在前端這條路走多遠。

怎麼培養興趣？

1. 成就感；

2. 即學即用；

那麼，《Head First HTML與CSS》就成了最適合零基礎的前端學習書籍。

從書的封面就能夠看出，這是一本「重視大腦的學習指南」，看完本書，你對什麼是HTML、CSS就有了大概的一個瞭解，而且能夠編寫一些簡單的頁面了。

這本書有以下的幾個特色：

• 任務型教學，先發佈一個任務，再教你如何完成它；

• 插畫多，圖文結合，雖然有700多的頁數，但一小時翻50頁徹底不是問題，你能夠像看小說同樣，看它。

• 沒有難懂的專業名詞，一旦出現，就會花一整頁，甚至多頁來解釋它；

• 它能傳遞給你學習的方法，避免之後走彎路；

這本書是入門的絕佳讀物，但不是必須，你也能夠跳過它，但村長認爲仍是讀讀它。

2.HTML&CSS

若是你看完了《Head First HTML與CSS》，其實你已經學會了這兩個前端的基礎知識。你只須要豐富一下「詞彙量」，讓本身能作出任何的網頁就能夠了。

什麼是HTML和CSS？

一個畫家要畫一隻烏龜，得先畫出輪廓，再完善細節，最後塗上顏色，HTML和CSS乾的也是這麼一件事。

由於HTML和CSS很是簡單，村長並非很建議初學者看視頻，若是你以爲學習有困難，可直接看《Head Frist HTML與CSS》便可。簡單的事，不要花太長的時間。

豐富本身的詞彙量，最簡單快捷的方式，是直接閱讀W3Cschool的html和css文檔。

固然，你還須要瞭解一下他們的最新版本，html5和css3.

學完html和css，你就能夠獨立製做任何的網頁了，沒錯！在本地寫個淘寶出來，徹底不是問題。

若是你想鞏固下學習成果，能夠拿個實戰項目，練習一下.

3.JavaScript

與html和css不一樣，JavaScript是門真正的編程語言，因此學起來難度就大。

什麼是JavaScript？

仍是剛纔畫家畫烏龜的那個例子，這個畫家人們都叫他「神筆馬良」，他畫了只烏龜，而且給它塗上了顏色。

這時候，馬良將這隻烏龜「拉」了出來，成爲了一隻真正的烏龜，它能走路，也能吃東西。

再舉個簡單的例子，有時候登陸網站時，它會提示：

這個就是使用JavaScript寫的，html和css是不能動的，只有JavaScript能夠。

JavaScript做爲一門編程語言，很是強大，它有不少事能夠作，除了運用到前端領域，它還能夠作遊戲、應用等等，用途很普遍。

因爲JavaScript有些難度，若是你習慣了學習html和css的方式，能夠直

若是你喜歡看書，那麼推薦看《JavaScript高級程序設計》，這是一本對初學者很友好的書。

有些程序員會推薦《JavaScript權威指南》，俗稱犀牛書，村長並不推薦。由於它屬於中級讀物，對初學者不友好，但做爲經典的JavaScript書籍，仍是值得考慮的。

若是以上學習方式，你都不喜歡，或者太難理解JavaScript了，也能夠觀看視頻學習。

當你將HTML、CSS、JavaScript（前端三駕馬車）學完後，那麼恭喜你，你已經完成了前端學習的課程。

理論上，你已經能勝任前端的工做了！

4.前端框架

實際上，若是你只掌握了三駕馬車，那麼沒有公司會願意要你，由於實際上你的工做效率會極低。固然，僅僅是效率上的問題，而不是作不出來。

接下來，學習前端框架迫在眉睫。

什麼是前端框架？

若是隻會html、css和javascript，寫一個網站時，你須要一行代碼，一行代碼的寫，假如寫幾個簡單的頁面，天然不在話下。

但是若是讓你寫個像淘寶的網站呢？也許這個量是幾十萬行以上的代碼。

這時爲了提升效率，你將別人已經寫好的淘寶，拿了過來，放在了本身的網站上，而後稍微修改下代碼，讓它看起來和老闆的預期同樣。

因而另一個淘寶誕生了，你只花了一點點時間就完成了它。

框架，大概就是這麼個意思。

框架能夠說是一種工具，學起來很簡單，就像學習word、excel同樣簡單，框架是必學項。

框架有不少，咱們推薦你學習Bootstrap。

這個框架好用，重要的是簡單，適合剛學完基礎課程的你。

當學習完Bootstrap後，恭喜你，你能夠高效的完成工做，更加符合企業的用人需求了。

前端是一個隨時間變化很大的職業，新框架的運用，也成了不少企業用人的硬性要求。

最具表明性的就是三劍客：React.js、Vue.js和Angular。

你沒必要徹底掌握這三個，你能夠先學會其中一個，後續根據工做須要，再掌握其他兩個，甚至是不學習它們。

5.Git-管理工具

Git對前端寫程序沒有多大影響，但它一樣十分重要。

什麼是Git？

這個一個版本控制工具，能夠很好的管理代碼，而且共享給其餘同事。

Git更像是技術界的excel、word，它只是一個工具，方便管理你的代碼。一些稍成型的公司，均可能會使用它做爲管理工具，

所以，你最好學會它。

5.後記

自此，你已經具有了一個前端工程師的基本素質。前端的學習過程，是一個由「難」逐漸「簡單」，再由「簡單」變「難」的過程。

前半段是入門的過程

後半段是成爲大牛的過程

總之學前端只有八個字：明確方向，興趣主導！

僅此而已。