1.1開始學習之前1

1.1.1Node.js和npm1

1.1.2JavaScriptES62

1.2定義React2

1.3React的優點2

1.3.1簡單易學的響應式渲染3

1.3.2使用純JavaScript進行

面向組件開發3

1.3.3靈活的文檔模型抽象表現4

1.4創建你的第一個React

應用程序4

1.4.1React開發流程4

1.4.2創建你的第一個組件8

1.4.3減少輸入的字符數量9

1.4.4動態值10

1.5將組件組合起來10

1.5.1props10

1.5.2呈現看板應用11

1.5.3定義組件的層次關系13

1.5.4props的重要性14

1.5.5創建組件14

1.6介紹state21

1.7本章小結23

第2章深入DOM抽象25

2.1React中的事件25

2.1.1DOM事件偵聽器25

2.1.2看板應用：管理DOM

事件26

2.2深入了解JSX27

2.2.1JSX與HTML28

2.2.2JSX和HTML的

不同之處28

2.2.3JSX的怪異之處29

2.3看板應用：指示卡片的

打開和關閉狀態31

2.3.1空格32

2.3.2JSX中的注釋33

2.3.3渲染動態HTML33

2.3.4看板應用：渲染

Markdown33

2.4脫離JSX的React36

2.4.1普通JavaScript中的

React元素36

2.4.2元素工廠36

2.4.3自定義工廠37

2.5內聯樣式37

2.5.1定義內聯樣式37

2.5.2看板應用：通過內聯樣式

定義卡片顏色38

2.6使用表單40

2.6.1受控組件40

2.6.2特例42

2.6.3非受控組件43

2.6.4看板應用：創建一個

任務表單44

2.7幕后的虛擬DOM44

2.7.1key屬性45

2.7.2看板應用：key45

2.7.3refs47

2.8本章小結48

第3章使用組件構建應用程序49

3.1校驗屬性49

3.1.1屬性的默認值50

3.1.2內置的propTypes校驗器51

3.1.3為看板應用定義

propTypes52

3.1.4自定義propTypes校驗器54

3.2組件組合的策略與

最佳實踐55

3.2.1有狀態的組件和單純組件55

3.2.2哪些組件應當是有

狀態組件56

3.2.3數據流和組件通信59

3.3組件的生命周期63

3.3.1聲明周期的階段與函數63

3.3.2生命周期函數實踐：

數據獲取64

3.4淺談不變性67

3.4.1普通JavaScript中的

不變性67

3.4.2嵌套對象69

3.4.3React不變性助手70

3.5看板應用：添加一點

復雜性73

3.5.1從外部API獲取初始的

卡片數據73

3.5.2將任務回調以props傳遞76

3.5.3處理任務數據80

3.5.4基本的樂觀更新回滾83

3.6本章小結87

第4章復雜交互89

4.1React中的動畫89

4.1.1CSS過渡和動畫基礎89

4.1.2ReactCSSTransitionGroup95

4.2拖放100

4.2.1ReactDnD實現概述101

4.2.2ReactDnD實現示例101

4.3看板應用：支持動畫和

拖放113

4.3.1卡片切換動畫113

4.3.2卡片的拖曳115

4.4本章小結129

第5章路由131

5.1使用原生方式實現路由131

5.2ReactRouter135

5.2.1Index路由138

5.2.2帶參數的路由139

5.2.3設置活動鏈接144

5.2.4傳遞props144

5.2.5將UI界面與URL解耦147

5.2.6在代碼中更改路由149

5.2.7History庫152

5.2.8看板應用：實現

路由功能153

5.3本章小結166

第6章結合Flux的React

應用程序架構167

6.1什么是Flux167

6.1.1Store167

6.1.2Action168

6.1.3Dispatcher169

6.2假想的簡單Flux

應用程序169

6.3Flux工具包177

6.3.1FluxStore工具177

6.3.2容器組件高階函數180

6.4異步Flux181

6.4.1waitFor：協調Store的

更新數序181

6.4.2異步數據獲取184

6.5AirCheap應用程序184

6.5.1搭建：項目組織和

基本文件184

6.5.2創建用于獲取機場的

API助手和Action創

建器185

6.5.3AirportStore188

6.5.4應用組件189

6.5.5完成AirCheap應用程序：

加載機票194

6.6改進異步獲取數據的實現204

6.7看板應用：遷移到

Flux架構207

6.7.1重構：創建Flux基本

結構并遷移文件207

6.7.2將數據獲取操作遷移到

Flux架構212

6.7.3實現FetchCardsAction、

API方法調用和Store

回調213

6.7.4將所有卡片和任務Action

遷移到Flux架構216

6.7.5準備功能遷移216

6.7.6組件225

6.7.7刪除所有組件state231

6.8本章小結241

第7章性能調優243

7.1子級校正過程的工作原理243

7.1.1批處理243

7.1.2子樹渲染244

7.2ReactPerf244

7.2.1性能測試應用245

7.2.2安裝并使用ReactPerf248

7.3shouldComponentUpdate252

7.4本章小結254

第8章React同構應用255

8.1Node.js和Express255

8.2React同構基礎260

8.2.1創建項目結構260

8.2.2在服務器端渲染React

組件263

8.2.3在客戶端中掛載React266

8.3路由270

8.3.1配置內部路由270

8.3.2動態數據獲取271

8.3.3渲染路由273

8.4本章小結278

第9章測試React組件279

9.1Jest279

9.2React測試工具281

9.2.1渲染用于測試的組件281

9.2.2遍歷并查找子節點284

9.2.3模擬事件285

9.2.4淺渲染286

9.3本章小結290

附錄JavaScript2015291