react學習資源彙總

react-tutorial

a tutorial react collection and sort,let you easily get started and organized

主要是蒐集整理react生態從入門到深刻的教程、工具和本身作的demo,以便往後查閱 :blush:

設計思想

學習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 最簡單的入門應用項目
9. 爲你定製的 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開發社區

---

相關好文:

1. React初體驗

2. React 最佳實踐——那些 React 沒告訴你但很重要的事
3. Redux 狀態管理方法與實例
4. 高質量的 React 相關文檔和翻譯
5. redux觀點
6. 還在糾結 Flux 或 Relay，或許 Redux 更適合你

---

相關工具:

1. react-babel-webpack-boilerplate

2. react-webpack-generators
3. React項目可視化生成器
4. react-starter-kit

---

規範

1. react-style-guide

---

React 開源項目

介紹一些國內外比較好的 React 開源項目。

國內：

• 阿里的 React 組件庫
• Ant Design
• 簡易留言板
• react-zhihu
• React的掃雷遊戲
• 在線聊天室
• 使用React技術棧開發SPA
• 闊論留言評論
• React版cnode社區

國外：

• Relax
• SoundRedux
• Gatsby
• isomorphic500
• NuclearMail
• Picard
• React Color
• Sentry
• react-hn
• Perseus

本身練習作的項目

1. gallery-by-react 地址:https://github.com/cllgeek/gallery-by-react

2. react-router-tutorial
3. redux-tutorial
4. cll's blog

---

---

github上地址:react