我是這樣學習前端的

前言

隨着前端的大熱，愈來愈多的從業者選擇入門前端，進階，以及後續可能成爲大神。可是不少人多是出於某個發展的瓶頸階段，不知道下一步應該學些什麼，應該如何檢驗本身的能力。

我從實習工做到今天，對前端從業四年半，也作過java研發，設計，產品的兼職。從事過中小公司的前端技術總監，但願本文給的一些建議能給你一些職業發展的啓示。

自我認知

• 本身的薪資水平，能力水平，最好創建下思惟導圖或者知識拓撲圖
• 本身的認知面：典型的認知四象限
• 本身的職業發展目標與規劃
• 本身近期的學習與提高計劃
• 本身工做效率，性格，執行力等

大前端認識

• ued方向，主要偏向產品、設計、程序結合方向，須要知曉產品以及設計的相關專業知識，作更好的前端成品
• 紮根基礎知識，不要以爲css，兼容，js基礎，很簡單就不去學，不去研究。行內的張鑫旭基於css2能研究十年，其中不少css的解決方案或者原理是不少人的知識漏洞。
• 大熱的前端框架：vue,react,ng須要所有知道，可是建議1-2年內只深刻學習、使用、研究其中一種，並對其成果作出總結。
• 打包，打包工具gulp,webpack,parcel也是不少人只知道皮毛就生成熟悉，這裏我只說先看下本身除了簡單的配置外，能針對webpack作出哪些優化配置，是否已是最優的了，仍是隻是官網api複製粘貼下來打包好就算結束了。
• 前端工程化：主要指的是規範，工具，開發流程，部署，監控，持續集成角度。
• 深刻編程模式，框架原理，代碼優化
• 後端方向，主要是以nodejs爲核心的後端框架express,koa等。
• 業務邏輯整理，這點是不少人可能會忽略的，當前端涉及愈來愈多的業務的時候，你可能必要的要懂一些流程圖，時序圖等。

學習四部曲

學習基礎知識

按照官網入門教程寫demo，積累一期的學習資源，包括官網、學習教程、學習視頻、某些人的專題博客。

項目實踐

毫無疑問，大多數公司的大多數項目可能用的都是最多見的技術知識，或者架構師已經搭建好的技術模型，可能更多你只是百度或者複製粘貼的過程。但你也會遇到技術或者邏輯上的問題，那麼你須要的就是把它記下來，項目完結後整理成解決方案。

技術進階

這個階段你作業務沒有任何問題能夠說，基礎知識也能得心應手，但差的是架構能力、深度、業務技術分析等。那麼你就須要從更深刻的角度作技術選型的分析、進一步學習。可以對比出某些技術在解決某些問題上對應的方案特色是什麼。可以針對某一特定話題提出本身完整、成熟的方案以及解析以及可能的更好的方案。

技術方案

當你完成大量積累以後，能夠嘗試本身作知識拓撲，本身的知識體系。網絡下對本身對公司友好的技術理論，結合具體需求給出高效方案。最好的方式就是：寫技術手冊，寫博客，而後與和本身同等或者稍高level的同行進行溝通討論優化方案。

職業發展

關注前端行業趨勢

• 技術趨勢，主流使用的框架，打包工具，優化方案，解耦方式等
• 公司用人趨勢，崗位jd核心技術點的要求指數，要求深度，能解決什麼問題。

關注技術來源

• github,知乎，cnode,vuejs,google,stackoverflow,react，前端網以及一些知名的公衆號
• 大牛的博客以及開源項目
• 書評較高的經典書籍，好比深刻淺出nodejs,css揭祕，你不知道的js，js編程，深刻理解bootstrap,html與css權威指南，pwa進階指南等
• 行內的技術交流會，好比d2,h5峯會等

學習與工做的迭代方式

• 選一款好的記錄軟件，好比印象筆記
• 選一款好的設備以及開發工具，好比mac+chrome+vscode
• 有本身的整理知識的方式，好比電子書，技術博客
• 有本身獨立在研究或者學習的項目，放在github進行託管
• 有高效工做與學習的整理方式，好比思惟導圖
• 有對技術以及其餘任何方面拓展延伸分析的執念，並就一個點達到最佳狀態

友情連接

最後奉上我我的總結的四本線上技術手冊，一直在整理，從未被完結。。。

• 兵哥乾貨鋪
• 前端技術指南
• 前端工程化指南
• 產品規範
• 職場那些事