《快速上手React編程》面向希望快速上手React.js進行Web開發(fā)的讀者，借助精心挑選和詳細解釋的實例，幫助讀者使用現(xiàn)有的JavaScript和Web開發(fā)技能學習React開發(fā)。在學習Web組件、表單和數(shù)據(jù)的過程中，還將探索許多不同的項目。

主要特點：
掌握React基礎
使用數(shù)據(jù)和路由構建完整的Web應用
測試組件
優(yōu)化React應用

目錄
 

第Ⅰ部分　React基礎
第1章 初積React 3
1.1 什么是React 4
1.2 React解決的問題 5
1.3 使用React的好處 6
1.3.1 簡單性 6
1.3.2 速度和可測試性 11
1.3.3 生態(tài)和社區(qū) 12
1.4 React的缺點 13
1.5 React如何與Web應用集成 13
1.5.1 React類庫和渲染目標 14
1.5.2 單頁面應用和React 15
1.5.3 React技術棧 17
1.6 第一個React項目：Hello World 18
1.7 測驗 21
1.8 小結 21
1.9 測驗答案 22
第2章　React起步 23
2.1 內嵌元素 23
2.2 創(chuàng)建組件類 26
2.3 屬性 29
2.4 測驗 34
2.5 小結 34
2.6 測驗答案 34
第3章　JSX 35
3.1 JSX是什么？它有什么優(yōu)點 36
3.2 理解JSX 38
3.2.1 使用JSX創(chuàng)建元素 39
3.2.2 在組件中使用JSX 40
3.2.3 在JSX中輸出變量 41
3.2.4 在JSX中使用屬性 42
3.2.5 創(chuàng)建React組件的方法 46
3.2.6 JSX中的if/else 47
3.2.7 JSX中的注釋 51
3.3 使用Babel設置JSX轉譯器 51
3.4 React和JSX陷阱 55
3.4.1 特殊字符 56
3.4.2 data-屬性 56
3.4.3 style屬性 57
3.4.4 class和for 58
3.4.5 布爾類型的屬性值 58
3.5 測驗 59
3.6 小結 59
3.7 測驗答案 59
第4章　與狀態(tài)交互 61
4.1 什么是React組件的狀態(tài) 62
4.2 使用狀態(tài) 63
4.2.1 訪問狀態(tài) 63
4.2.2 設置初始狀態(tài) 65
4.2.3 更新狀態(tài) 67
4.3 狀態(tài)和屬性 70
4.4 無狀態(tài)組件 71
4.5 有狀態(tài)組件和無狀態(tài)組件 73
4.6 測驗 77
4.7 小結 77
4.8 測驗答案 78
第5章　React組件生命周期 79
5.1 React組件生命周期事件的全景視圖 80
5.2 事件的分類 80
5.3 實現(xiàn)生命周期事件 82
5.4 執(zhí)行所有事件 84
5.5 掛載事件 86
5.5.1 componentWillMount( ) 87
5.5.2 componentDidMount( ) 87
5.6 更新事件 90
5.6.1 componentWillReceiveProps(newProps) 90
5.6.2 shouldComponentUpdate( ) 91
5.6.3 componentWillUpdate( ) 91
5.6.4 componentDidUpdate() 92
5.7 卸載事件 92
5.8 一個簡單示例 92
5.9 測驗 95
5.10 小結 95
5.11 測驗答案 96
第6章　React事件處理 97
6.1 在React中處理DOM事件 97
6.1.1 捕獲和冒泡階段 100
6.1.2 React事件的內幕 102
6.1.3 使用React SyntheticEvent事件對象 105
6.1.4 使用事件和狀態(tài) 108
6.1.5 傳遞事件處理程序和屬性 109
6.1.6 組件通信 112
6.2 響應React不支持的DOM事件 113
6.3 React和其他庫的集成：jQuery UI事件 116
6.3.1 集成按鈕 116
6.3.2 集成標簽 118
6.4 測驗 119
6.5 小結 119
6.6 測驗答案 120
第7章　在React中使用表單 121
7.1 在React中使用表單的最佳實踐 121
7.1.1 在React中定義表單及響應事件 123
7.1.2 定義表單元素 125
7.1.3 捕獲表單變更 130
7.1.4 賬戶字段示例 132
7.2 使用表單的其他方式 134
7.2.1 可捕獲變更的非受控元素 135
7.2.2 不捕獲變更的非受控元素 136
7.2.3 使用引用獲取值 137
7.2.4 默認值 139
7.3 測驗 140
7.4 小結 141
7.5 測驗答案 141
第8章　擴展React組件 143
8.1 組件中的默認屬性 144
8.2 React屬性類型和驗證 145
8.3 渲染子組件 152
8.4 創(chuàng)建React高階組件以實現(xiàn)代碼復用 154
8.4.1 使用displayName：用以區(qū)分父組件與子組件 156
8.4.2 使用擴展運算符：傳遞所有屬性 157
8.4.3 使用高階組件 158
8.5 最佳實踐：展示組件與容器組件 160
8.6 測驗 161
8.7 小結 161
8.8 測驗答案 162
第9章　項目：菜單組件 163
9.1 項目結構和腳手架 164
9.2　不使用JSX構建菜單 165
9.2.1 Menu組件 165
9.2.2 Link組件 168
9.2.3 運行菜單組件 170
9.3 在JSX中構建菜單 171
9.3.1 重構Menu組件 172
9.3.2 重構Link組件 174
9.3.3 運行JSX項目 175
9.4 測驗 175
9.5 小結 176
第10章　項目：Tooltip組件 177
10.1 項目結構和腳手架 178
10.2 Tooltip組件 179
10.2.1 toggle( )函數(shù) 180
10.2.2 render( )函數(shù) 181
10.3 運行Tooltip組件 183
10.4 測驗 184
10.5 小結 184
第11章　項目：Timer組件 185
11.1 項目結構和腳手架 186
11.2 應用架構 187
11.3 TimerWrapper組件 189
11.4 Timer組件 193
11.5 Button組件 194
11.6 運行Timer組件 196
11.7 測驗 196
11.8 小結 197
第Ⅱ部分　React架構
第12章　Webpack構建工具 201
12.1 Webpack的作用 201
12.2 添加Webpack到項目中 203
12.2.1 安裝Webpack及其依賴 204
12.2.2 配置Webpack 205
12.3 模塊化代碼 207
12.4 運行Webpack并測試構建 208
12.5 熱模塊替換 210
12.5.1 配置HMR 211
12.5.2 熱模塊替換實踐 214
12.6 測驗 216
12.7 小結 216
12.8 測驗答案 216
第13章　React路由 217
13.1 從零開始實現(xiàn)路由 218
13.1.1 建立項目 219
13.1.2 在app.jsx中創(chuàng)建路由映射 220
13.1.3 在router.jsx中創(chuàng)建Router組件 221
13.2 React Router 222
13.2.1 React Router的JSX樣式 225
13.2.2 哈希記錄 227
13.2.3 瀏覽器記錄 227
13.2.4 使用Webpack安裝React Router開發(fā)環(huán)境 228
13.2.5 創(chuàng)建布局組件 230
13.3 React Router特性 233
13.3.1 使用withRouter高階組件訪問路由器 234
13.3.2 以編程方式導航 235
13.3.3 URL參數(shù)和其他路由數(shù)據(jù) 235
13.3.4 在React Router中傳遞屬性 236
13.4 使用Backbone路由 237
13.5 測驗 240
13.6 小結 241
13.7 測驗答案 241
第14章　使用Redux處理數(shù)據(jù) 243
14.1 React支持單向數(shù)據(jù)流 244
14.2 了解Flux數(shù)據(jù)體系結構 246
14.3 使用Redux數(shù)據(jù)類庫 247
14.3.1 用Redux創(chuàng)建依照Netflix的應用 249
14.3.2 依賴和配置 250
14.3.3 啟用Redux 253
14.3.4 路由 253
14.3.5 合并reducer 254
14.3.6 電影的reducer 255
14.3.7 操作 258
14.3.8 操作創(chuàng)建器 259
14.3.9 將組件連接到數(shù)據(jù)存儲 260
14.3.10 分發(fā)操作 262
14.3.11 將操作創(chuàng)建器傳遞到組件屬性中 263
14.3.12 運行Netflix的克隆版 267
14.3.13 Redux總結 268
14.4 測驗 268
14.5 小結 269
14.6 測驗答案 269
第15章　使用GraphQL處理數(shù)據(jù) 271
15.1 GraphQL 272
15.2 給Netflix克隆版應用添加服務器 273
15.2.1 在服務器端安裝GraphQL 275
15.2.2 數(shù)據(jù)結構 278
15.2.3 GraphQL模式 279
15.2.4 查詢API并將響應保存到數(shù)據(jù)存儲 281
15.2.5 顯示電影列表 285
15.2.6 GraphQL總結 287
15.3 測驗 287
15.4 小結 288
15.5 測驗答案 288
第16章　使用Jest進行單元測試 289
16.1 測試的類型 290
16.2 為什么使用Jest(對比Mocha) 290
16.3 使用Jest進行單元測試 291
16.3.1 在Jest中編寫單元測試 293
16.3.2 Jest斷言 294
16.4 使用Jest和TestUtils進行React UI測試 296
16.4.1 使用TestUtils查找元素 298
16.4.2 UI測試密碼部件 299
16.4.3 淺渲染 303
16.5 TestUtils總結 305
16.6 測驗 305
16.7 小結 305
16.8 測驗答案 306
第17章　在Node中使用React和同構JavaScript 307
17.1 為什么在服務器端使用React？
什么是同構JavaScript？ 308
17.1.1 正確的頁面索引 308
17.1.2 更快的加載速度、更好的性能 309
17.1.3 更好的代碼可維護性 310
17.1.4 在React和Node中使用同構JavaScript 310
17.2 在Node上使用React 312
17.3 React和Express：在服務器端渲染組件 314
17.3.1 在服務器端渲染簡單的文本 315
17.3.2 渲染HTML頁面 316
17.4 使用Express和React的同構JavaScript 322
17.4.1 項目目錄結構和配置 324
17.4.2 啟動服務器 325
17.4.3 使用Handlebars的服務器端布局模板 329
17.4.4 在服務器上編寫React組件 332
17.4.5 客戶端React代碼 333
17.4.6 配置Webpack 334
17.4.7 運行應用 336
17.5 測驗 340
17.6 小結 340
17.7 測驗答案 340
第18章　使用React Router創(chuàng)建一個網(wǎng)上書店 341
18.1 項目結構和Webpack配置 343
18.2 HTML主頁 346
18.3 創(chuàng)建組件 347
18.3.1 主文件：app.jsx 347
18.3.2 Cart組件 353
18.3.3 Checkout組件 355
18.3.4 Modal組件 356
18.3.5 Product組件 357
18.4 啟動項目 359
18.5 測驗 359
18.6 小結 359
第19章　使用Jest測試密碼 361
19.1 項目結構和Webpack配置 362
19.2 HTML主頁 365
19.3 實現(xiàn)強密碼模塊 366
19.3.1 測試 366
19.3.2 代碼 367
19.4 實現(xiàn)Password組件 369
19.4.1 測試 369
19.4.2 代碼 370
19.5 實踐 375
19.6 測驗 376
19.7 小結 377
第20章　使用Jest、Express和MongoDB實現(xiàn)自動完成 379
20.1 項目結構和Webpack配置 381
20.2 實現(xiàn)Web服務器 385
20.2.1 定義RESTful API 386
20.2.2 在服務器端渲染React 387
20.3 添加瀏覽器腳本 387
20.4 創(chuàng)建服務器端模板 388
20.5 實現(xiàn)Autocomplete組件 389
20.5.1 Autocomplete組件的測試 389
20.5.2 Autocomplete組件的代碼 390
20.6 整合 393
20.7 測驗 395
20.8 小結 396
附錄A　安裝本書相關應用 397
附錄B　React速查表 405
附錄C　Express速查表 413
附錄D　MongoDB和Mongoose
速查表 419
附錄E　ES6簡介 423