前言
倘若你正在建造一間房子，那麼爲了能快點完成，你是否會跳過建造過程中的部分步驟？如在具體建設前先鋪設好部分石頭？或直接在一塊裸露的土地上先建立起牆面？
又假如你是在堆砌一個結婚蛋糕：能因爲上半部分裝飾起來更有趣，而直接忽略了下半部分？
不行嗎？
當然不行。衆所周知，這些做法只會導致失敗。
因此，不要想着通過接觸 React 來將 ES6 Webpack Babel React Routing AJAX 這些知識一次性學會。因爲想一下，就能明白這難道不正是導致學習失敗的原因嗎？
既然我把該文章稱作是一條學習路線，那麼每一次都應該走好每一步。既不要嘗試去跨越，也不要貪步。
一步一腳印。若把其置身於每一天的那麼一點時間，那麼也許幾周就能把整個學習完成。
制定該路線的主要目的在於：使你在學習過程中避免頭腦不堪重負。因此，請腳踏實地地去學習 React 吧。
當然，你也可以爲整個學習過程制定一個可打印的 PDF 文件，以便在學習過程中能夠查記。
零：JavaScript
在學習之前的你，理應對 JavaScript 有所瞭解，或至少是 ES5 標準下的 JavaScript。可若瞭解甚少，那麼，你就應該停下手頭上的工作，學習好該基礎部分後，纔可邁步前行。
可倘若早已熟知 ES6 所帶來的新特性，那麼請繼續。因爲如你所料，React 的 API 接口在 ES5 和 ES6 兩標準間存在着較大的差異性。所以對於你來說，熟悉兩種標準其特性的不同至關重要。儘管發生了異常，你也可以通過兩種標準之間的轉換，尋找出廣泛有效的答案。
一：NPM
NPM 在 JavaScript 世界中，可謂是軟件管理方的王者。然而，在這裏你卻並不需要學習太多關於 NPM 自身的東西。只要在安裝好後 <wbr>（連同 Node.js），學習如何使用其安裝軟件即可。（
npm install <package name>
）
：React
學習一個新的編程技術，我們往往會從熟悉的 <wbr>Hello World <wbr>教程開始。首先，我們可以通過使用 React 官方教程所展示的原生 HTML 文件來實現，而該文件包含有一些 <wbr>
script
<wbr>標籤。其次，我們還可以通過使用像 React Heatpack 這樣的工具來快速上手。
嘗試一下該三分鐘運行起 Hello World 的教程。
第二步：構建後摒棄
由於這一步是一個棘手的中間過程，所以往往會有大量的人忽略了該步。
謹記，請勿犯這樣的錯誤。因爲，倘若對 React 的概念沒有一個穩固的掌握而擅自前行，那麼，最後只會對自己的大腦搪塞過多的知識，以致遺忘。
當然，該步需要一定時間的斟酌：該構建什麼呢？是工作中的一個原型項目？還是能貼合於整個框架的一些 Facebook 克隆項目呢？
其實，我們應該構建的都不是這些項目。因爲，它們要不是包裹過甚，以致無甚可學；要不是過於龐大，以致成本過高。
尤其是工作中的“原型項目”，它們更爲糟糕。因爲在你心目中，早已明白這些項目並不會佔有一席之地。況且，該類項目往往會長期駐留在原型階段，或變成線上的軟件。最終，你將無法摒棄或重寫。
此外，把原型項目當作學習的項目將會爲帶來大量的煩惱。對於你來說，你可能會就未來的因素考慮一切可能發生的事情。而當你認爲這不僅僅是一個原型的時候，你就會產生疑惑 —— 是否要測試一下呢？我應該要保證架構能延伸擴展……我需要延後重構的工作嗎？還是不進行測試呢？
爲了解決該問題，我希望能用上我所寫的一篇指引《爲 Augular 開發者所準備的 React》：一旦你完成了 “Hello World” 的基礎課程，你將如何去學習 ”think in React” 的課程。
在這裏，我有一些個人的提議給到大家：那就是，理想的項目是介乎於 “Hello World” 和 ”All of Twitter“ 之間。
另外，請嘗試去構建一些官方文檔列表中所展示的項目（TODOs、beers、movies），然後，藉此學會數據流（data flow）的工作原理。
當然，你也可以把一些已有的大型 UI 項目（Twitter、Reddit、Hacker News等）分割成一小塊來構建 —— 即把其瓜分成組件（components），並使用靜態的數據去進行構建。
總的來說，我們需要構建的，理應是一些小型且可被摒棄的應用程序項目。這些項目必須是可摒棄的。否則，你將深陷於一些不爲重要的東西，如可維護性和代碼結構等。
值得提醒的是，如果你曾經訂閱於我，那麼當《爲 Angular 開發者準備的 React》發佈的時候，你將會第一時間收到通知。
三：Webpack
構建工具是學習過程中的一個主要的難點。搭建 Webpack 的環境會讓你感覺是一件繁雜的工作，而且，完全不同於 UI 代碼的書寫。這就是爲什麼我要將 Webpack 放在了整個學習路線的第三步，而不是第零步。
在這裏，我推薦一篇名爲《Webpack —— 令人疑惑的地方》的文章，作爲對 Webpack 的簡介。此外，該文章還講述了 Webpack 本身所具有的一些思考方式。
一旦你清楚 Webpack 所負責的工作（打包生成各種的文件，而不僅僅是 JS 文件） —— 以及其中的工作原理（適用於各種文件類型的加載器），那麼，Webpack 對於你來說將會是一個更爲欣喜的部分。
四：ES6
如今，進入了整個路線的第四步。上述的所有將會作爲下面的鋪墊。之前，在學習 ES6 過程中，所學到的部分也將會讓你寫出更爲利落簡潔的代碼 —— 以及性能更高的代碼。回想起一開始那時候，某些問題本不應卡住在那 —— 但現在的你，已然清楚知道爲啥 ES6 能完美地融合在其中。
在 ES6 中，你應該學習一些常用的部分：箭頭函數（arrow functions）、let/const、類（classes）、析構（destructuring）和 <wbr>import
五：Routing
有些人會把 React Router 和 Redux 這兩個概念混爲一談 —— 但是，它們之間並沒有任何的關係或依賴。因此，你可以（也理應）在深入 Redux 之前學習如何去使用 React Router。
由於在之前“think in React”的教程中，積累了堅實的基礎。因此，相比於第一天學習 React Router，我們此時更能從基於組件（component-based）的構建方式中，領悟出更多的精髓。
六：Redux
Dan Abramov，作爲 Redux 的創造人，他會告訴你們不要過早地接觸 Redux。其實，這是有緣由的 —— Redux 其複雜度在早期的學習過程中，將會帶來災難性的影響。
雖然，在 Redux 背後所隱藏着的原理相當簡單，但想要從理解躍至實踐，卻是一個很大的跨度。
因此，重複第二步所做的：構建一次性的應用程序。通過些許的 Redux 經驗，去逐漸理解其背後的工作原理。
非步驟
在前面列出的步驟中，你曾否看見過”選擇一個模板項目“的字眼嗎？並沒有。
若僅通過挑選大量模板項目中的其中一個，去深入學習 React。那麼，後面將只會帶來大量的疑惑。雖然這些項目會含有一切可能的庫，且規定要求一定的目錄結構 —— 但對於小型的應用程序，或開始入門的我們來說，並不需要。
該如何應對
對於 React 來說，雖然有大量的學習計劃需要採取，且有大量的東西需要學習 。
但一切需要循規蹈矩，一步一腳印。
如何快速的學會使用VUE##
- 用vue的朋友大都用過jQuery，而且都感覺jQuery用得很順手，要控制哪個元素就控制哪個元素,但這裏我不是要講爲什麼要用vue，而是講如何快速的學會使用VUE，從實現方法的角度來講。
一、輸入與輸出場景：一個文本框的內容顯示到div或label等元素內
jQuery的實現方式:
$('#divId').text($('#txtId').val())
Vue的實現方式：
<input type='text' v-model="inputvalue">
<div>{{inputvalue}}</div>
vue不用做額外的工作，只要在標籤內綁定好vue數據就可以
二、表格修改場景：一個數組循環生成一個Table，然後對每行編輯
- jQuery的實現方式：A、js生成字符串，然後寫入div中；B、引用模板方法，然後寫入模板展示區；
對table中的修改，讀出修改行的文本數據，修改後替換，流程複雜，代碼量不小，我就不上代碼了；
Vue的實現方式：##
- 在tr標籤中增加v-for="(item,index) in tabledata"方式實現，對tabledata的直接增刪改後無需對展示的table標籤做任何操作；
三、事件：button事件的綁定
-
這個和jquery相比，基本上差不多，jQuery可在頁面加載事件中綁定事先寫好的方法，也可直接用onEvent方式綁定事先寫好的方法，vue是用@事件="事先寫好的方法名稱"來綁定，所以這個沒什麼好說的
-
總結：用vue開發時，要想着如何通過修改數據來改變顯示內容；用jQuery開發時，要想着如何通過選擇器來直接改變顯示內容；這是兩者最大的區別；
學習Node的總結的線路##
一.Node以JavaScrip爲實現語言
- Node起源於2009年，當時Ryan Dahl正在探索基於對功能web的服務器的探索，而Ryan將JavaScript最爲首選，是因爲他發現設計共性能的web服務器應該具備事件驅動，非阻塞I/O操作，而相較於其他語言，JavaScript可以滿足這種需求並且學習起來的門檻低
二.Node名字的真正含義
- 剛開始Ryan稱項目爲web.js，但是項目的發展超過了他起初單純開發一個web服務器的想法，編程了一個構建網絡應用的一個基本框架，可以在此基礎上構建更多東西，所以將起名爲Node，表示每一個node進程構成了網絡應用中一個節點。
三.Node爲什麼這麼火？
- 由於gooleV8引擎的發佈，commonJS規範的提出，不斷完善了JavaScript。而且在開源社區GitHub上，Node高居第二，而且nmp上面模塊的數量和下載量也非常的驚人，並且express,socket.io的優秀框架有機構的排名
四.Node給JavaScript注入了新的力量
- JavaScript作爲一門圖靈完備的語言，長久以來卻只能限制在瀏覽器沙箱中運行，不過在Node中，JavaScript卻可以隨意的訪問本地文件，搭建webSocket服務器，可以連接數據庫，可以像webWorkers一樣玩轉多進程
五. Node無與倫比的優勢
- 異步I/O操作，就如同發起了Ajax請求
事件與回調函數，事件具有輕量級，鬆耦合，關注事務特點
單線程，與其餘線程不共享任何狀態
跨平臺，linux和window下都可以運行
六 .學習Node的總結的線路
- nodejs基礎視頻，點擊收看
nodejs框架express，socket學習視頻
深入淺出Node.js
動手實踐node.js小案例 -
本次給大家推薦一個免費的學習羣，裏面概括移動應用網站開發，css，html，webpack，vue node angular以及面試資源等。
對web開發技術感興趣的同學，歡迎加入Q羣：582735936，不管你是小白還是大牛我都歡迎，還有大牛整理的一套高效率學習路線和教程與您免費分享，同時每天更新視頻資料。
最後，祝大家早日學有所成，拿到滿意offer，快速升職加薪，走上人生巔峯。