React.js 小書
本文作者：鬍子大哈
本文原文：React.js 小書
轉載請註明出處，保留原文鏈接以及作者信息
在線閱讀：http://huziketang.com/books/react/
簡介
這是一本關於 React.js 的小書。
因爲工作中一直在使用 React.js，也一直以來想總結一下自己關於 React.js 的一些知識、經驗。於是把一些想法慢慢整理書寫下來，做成一本開源、免費、專業、簡單的入門級別的小書，提供給社區。希望能夠幫助到更多 React.js 剛入門朋友。
由於水平有限，編寫的過程難免會有諸多錯誤，也希望大家在看的過程中發現了問題，可以在 Github 上給該項目發 Pull Request。衷心希望可以有更多的人蔘與到本書的編寫當中。
（本書的後續可能會做成視頻版本，敬請期待。）
本書介紹
本書爲有一點前端基礎的並且是 React.js 零基礎的同學而作，幫助他們掌握 React.js 並且靈活地把 React.js 應用到實際項目當中。如果你有一定的 HTML、CSS、JavaScript 基礎並且希望學習 React.js，而又覺得 React.js 當中有些概念比難以接受和理解，希望能夠從零開始學習，那麼本書很適合你。但如果你已經對前端已經非常熟悉並且用過不少的前端框架和相關的組件化技術，建議你直接看官網文檔。
本書並不會文檔式地包含所有知識點，只會提煉實戰經驗中基礎的、重要的、頻繁的知識進行重點講解，讓你能用最少的精力深入瞭解實戰中最需要的 React.js 知識和套路，輕裝上路。如果需要更多更全面的知識點，可以參看更多的官方文檔或者其他豐富的資料。
另外，本書全書採用 ECMAScript 2015，閱讀之前請確保自己已經掌握了 ECMAScript 2015 的基本語法，否則閱讀起來會非常困難。
本書初定分爲三個階段，每個階段最後會有實戰分析，把該階段的知識點應用起來。
第一個階段：希望能讓讀者掌握 React.js 的基本概念和基礎知識。包括問題的根源：前端組件的複用性問題、數據和視圖的同步問題。瞭解清楚問題以後再瞭解 React.js 的基礎知識，包括 JSX、事件監聽、state、props、列表渲染等。看看 React.js 是怎麼解決這些問題的。這個階段結束以後，讀者就可以可以運用 React.js 構建簡單的頁面功能。
第二個階段：讓讀者更進一步瞭解 React.js，包括組件生命週期及其含義、state 和 props 的進階概念、props 驗證及其意義、組件組合進階、如何和 DOM 打交道、並且開始引入前端應用狀態管理所存在的問題。
第三個階段：讓讀者掌握 React.js 較爲高級的概念，包括高階組件、context。並且嘗試引入 React-router、redux 來協助我們構建較爲完整的前端應用；還會開始深入討論前端應用狀態管理的問題。
目錄
第一個階段
- Lesson 1 - React.js 簡介
- Lesson 2 - 前端組件化（一）：從一個簡單的例子講起
- Lesson 3 - 前端組件化（二）：優化 DOM 操作
- Lesson 4 - 前端組件化（三）：抽象出公共組件類
- Lesson 5 - React.js 基本環境安裝
- Lesson 6 - 使用 JSX 描述 UI 信息
- Lesson 7 - 組件的 render 方法
- Lesson 8 - 組件的組合、嵌套和組件樹
- Lesson 9 - 事件監聽
- Lesson 10 - 組件的 state 和 setState
- Lesson 11 - 配置組件的 props
- Lesson 12 - state vs props
- Lesson 13 - 渲染列表數據
- Lesson 14 - 實戰分析：評論功能（一）
- Lesson 15 - 實戰分析：評論功能（二）
- Lesson 16 - 實戰分析：評論功能（三）
第二個階段
- Lesson 17 - 前端應用狀態管理 —— 狀態提升
- Lesson 18 - 掛載階段的組件生命週期（一）
- Lesson 19 - 掛載階段的組件生命週期（二）
- Lesson 20 - 更新階段的組件生命週期
- Lesson 21 - ref 和 React.js 中的 DOM 操作
- Lesson 22 - props.children 和容器類組件
- Lesson 23 - dangerouslySetHTML 和 style 屬性
- Lesson 24 - PropTypes 和組件參數驗證
- Lesson 25 - 實戰分析：評論功能（四）
- Lesson 26 - 實戰分析：評論功能（五）
- Lesson 27 - 實戰分析：評論功能（六）
第三個階段
- Lesson 28 - 高階組件（Higher-Order Components）
- Lesson 29 - React.js 的 context
- Lesson 30 - 動手實現 Redux（一）：優雅地修改共享狀態
- Lesson 31 - 動手實現 Redux（二）：抽離 store 和監控數據變化
- Lesson 32 - 動手實現 Redux（三）：純函數（Pure Function）簡介
- Lesson 33 - 動手實現 Redux（四）：共享結構的對象提高性能
- Lesson 34 - 動手實現 Redux（五）：不要問爲什麼的 reducer
- Lesson 35 - 動手實現 Redux（六）：Redux 總結
- …
特別鳴謝
特別感謝以下朋友對本書所做的審校工作，給本書提出了很多寶貴的改進意見：
聯繫作者
- 郵箱：[email protected]
- 知乎：@鬍子大哈
- 專欄：@前端大哈
- 加入《React.js 小書》讀者交流羣，一起討論、交流、學習前端技術。
License
本作品採用 署名-禁止演繹 4.0 國際許可協議 進行許可