[譯] 據說你想學 React.js ？

• 原文地址：So you want to learn React.js?
• 原文做者：Samer Buna
• 譯文出自：掘金翻譯計劃
• 本文永久連接：github.com/xitu/gold-m…
• 譯者：tv_哇
• 校對者：kangkai124 jonjia

據說你想學 React.js ？

首先，你須要接受一個事實，就是爲了使用 React 你須要學習除了 React 以外更多的知識。這是件好事，React 這個庫在某些場景下使用是很是棒的，但它並不能解決全部問題。

並且，請先確認你如今是否在學習 React，這主要是爲了避免讓你對學習 React 自己感到困惑。一個熟悉 HTML 和其餘一種編程語言的程序員，他應該可以在一天或更短期內 100% 的掌握 React。一個新手程序員應該在一個星期就能掌握 React。固然，這不包括用來完善 React 的工具及其餘庫，例如 Redux 和 Relay。

有序地學習是一件重要的事情，這個順序會根據你掌握的技能而有所不一樣。不言而喻，首先你須要對 JavaScript 自己有清晰的理解，固然， HTML 也是。我想在這詳細說明下，若是你不知道如何使用數組的 map 或 reduce 方法，或者你不理解閉包，回調的概念，又或者若是在 JavaScript 代碼中看到「this」使你感到困惑。那麼你尚未準備好學習 React ，並且在 JavaScript 的領域你還有不少東西須要學習。

首先更新 JavaScript 的知識並非一件壞事，主要是你須要學習 ES2015，並非由於 React 依賴它（事實也並不依賴 ES2015）。但由於它是一個更好的語言，所以大多數示例，課程和教程都會使用現代的 JavaScript 語法。具體來講，你須要如下內容：

• 對象字面量和模板字符串的新特性
• 塊級做用域 和 let/const 和 var 的區別
• 箭頭函數
• 解構和默認值／剩餘參數／擴展運算符
• 類和繼承（用於定義組件，可是避免其餘方式使用）
• 使用類字段語法和箭頭函數定義方法
• Promise 對象以及如何配合 async/await 使用
• 引入和導出模塊（最重要的）

你不須要從 ES2015 開始學習，但最終你仍是須要學習它（並非由於你正在學習 React）

因此除了 ES2015 之外的東西，要成爲一個高效的 React 開發者你還須要學習如下內容：

• React，ReactDOM，ReactDOMServer 的 API：這些 API 並非那麼經常使用，咱們平時用到的（談論到的）大概只有 25 個左右，你不多會所有使用到。React 的官方文檔 實際上它是一個很好的起點（它最近變得更好了），可是若是你仍是很困惑，能夠觀看在線課程，閱讀一本書，或者參加一個專門的研討會。你的選擇無窮無盡，但要當心你挑選的內容，確保它關注的內容是 React 自己，而不是它的工具和生態系統。

• node 和 npm：你須要學習這些（爲了 React）的緣由，是由於在 npmjs.org 上有不少的工具包，可讓你的編程生活更輕鬆。並且，自從 Node 容許在服務器端執行 JavaScript 代碼後，你能夠在服務器端複用前端的 React 代碼（同構／跨平臺應用）。大多數狀況下，你會發現配合像 webpack 這樣的模塊打包工具時，就更能彰顯 node 和 npm 的價值。更重要的是，當你編寫大型應用程序時，你至少須要一個工具來處理 JSX （忽略 JSX 是可選的建議）。學習並使用 JSX，推薦的工具是 Babel.js。
• React 生態系統庫：由於 React 只是一個構建頁面 UI 的語言，你須要結合其餘工具庫來完成頁面的展現和 MVC 實現。不要等到你對 React 很熟悉後纔開始這一步。一旦你完成 React 的學習，我建議你關注 react-router 和 redux 這兩個工具庫，忘掉你以前學習的東西，先學習這兩個庫。
• 在熟悉 React 自己的原始概念以後，立刻構建一個 React Native 的應用程序。你一旦這麼作，你將會只體會到 React 的美。相信我。

在你學習的過程當中，你能作到最好的事就是靠本身雙手構建東西。不要複製粘貼例子，也不要盲目地遵循說明，而是參照說明構建其餘東西（理想狀況下，你更在意的東西）。不管你作什麼，不要只作一個 TODOs 應用程序。

我發現構建簡單的遊戲比用數據驅動的嚴肅的 web 應用程序能更好地展現 React 的思想。這就是爲何在個人 React.js 入門課程中，我專一於構建簡單的遊戲。我還在個人《簡潔的 React.js》中構建了另外一個不一樣的遊戲，你能夠免費閱讀。嘗試在 JavaScript 在線開發平臺 中實現其餘相似的遊戲，這是一個好的開始，你不須要服務器，也不須要管理那些煩人的 state。

JavaScript REPL 和 React.js 開發平臺 經過jsComplete交互式實驗學習 JavaScript 和 React.js jscomplete.com

最近，我爲 jsComplate 建立了一個交互式的音頻學習工具。我測試這工具的第一個實驗是一個 React.js 的例子。若是你有作實驗，請務必留下你的反饋意見。

祝你好運並玩得開心！若是你提問得很好，我會很樂意的看看你第一個 React 應用程序並給你一些指導。

感謝您的閱讀，若是你發現這篇文章對你有幫助，請點擊下面的 💚，跟隨我發現更多關於 React.js 和 JavaScript 的文章吧。

---

掘金翻譯計劃 是一個翻譯優質互聯網技術文章的社區，文章來源爲 掘金 上的英文分享文章。內容覆蓋 Android、iOS、前端、後端、區塊鏈、產品、設計、人工智能等領域，想要查看更多優質譯文請持續關注 掘金翻譯計劃、官方微博、知乎專欄。