React 設計模式與最佳實踐
內容描述
本書共分為12章,通過介紹React中有價值的設計模式,展示如何將設計模式和zui佳實踐應用於現實的新項目和已有項目中。
主要內容包括幫助讀者理解React的基本概念,學習編寫整潔、可維護的代碼;優化React組件,使應用擁有更快的速度和響應性;
介紹如何有效地編寫測試,避免反模式,開源組件並對React生態系統做貢獻。
目錄大綱
第1章React基礎1
1.1聲明式編程2
1.2 React元素3
1.3忘掉所學的一切5
1.4常見誤解7
1.5小結9
第2章整理代碼10
2.1 JSX 10
2.1.1 Babel 11
2.1.2 Hello,World!12
2.1.3 DOM元素與React組件13
2.1.4屬性13
2.1.5子元素13
2.1.6 JSX與HTML的區別14
2.1.7展開屬性17
2.1.8 JavaScript模板17
2.1.9常見模式17
2.2 ESLint 25
2.2.1安裝25
2.2.2配置25
2.2.3 React插件28
2.2.4 Airbnb的配置29
2.3函數式編程基礎30
2.3.1一等對象30
2.3.2純粹性31
2.3.3不可變性31
2.3 .4柯里化32
2.3.5組合33
2.3.6函數式編程與UI 33
2.4小結33
第3章開發真正可複用的組件34
3.1創建類34
3.1.1 createClass工廠方法35
3.1.2繼承React.Component 35
3.1.3主要區別36
3.1.4無狀態函數式組件40
3.2狀態42
3.2. 1外部庫43
3.2.2工作原理43
3.2.3異步44
3.2.4 React lumberjack 45
3.2.5使用狀態45
3.3 prop類型48
3.4可複用組件51
3.5可用的風格指南54
3.6小結58
第4章組合一切59
4.1組件間的通信59
4.2容器組件與表現組件模式62
4.3 mixin 67
4.4高階組件69
4.5 recompose 72
4.6函數子組件76
4.7小結78
第5章恰當地獲取數據79
5.1數據流79
5.1.1子組件與父組件的通信(回調函數) 81
5.1.2公有父組件82
5.2數據獲取83
5.3 react-refetch 88
5.4小結92
第6章為瀏覽器編寫代碼93
6.1表單93
6.1.1自由組件94
6.1.2受控組件98
6.1.3 JSON schema 100
6.2事件102
6.3 ref 104
6.4動畫108
6.5可擴展矢量圖形110
6.6小結113
第7章美化組件114
7.1 CSS in JavaScript 114
7.2行內樣式116
7.3 Radium 120
7.4 CSS模塊124
7.4.1 Webpack 124
7.4.2搭建項目124
7.4.3局部作用域的CSS 126
7.4.4原子級CSS模塊131
7.4 .5 React CSS模塊132
7.5 Styled Component 133
7.6小結136
第8章服務端渲染的樂趣與益處137
8.1通用應用137
8.2使用服務端渲染的原因138
8.2.1 SEO 138
8.2.2通用代碼庫139
8.2. 3性能更強140
8.2.4不要低估複雜度140
8.3基礎示例141
8.4數據獲取示例146
8.5 Next.js 149
8.6小結151
第9章提升應用性能153
9.1一致性比較與key屬性153
9.2優化手段158
9.2.1是否要更新組件158
9.2.2無狀態函數式組件160
9.3常用解決方案160
9.3.1 why-did-you-update 161
9.3.2在渲染方法中創建函數162
9.3.3 props常量165
9.3.4重構與良好設計167
9.4工具與庫172
9.4.1不可變性172
9.4.2性能監控工具173
9.4.3 Babel插件174
9.5小結174
第10章測試與調試176
10.1測試的好處176
10.2用Jest輕鬆測試JavaScript 178
10.3靈活的測試框架Mocha 184
10.4 React JavaScript測試工具187
10.5真實測試示例189
10.6 React組件樹快照測試195
10.7代碼覆蓋率工具198
10.8常用測試方案199
10.8.1測試高階組件199
10.8.2頁面對像模式203
10.9 Reactkai發者工具206
10.10 React錯誤處理207
10.11小結209
第11章需要避免的反模式210
11.1用prop初始化狀態210
11.2修改狀態212
11.3將數組索引作為key 215
11.4在DOM元素上展開props對象218
11.5小結219
第12章未來的行動220
12.1為React做貢獻220
12.2分發代碼222
12.3發布npm包224
12.4小結225
作者介紹
[意]米凱萊貝爾托利(Michele Bertoli)
譯者:林昊
米凱萊·貝爾托利(Michele Bertoli)是Facebook前端工程師,
曾任職於YPlan和BIZZBY等公司,擁有超過15年的實踐經驗。
他喜歡整潔且經過充分測試的代碼,目前致力於使用React.js來開發現代JavaScript應用。