怎樣從前端小白到前端大神？

這個問題等你往深的接觸并有自己一定理解后你可能跟我一樣會對整個前端有新的認知。

過硬的基礎

這個問題可能不止一遍又一遍的強調，熟練運用( html, css, js)這并不意味著基礎就扎實了。你是否會遇到這樣的問題: 吐槽自己的代碼為什么沒有長進？吐槽新的框架出來了，可我連之前的版本還沒掌握？嘗試著翻閱源碼奈何根本讀不下去或者只是一知半解？因為這些問題都是發生在我的身上，我嘗試著去擴展自己的技術棧，然后小程序也會，web app也懂，服務端也略知一二，瀏覽器源碼...... 這些看似有著豐富經驗的回答，但實則暴露了一個問題，哪一個都是只知皮毛。后來我沉下心來，重拾基礎，慢慢的我代碼可以做性能優化，源碼似乎也看進去了。然后我發現基礎往深的鉆研，我似乎發現新大陸一樣。接下來給大家分享一下我的學習經歷; 依舊是基礎，并逐步展開。

html

重新把 html 知識點并且重點是 html5 的新特性再過一遍，對常用的語義化標簽，新增的 canvas，本地存儲，xhr，dom，bom api進行總結歸納。然后嘗試著封裝一些 api，對原始 xhr 進行整理等等，對于這些知識不需要刻意去弄懂底層實現，只要能夠熟練掌握并可以根據業務做到良好的擴展就可以了。

另外，這個權威指南看不下去就算了，找其中的重難點知識進行梳理。

css

我不知道以后會不會出現 css4 ，但就目前而掌握 css3 已經相當不錯，在前端領域對樣式掌握到手到擒來絕非易事(并不是熟練應用各種類庫，插件)。我當初學習樣式始于興趣，終于瓶頸，不過目前依舊在學習嘛。學習樣式最快而且最容易上手的是拿現有模板去實現交互效果。舉例，以實現天貓靜態頁為依劇，不管你用什么前端框架做輔助( jquery)，一定要手寫，既鍛煉了html，也能快速css，css3。如果遇到難點，查閱資料(科學上網)，或者控制臺查其網頁實現，然后就往深層挖掘。

然后就是這本書，很有必要讀一讀。

JavaScript

前端的核心，從web端，到移動端，到客戶端，再到服務器，都可以看到js的身影。你抱怨自己編程能力沒有長進，抱怨源碼讀不懂都和不理解它有密切關系。js 的類型和語法、作用域和閉包、this 和對象原型鏈、異步和性能、es6 新特性( promise、proxy)。這些是從基礎到進階，每一塊都必須深入掌握，越深越好。

不管你是否造輪子，也或者你正忙于業務開發，真正阻礙你前進的便是這些大山，去掌握它們，鍛煉自己的內功。

不管你之前讀的是犀牛書，紅寶書還是官方web文檔mdn，我現在只想推薦你認真讀一下這個系列。

前面說了一大堆關于基礎的問題，前端也不止這些但不管怎么說基礎必須過關。

類庫及框架

有了基礎，相信你應該不懼目前的各類框架，mvc也好，mvp也罷，mvvm( vue, angular, react )也都ok。保持你的深度，然后擴展技術棧，這個時候你不用擔心翻看源碼的問題，相信你能快速掌握。

掌握node

以前端代表服務器開發node為主，你不會陌生，有了基礎什么事件循環( even loop)、任務隊列、異步回調，掌握它們只是時間問題，當前這些是 js 引擎和瀏覽器機制相關的問題。然后就是至少熟悉一種后端語言，數據庫知識( sql, nosql)。

web api

掌握瀏覽器的渲染機制，緩存機制，安全問題，性能優化，網絡io，同源策略等等

算法和設計模式

最后補充一個就是它，提示自己的邏輯思維和編程能力，算法必不可少。掌握設計模式通樣可以便于我們對代碼的掌握，以及性能優化，重構等工作。

沒事了也刷刷題訓練一下思維能力。

寫在最后，說了這么多還是想重點提及的是基礎。我也一直在學習，希望能夠同大家一起進步。