React學習資源彙總

龍逸軒發表於2018-06-05
React

React 官方

  • 官網地址：http://facebook.github.io/react/
  • Github地址：https://github.com/facebook/react

設計思想

學習React之前，我們先了解一下它的設計思想，它與如今其他熱門的前端框架有什麼不同？它能為我們的開發解決哪些痛點？

  1. React 設計思想
  2. React的設計哲學 - 簡單之美
  3. 顛覆式前端UI開發框架:React

初學者入門

文章

可以結合一些簡單demo去看文章，例如你在看阮一峰的React 入門例項教程時，可結合他寫的入門demo，或官方給的demo。當然你也要邊學習邊自己去寫一些簡單demo，去改改別人寫的一些React 專案。一定要多動手。

  1. React 入門例項教程-阮一峰：建議先看demo
  2. 一看就懂的ReactJs入門教程（精華版）
  3. React 教程-菜鳥教程：安裝那節好像有點錯
  4. React 入門，5個常用DEMO展示
  5. 如何學習React
  6. 給新手的 React&Webpack 上手教程
  7. ReactJS 傻瓜教程
  8. React 最簡單的入門應用專案

入門 demo

  1. 官方入門 demo：可結合官方的入門文件
  2. 入門 demo-阮一峰：結合入門文章
  3. 模仿知乎介面的一個簡單React demo：結合 ReactJS中文基礎視訊教程-愛酷

入門視訊教程

一定要邊看邊寫，不要囫圇吞棗的看一遍就好了。

  1. React入門-慕課網
  2. ReactJS中文基礎視訊教程-愛酷
  3. ReactJS中文視訊教程
  4. React教程- 匯智網

入門實戰視訊

瞭解React開發流程，作者的編碼思路，寫作規範。

  1. React實戰--打造畫廊應用（上）
  2. React實戰--打造畫廊應用（下）
  3. ReactJS中文基礎視訊教程
  4. 構建實時聊天應用

開發文件

開發其實不用詳細去全看，在你做專案時，遇到不懂的就去檢視一下文件，我認為這樣效率更高一點。當然你有時間也可以一步步去閱讀。

  1. 官方文件
  2. 中文文件

學習網站

在學習中我們會遇到 一些問題，可以去社群或一些網站尋找答案，下面推薦一些好的React 社群和學習網站。

  1. React中文社群
  2. React 中文索引
  3. React知識庫
  4. A quick start to React
  5. stack overflow
  6. 知乎 React 話題
  7. segmentfault React 話題

React技術棧

React是一款非常優秀的前端框架，你要發揮它完全的效能，你就要結合其他一些技術，例如webpack、redux、react-router等。

  1. React 技術棧系列教程

  2. 百度母嬰技術團隊—基於Reactjs實現webapp

  3. Building a React Universal Blog App

  4. React為啥非得使用immutable.js

  5. React Server Side Rendering 解決 SPA 應用的 SEO 問題

  6. webpack官方文件

  7. Webpack 中文指南

  8. webpack一小時快速入門

  9. 使用webpack輕鬆構建你的第一個react開發框架

  10. 入門Webpack，看這篇就夠了:寫的很不錯，逐級深入，適合入門，有點長，耐心看完

  11. react-router

  12. React Router 中文文件

  13. React Router 官方 demo

  14. Redux官網

  15. Redux 中文文件

  16. Redux 官方 demo

  17. Redux 莞式教程

  18. Redux 視訊教程

  19. redux 大法好

  20. Flux 傻瓜教程

  21. react+redux渲染效能優化原理

  22. React開發社群

  23. 資料流管理架構之 Redux 介紹

  24. React同構直出優化總結

  25. 前端路由實現與 react-router 原始碼分析

  26. 如何開發一個 Webpack Loader ( 一 )

  27. 伺服器端渲染實踐小結

  28. 聽說你需要這樣瞭解 Redux

  29. 學習Redux重新整理了我的前端App狀態管理觀

  30. Learn React & Webpack by building a hacker news front page

開發工具

redux 常用中介軟體或工具

React 開源專案

介紹一些國內外比較好的 React 開源專案。

國內：

國外：

相關文章