《React前端技術與工程實踐》一書作者李晉華，電子工業出版社2017年4月出版
基本介紹
- 書名：React前端技術與工程實踐
- 作者：李晉華
- ISBN：978-7-121-31050-8
- 頁數：280
- 定價：69.00
- 出版社：電子工業出版社
- 出版時間：2017年4月
- 開本：16
內容提要,目錄,
內容提要
《React前端技術與工程實踐》是一本專門介紹React前端框架基本原理及其相關工程實踐的技術參考書。《React前端技術與工程實踐》分為14章，主要包括React技術基本原理、相關前端開發工具鏈、實用技巧及熱門資源介紹四部分。《React前端技術與工程實踐》結構完整、層次清晰，由淺入深地介紹了React前端技術的原理、相關工具鏈的使用及React技術在工程中的套用技巧等。《React前端技術與工程實踐》關注技術原理，在講解技術套用的同時介紹相關原理和理念，幫助讀者更深入地理解和掌握React技術，並能儘快地投入實際套用。《React前端技術與工程實踐》也儘可能全面地囊括當前JavaScript前端工程開發的相關技術與工具，通過《React前端技術與工程實踐》可以全面地掌握React相關的知識體系並較快地進入實際工程開發。《React前端技術與工程實踐》語言淺顯易懂，輔以生動的實例，是React前端工程開發的好助手和好工具。
《React前端技術與工程實踐》適用於對前端開發有一定了解和開發經驗的讀者，也可作為相關培訓教材使用。
目錄
第一篇原汁原味的React
1 React簡介 3
1.1 前端技術發展及趨勢 3
1.2 React簡介 4
1.3 React特點 5
1.3.1 虛擬DOM 5
1.3.2 組件化 6
1.3.3 單向數據流 7
1.4 React與React Native 7
1.5 對React的幾個認識誤區 8
2 React基礎 9
2.1 React最小環境搭建 9
2.2 Helloworld示例 11
2.3 React基本架構 13
2.3.1 虛擬DOM結構 13
2.3.2 虛擬DOM元素 14
2.3.3 組件工廠 15
2.3.4 React的內部更新機制 16
2.3.5 虛擬DOM的特殊屬性 19
2.4 JSX語法 20
2.4.1 JSX等價描述 22
2.4.2 JSX轉譯工具Babel 23
2.4.3 JSX中的表達式 24
2.4.4 JSX中的注釋 26
2.4.5 JSX展開屬性 26
2.5 React注意事項 28
2.5.1 ReactDOM.render的目標節點 28
2.5.2 組件名約定 28
2.5.3 class屬性和for屬性替換 28
2.5.4 行內樣式 29
2.5.5 自定義HTML屬性 30
2.5.6 HTML轉義 30
3 React組件 33
3.1 組件主要成員 34
3.1.1 state成員 34
3.1.2 props成員 36
3.1.3 render成員函式 37
3.2 組件的生命周期 37
3.2.1 實例化階段 38
3.2.2 活動階段 39
3.2.3 銷毀階段 41
3.3 組件事件回響 41
3.3.1 事件代理 42
3.3.2 事件自動綁定 42
3.3.3 合成事件 42
3.4 props屬性驗證 45
3.5 組件的其他成員 47
3.6 關於state的幾個設計原則 49
3.6.1 哪些組件應該有state 49
3.6.2 哪些數據應該放入state中 49
3.6.3 哪些數據不應該放入state中 50
4 React頂級API 51
4.1 React命名空間 51
4.2 ReactDOM命名空間 53
4.3 ReactDOMServer命名空間 55
4.4 children工具函式 56
5 React表單 59
5.1 表單元素 59
5.2 事件回響 60
5.2.1 bind復用 61
5.2.2 name復用 62
5.3 可控組件與不可控組件 64
5.3.1 可控組件 65
5.3.2 不可控組件 66
6 React複合組件 69
6.1 組件嵌套 69
6.2 組件參數傳遞 71
6.2.1 動態參數傳遞 71
6.2.2 使用Underscore來傳遞 72
6.2.3 使用Context 來傳遞 73
6.3 組件間的通信 76
6.3.1 事件回調機制 76
6.3.2 公開組件功能 77
6.3.3 mixins 79
6.3.4 動態子級 81
6.4 高階組件 82
6.4.1 高階組件概念 82
6.4.2 高階組件套用：屬性轉換器 83
6.4.3 高階組件套用：邏輯分離與封裝 84
7 React常用組件示例 88
7.1 按鈕組件 88
7.2 分頁組件 90
7.3 帶分頁的表格組件 94
7.4 樹形組件 103
7.5 模態對話框組件 109
7.6 綜合實例 117
7.6.1 綜合實例一 117
7.6.2 綜合實例二 117
8 React外掛程式 121
9 React實用技巧 123
9.1 綁定React未提供的事件 123
9.2 通過AJAX載入初始數據 124
9.3 使用ref屬性 126
9.3.1 ref字元串屬性 126
9.3.2 ref回調函式屬性 128
9.4 使用classNames.js 130
9.4.1 classNames介紹 130
9.4.2 classNames用法 131
9.4.3 在ES6中使用動態的classNames 131
9.4.4 多類名去重 132
9.5 使用Immutable.js 132
9.5.1 Immutable.js介紹 132
9.5.2 Immutable基本用法 133
9.5.3 Immutable對象比較 134
9.5.4 Immutable List用法 135
9.5.5 Immutable Map用法 136
9.6 與jQuery集成 138
9.6.1 React與jQuery的區別 138
9.6.2 在React中使用jQuery 139
9.6.3 在jQuery中使用React 141
第二篇React開發相關工具鏈
10 JS前端開發工具鏈 145
10.1 Node.js 145
10.1.1 Node.js安裝 146
10.1.2 Node.js使用 148
10.2 Node.js模組和包 150
10.2.1 模組 150
10.2.2 包 151
10.3 npm模組管理器 153
10.3.1 npm安裝 153
10.3.2 npm初始化 154
10.3.3 npm安裝模組 155
10.3.4 使用cnpm 157
10.3.5 npm常用命令 158
10.3.6 自定義腳本 161
10.4 ES 6規範簡介 163
10.4.1 ES6語法簡介 163
10.4.2 ES 6模組管理 168
10.4.3 基於ES 6語法的React組件寫法 170
10.5 ESLint工具 172
10.5.1 ESLint介紹 172
10.5.2 安裝和使用 173
10.5.3 配置 174
10.5.4 React檢查 175
10.6 Babel工具 176
10.6.1 配置.babelrc檔案 177
10.6.2 命令行轉譯工具：babel-cli 178
10.6.3 命令行運行工具：babel-node 179
10.6.4 實時轉譯模組：babel-register 180
10.6.5 瀏覽器實時轉譯模組：browser.js 180
10.6.6 轉譯API模組：babel-core 181
10.6.7 擴展轉譯模組：babel-polyfill 181
10.6.8 ESLint前置轉譯模組：babel-eslint 181
10.6.9 Mocha前置轉譯模組：babel-core/register 182
10.7 webpack打包工具使用與技巧 183
10.7.1 前端模組化與webpack介紹 183
10.7.2 webpack的打包React實例 185
10.7.3 webpack模組載入器 189
10.7.4 webpack開發伺服器 190
10.7.5 React熱載入器 190
10.7.6 打包成多個資源檔案 192
10.8 基於完整工具鏈的項目目錄結構 194
第三篇React進階
11 Flux & Redux 199
11.1 Flux 199
11.1.1 Flux簡介 200
11.1.2 基本架構 201
11.1.3 動作和動作發生器 202
11.1.4 分發器 203
11.1.5 存儲 203
11.1.6 視圖與控制視圖 204
11.2 Redux 205
11.2.1 Redux基本架構 205
11.2.2 Action 207
11.2.3 Reducer 208
11.2.4 Store 210
11.2.5 bindActionCreators 212
11.3 React-Redux 213
11.3.1 React-Redux的使用方法 213
11.3.2 Connect 215
11.4 Redux工程目錄結構 218
12 路由 221
12.1 前端路由 221
12.2 路由的基本原理 222
12.3 安裝與引用 222
12.4 路由配置 223
12.4.1 路由器和路由 223
12.4.2 嵌套路由 224
12.4.3 默認路由 225
12.4.4 path 屬性 226
12.4.5 NotFoundRoute組件 227
12.4.6 Redirect組件 228
12.4.7 IndexRedirect 組件 229
12.4.8 history屬性 229
12.4.9 路由回調 230
12.5 路由切換 231
12.5.1 Link組件 232
12.5.2 IndexLink 232
12.5.3 動態路由切換 233
13 React單元測試 235
13.1 測試腳本示例 236
13.2 React測試代碼示例 237
13.3 React測試相關工具 238
13.3.1 Mocha 238
13.3.2 chai 239
13.3.3 jsdom 241
13.3.4 react-addons-test-utils 242
13.4 創建測試環境 245
13.5 React組件測試 246
13.5.1 淺渲染 246
13.5.2 全DOM渲染 248
13.5.3 使用findDOMNode方法查找DOM 249
第四篇React相關資源
14 React相關資源介紹 253
14.1 React Starter Kit 253
14.2 React bootstrap 257
14.3 Material-UI 259
14.4 Ant Design 261
14.5 React-d 3與echarts-for-react 263
14.6 React Storybook 265
14.7 awesome-react 266
