前沿
算算時間今年（2016年）是進入前端開發這個領域第五個年頭，自從上次總結完《我的程式設計之路》後，還想從更細節的方向上寫一寫自己是如何學習前端開發，並且還能夠保持進步和對技術的敏感。
對於現在進入這個領域的朋友們來說，很多東西其實你都可以選擇放棄了，因為你的起點比之以前要提高了不少，但相對來說知識點又多了很多。PS：至少你不用去相容IE6了。
來看一看JavaScript的趨勢圖：
JavaScript 2016年5月 TOP 10
JavaScript 趨勢圖
Github 2008-2015統計
雖然前端領域屬於一個比較新的領域，但是至少它也發展了有很多年了。回顧從前，Web前端開發最基礎核心的三劍客：HTML，CSS，JavaScript，可能還需要包括Flash系列，而現在除了Flash（如果你不是直播視訊領域的話），基本上還擴充了HTML5，CSS3，ES2015，以及各種框架（backbone,react,angular等）。
角色的定義
前端開發也應該是軟體開發工程，所以優秀的軟體開發工程需要具備的知識，你也應該需要具備。
- 良好的數學邏輯
- 良好的資料結構與演算法
- 作業系統
- 編譯原理
- 計算機系統體系
當你具備良好的基礎知識時，對於程式設計二字才可能理解的更透徹。後續你才能進一步的去學習軟體設計模式，標準，這些哲學範疇的思想，就好比你認識了漢字，才能閱讀完一篇文章。
當然如果你在學校學習的非常好，下列的學習資源推薦就當是複習吧。
學習資源推薦
- 數學邏輯可以觀看 網易公開課 或者 iTunes U
- 演算法或者資料結構，你可以在https://leetcode.com/上刷題來練習
- 作業系統，我建議你閱讀 《作業系統精髓與設計原理》 即可，如果理解起來費勁你可以繼續去公開課 或者 iTunes U上搜尋視訊資源。PS：放心吧，肯定有。
- 編譯原理，推薦在 iTunes U 搜尋 馮博琴老師 的教學視訊。
- 計算機系統體系有非常多的知識點，你可以繼續搜尋教學視訊來觀看。
無論何時你都不能丟掉 HTML，CSS，這個問題在我的身上也出現過，過去很長的時間內我基本不怎麼會 CSS，這也意味著當我需要去繪製UI時往往效率不高。
其實，這個問題還是牽扯到了如何分配學習資源的問題，歡迎大家來討論《JS開發和重構這樣的分工是否正確，JS開發者還需要繼續深入學習CSS嗎？》。
如果你的基礎知識還不夠牢固，我推薦你閱讀一下 角色的定義 ，看一看你需要補全哪些方面的知識。如果你感覺你的基礎知識還可以，請往下看：
首先，我推薦大家先閱讀一下 重新介紹 JavaScript（JS 教程） 和 層疊樣式表 (Cascading Style Sheets)
無經驗的同學 我推薦你先使用 freeCodeCamp來學習基礎的語法，配合 JS bin來練習。另外，你還可以觀看 慕課網 中的 HTML/CSS/JavaScript入門教學視訊來提高你的運用水平。
有其他語言開發經驗的同學 我推薦你直接學習一門框架，比如React或者Vue，先做一個小專案，比如React官方提供的To do應用，在這個過程中，你也基本熟悉了JS的語法，使用方式等。你可能還需要 Devdocs 來檢視Api，這一點非常重要。
當你渡過了入門階段之後，如何提升可能會是你目前迫在眉睫的需求。回到Web領域，我們來看它的本質。本質是你所有的工作都在圍繞著 請求 在處理邏輯。我認為提升的第一步是去研究 HTTP ，當你熟練掌握了 HTTP 以及它身後的 TCP之後，你才會真正理解Web開發的含義。（多執行緒處理，事件迴圈，快取等等這些手段，不都是在如何處理請求麼？）沒事翻一翻《HTTP權威指南》還是有好處的。
套用一句老話，如果你的基礎不紮實，一切都是“浮雲”。
具備良好的視野
良好的視野是你能看清楚趨勢
如果你現在還準備去學習 Flash ，那我只能說你的視野都被狗吃了。至少你可以通過社群來了解 前端 的發展動態，去了解出現了哪些新的框架，更新了哪些新的Api或者屬性。未來一段時間內，國內或者國際廠商會使用哪些技術等等。
最次一些的，你還可以關注 Github 來了解專案的趨勢。當然，你也可以閱讀https://www.awesomes.cn/rank?sort=trend
瞧瞧這些年裡前端發展的變化：
- 從框架層面開始：backbone -> angular -> react
- 工具生態：grunt -> gulp -> webpack
- 語言：JavaScript 1.3 -> ECMA 5 -> ECMA 2015，CSS2.1 -> CSS3.0，XHTML -> HTML4.0 -> HTML5.0
- Firefox OS （雖然它掛了）
- 桌面應用：NW.js -> Electron
- 出現了Node.js和Mongodb
- 服務端框架：Express -> koa
- 移動應用：PhoneGap -> Cordova | ionic -> React Native | weex
- 語法檢查：jslint -> eslint
- 模組化：AMD | CMD -> Commonjs -> import export
- 語法增強：CoffeeScript -> Dart -> TypeScript
… 舊技術雖然消亡了，但它們留下的思維啟發永在。說不完的變化與發展，擁抱變化用心去體會吧。
戒浮躁，定乾坤
隨著前端生態圈的繁榮出產了更多的框架和解決方案。
更久遠之前我們是這樣寫前端的：
使用jQuery來編寫大量的業務邏輯和效果，圓角我需要四個圖來拼接。
2010-2016年的三個階段：
- 使用backbone的MVC組織原始碼，大量的使用jQuery外掛的形式來構建UI介面，那個年代僅用了Grunt 來處理一些合併，壓縮的事情。
- 構建工具換成了Gulp，對於業務進行了模組化分層（requirejs），研究angular.js來編寫富應用程式。
- 通過元件（react）來構建我們的Web頁面，使用webpack來構建模組化和優化，平臺向移動遷移，研究React Native這樣的混合開發方式，並且使用上了ES6。
生態圈的繁榮也容易讓人產生選擇困難症，東西越多越難選擇，害怕今天剛學習了就被淘汰的心理。這個時候，我想最好的方式就是要戒浮躁，看著東西很多，其實選擇一項，也足以。當你成為一個框架的大師時，你還害怕不能成為另一框架的大師嗎？專業這個東西除了經驗的積累和沉澱，最重要的本質是它們都是互相通順的。
目前，我選擇了研究和使用react這樣的生態做為自己的框架技術棧，從中學習也應用在公司的產品中，隨著深挖它的原始碼，反而發現自己對於技術的理解又有了一次提升。
做事更要學會思考
對於剛剛參加工作的同學來說，思考比做事更重要。如果你為了業務而業務，不停的去堆積，只能說過些年你還是如此。去好好的想一想，程式設計到底是在做什麼？
提出問題自問
- 怎麼才能寫好程式碼，有時候潔癖或者說強迫症很可能會是你的原動力。
- 是不是該主動的去重構程式碼
- 我們需要對於業務程式碼進行一些分層嗎？
- 我寫的程式碼有沒有符合團隊制定的程式設計風格
- 我是不是該使用語言提供的Api，比如陣列中的push，pop等。
- 公司使用的框架，我理解了嗎？
只有自己主動了，去思考了，才可能發現自己的很多問題，有時候自省也非常的重要。
學習Node
說真的Node.js在公司內部用於Web開發的場景並不是很多，僅僅是有一些嘗試前後分離的專案，體驗上來說依然不夠友好。但是，這樣的一個環境執行時，我認為是有必要學習的。更多的不談，做為一個技術補充，它也是非常棒的。你可以先閱讀 七天學會NodeJS 來入門，至少有一個普遍的瞭解。其次，建議你學習一個Web開發框架，比如 koa，然後，學習一下 Mongoose 來驅動資料。
重要的是你應該一無既往的深入學習服務端的思想與知識。
堅持寫作
堅持寫作，是沉澱經驗的最好機會
所謂的溫故而知新，專業在向前發展，接收的大量資訊，在人腦中是有侷限性的。很多知識，只會存在於一個印象或者一個引子，而寫作不僅僅是分享，也是在沉澱你自己的經驗。（這一個部分就不浪費篇幅了，我相信做為一個技術專業者，你應該懂的。）
而且寫作還能讓你和其他開發者針對一個問題展開討論，何樂而不為呢？
提高工作或者學習的效率
提高工作或者學習效率應該是一件非常重要的事情，首先應該需要合理的制定任務與時間，我相信 trello應該會是一個非常好的工具，來制定Task。
其次，你還應該紀錄自己的程式設計時間，用來了解每天都在編寫哪些程式碼。你可以使用WakaTime來分析你的程式設計。
在學習過程中，你也可以使用jsbin來執行你的程式碼，觀察結果。
最後我認為你需要善用Chrome的書籤，將一些資源進行合理的分類。
推薦列表
- Pocket：收集和分類文章資源
- 在Chrome商店中搜尋 DHC ，Postman，JSON Editor ：處理請求測試，JSON編輯和格式化
- Web 技術文件 ：火狐提供的Web技術文件，查詢的好幫手
- http://caniuse.com/ ：查詢CSS3,HTML5的支援度
- https://kangax.github.io/compat-table/es6/ ：查詢ES6的支援度
- Devdocs ：框架文件集合
- Travis-CI ：持續整合，我認為如果你善用它，可以幫助你解決很多事情
- HTML5 Test ：開啟這個網頁可以將你使用的瀏覽器對HTML5的支援情況列印出來
學習任何一門技術，最重要的是要有耐心和恆心，不然一切都是“浮雲”。