前端小白該如何學習？以及掌握哪些能力才能從事前端開發工程師
對於一些沒有程式設計經驗的人來說，一開始就學習 web 前端可能會讓你覺得比較困難。
因為你的能力還處在初始階段，你根本不知道你缺少哪方面的知識。
所以，在正式學習之初，你非常有必要先了解一下前端的能力模型。
前端工程師，都需要掌握哪些能力呢？
簡單粗暴點，只需要掌握這張圖裡的能力就行了。
開個玩笑，新手的話，還是要循序漸進。
LV1：學會製作靜態頁面（Web + Mobile）
HTML、HTML5：
理解如何瀏覽和建立網頁、基本的語法規範、常用標籤及屬性、網頁之間的連結與跳轉、標籤節點層級節點。
CSS:
基本語法和三種書寫位置、選擇器和格式化排版、盒模型的高階用法、常用佈局模型
LV2：學會製作動態頁面
JavaScript ：
基礎語法和變數、資料型別和資料型別轉換、條件判斷、迴圈語句、函式、陣列等內建物件
（有了這三個，你基本可以寫一些簡單的頁面了，但是仍然需要學一些經典的庫和框架。）
經典庫：比如 jQuery,YUI2,YUI3
經典框架：比如 Bootstrap
LV3：前後端分離，打造 Web App
Vue.js/AngularJS2/React
Node.js，使用 Express/Koa 配合 MongoDB/Redis 涉足到後端領域
自動化測試
其他：
熟悉 Git 與 Shell 的使用
學習路徑
1.入門 HTML + CSS
這裡推薦一本書，Head First HTML與CSS（第2版）。
從原理到方法都介紹得很詳細，通俗易懂，活潑有趣。html和css入門力薦。
學完大概 1-2 個周。
2.JavaScript + jQuery
JS：看 w3school 教程，花 2-3 天，但 w3school 教程有點過時，看完只能瞭解個基礎，深入學習的話，推薦看《JavaScript 權威指南》，《JavaScript 高階程式設計》。兩部都是大部頭。看完還需要在去網上找 ES6 資料學習，推薦 ECMAScript 6入門，深入淺出ES6。
jQuery 的話，去官方文件看即可。
熟練掌握大概需要1個月。
3.Vue.js/Angular 2/React
Vue.js：檢視官方中文文件大約需要 3 天左右。Vue 上手容易，但沒有其他前端框架使用基礎的人只看官方文件難以理解 Vue 高階用法以及在生產環境中的運用。目前 Vue 社群還比較小，除官方文件外難以找到優秀資料。
4.webpack & 測試
webpack 是目前應用最廣泛的前端模組管理工具，功能強大。
測試相關的框架多且雜，大多是社群產物，較難系統學習。
以上的這些資源足夠你學習幾個月的，但它們不會帶你走得更遠。
但是，如果你已經學了這麼多，你已經有足夠的能力去繼續前端的學習，直到你可以完美勝任一個前端工程師的要求。
最後留一點小的建議
你會經常地遇到 bug 和其它一些問題。這可能會讓人沮喪，但你要儘量保持冷靜，並系統地去思考。記住實踐是解決問題的最佳方法。
我們採集的是石頭，但是必須時刻展望未來的大教堂。
持續做一些小改進，慢慢地你就會驚奇地發現你的經驗得到了怎麼樣的發展，你的技能得到了怎樣的提升。
如果你迫切的需要提升自己的能力，自己從事前端五年了
這裡推薦一下我的前端學習交流群：784783012 ，裡面都是學習前端的從最基礎的HTML+CSS+JS【炫酷特效，遊戲，外掛封裝，設計模式】到移動端HTML5的專案實戰的學習資料都有整理，送給每一位前端小夥伴。最新技術，與企業需求同步，好友都在裡面學習交流，每天都會有大牛定時講解前端技術!
點選：加入