React+Redux前端開發(fā)實戰(zhàn)

第1章  React入門      1
1.1  開始學習React之前    1
1.1.1  下載與使用Node.js和NPM    1
1.1.2  模塊打包工具之Browserify    2
1.1.3  模塊打包工具之Webpack       3
1.1.4  個Webpack構(gòu)建實戰(zhàn)       6
1.1.5  Webpack loader實戰(zhàn) 7
1.1.6  Webpack配置詳解    9
1.1.7  ES 6語法   15
1.2  React簡介     22
1.3  React的特征 23
1.3.1  組件化       23
1.3.2  虛擬DOM  24
1.3.3  單向數(shù)據(jù)流       25
1.4  JSX語法      25
1.4.1  JSX簡介    25
1.4.2  JSX的轉(zhuǎn)譯       27
1.4.3  JSX的用法       29
1.5  Hello World實戰(zhàn)訓練  34
1.5.1  不涉及項目構(gòu)建的Hello World      34
1.5.2  基于Webpack的Hello World  35
1.5.3  Hello World進階      39
第2章  React的組件  44
2.1  組件的聲明方式   44
2.1.1  ES 5寫法：React.createClass()       44
2.1.2  ES 6寫法：React.Component  45
2.1.3  無狀態(tài)組件       46
2.2  組件的主要成員   47
2.2.1  狀態(tài)（state）    47
2.2.2  屬性（props）   49
2.2.3  render()方法      49
2.3  組件之間的通信   52
2.3.1  父組件向子組件通信       52
2.3.2  子組件向父組件通信       53
2.3.3  跨級組件通信   54
2.3.4  非嵌套組件通信       56
2.4  組件的生命周期   58
2.4.1  組件的掛載       58
2.4.2  數(shù)據(jù)的更新過程       60
2.4.3  組件的卸載（unmounting）    61
2.4.4  錯誤處理   61
2.4.5  老版React中的生命周期 62
2.4.6  生命周期整體流程總結(jié)   63
2.5  組件化實戰(zhàn)訓練——TodoList    64
第3章  React的事件與表單      70
3.1  事件系統(tǒng)      70
3.1.1  合成事件的事件代理       70
3.1.2  事件的自動綁定       71
3.1.3  在React中使用原生事件 73
3.1.4  合成事件與原生事件混用       73
3.2  表單（Forms）    75
3.2.1  受控組件   75
3.2.2  非受控組件       77
3.2.3  受控組件和非受控組件對比   78
3.2.4  表單組件的幾個重要屬性       80
3.3  React的樣式處理 80
3.3.1  基本樣式設(shè)置   80
3.3.2  CSS Modules樣式設(shè)置    82
第4章  React Redux數(shù)據(jù)流管理     86
4.1  Flux架構(gòu)      86
4.1.1  MVC和MVVM 86
4.1.2  Flux介紹   90
4.1.3  深入Flux   91
4.1.4  Flux的缺點       96
4.1.5  Flux架構(gòu)小結(jié)   97
4.2  Redux狀態(tài)管理工具   97
4.2.1  Redux簡介 97
4.2.2  Redux的使用場景    98
4.2.3  Redux的動機    99
4.2.4  Redux三大特性 99
4.2.5  Redux的組成——拆解商城購物車實例 100
4.2.6  Redux搭配React使用     105
4.3  middleware中間件      109
4.3.1  為何需要middleware       109
4.3.2  深入理解middleware       109
4.4  Redux實戰(zhàn)訓練——網(wǎng)上書店   113
4.4.1  目錄結(jié)構(gòu)   113
4.4.2  應用入口 src/index.js       114
4.4.3  Action的創(chuàng)建和觸發(fā)       116
4.4.4  Reducer的創(chuàng)建  118
4.4.5  UI展示組件的創(chuàng)建  122
4.4.6  發(fā)起一個動作Action（添加商品到購物車）       124
第5章  路由       127
5.1  前端路由簡介      127
5.2  前端路由的實現(xiàn)原理   127
5.2.1  history API方式       128
5.2.2  Hash方式   129
5.3  react-router路由配置   130
5.3.1  react-router的安裝    131
5.3.2  路由配置   131
5.3.3  默認路由   132
5.3.4  路由嵌套   133
5.3.5  重定向       133
5.4  react-router下的history      134
5.4.1  browserHistory模式  134
5.4.2  hashHistory模式       135
5.4.3  createMemoryHistory模式       135
5.5  react-router路由切換   135
5.5.1  Link標簽   135
5.5.2  history屬性       136
5.5.3  傳參   137
5.6  進入和離開的Hook     137
5.6.1  onEnter簡介     137
5.6.2  onLeave簡介     138
第6章  React的性能及性能優(yōu)化      139
6.1  diff算法       139
6.1.1  時間復雜度和空間復雜度       139
6.1.2  diff策略    141
6.1.3  key屬性     148
6.2  組件重新渲染      149
6.3  PureRender純渲染      152
6.4  Immutable持久性數(shù)據(jù)結(jié)構(gòu)庫    153
6.4.1  Immutable的作用     153
6.4.2  Immutable的優(yōu)缺點 155
6.4.3  Immutable和原生JavaScript對象相互轉(zhuǎn)換   156
6.4.4  Immutable中的對象比較 156
6.4.5  Immutable與React配合使用   157
第7章  React服務端渲染  159
7.1  客戶端渲染和服務端渲染的區(qū)別      159
7.2  在React中實現(xiàn)服務端渲染       160
7.2.1  為何需要服務端渲染       160
7.2.2  服務端渲染中的API       161
7.2.3  渲染方法   161
7.2.4  狀態(tài)管理   165
7.2.5  Express框架簡介      166
7.2.6  路由和HTTP請求    169
7.3  實戰(zhàn)訓練——服務端渲染   172
7.3.1  項目結(jié)構(gòu)   172
7.3.2  項目實現(xiàn)   172
第8章  自動化測試    178
8.1  測試的作用   178
8.2  單元測試簡介      178
8.3  測試工具      180
8.3.1  常見的測試工具       180
8.3.2  React的測試工具     181
8.3.3  單元測試工具Jest    181
8.3.4  單元測試工具Enzyme     187
8.4  Jest和Enzyme實戰(zhàn)訓練     189
8.4.1  Jest和Enzyme的配置     191
8.4.2  測試From組件視圖和單擊事件     193
8.4.3  測試ListItems組件視圖   196
第9章  實戰(zhàn)——React Redux搭建社區(qū)項目  198
9.1  項目結(jié)構(gòu)      198
9.2  Less文件處理      198
9.3  路由和Redux配置      199
9.3.1  前期配置   199
9.3.2  路由功能的測試       201
9.4  業(yè)務入口      202
9.5  首頁      203
9.5.1  頭部   204
9.5.2  列表內(nèi)容   205
9.6  詳情頁   224
9.6.1  靜態(tài)頁面開發(fā)   224
9.6.2  根據(jù)id獲取詳情      227
9.6.3  渲染內(nèi)容   228
9.7  個人中心      230
9.7.1  分析頁面功能   231
9.7.2  模擬用戶登錄和登出       232
9.8  實戰(zhàn)項目回顧      234
……