ReactJS 實踐入門 React Js Foundations Building User Interfaces with Reactjs: An Approachable Guide
[美]克裡斯·明尼克(Chris Minnick) 著 王超 譯
- 出版商: 清華大學
- 出版日期: 2023-11-01
- 定價: $768
- 售價: 8.5 折 $653
- 語言: 簡體中文
- 頁數: 386
- 裝訂: 平裝
- ISBN: 7302645671
- ISBN-13: 9787302645672
-
相關分類:
Drupal、JavaScript、React
- 此書翻譯自: React Js Foundations Building User Interfaces with Reactjs: An Approachable Guide (Paperback)
立即出貨
買這商品的人也買了...
-
TypeScript 程式設計 (Programming TypeScript)$580$458 -
Spring REST API 開發與測試指南｜使用 Swagger、HATEOAS、JUnit、Mockito、PowerMock、Spring Test$580$458 -
金魚都能懂的 CSS 必學屬性：網頁設計必備寶典（iT邦幫忙鐵人賽系列書）$720$562 -
React Hooks 實戰$588$559 -
React 設計原理$654$621 -
React Hooks 開發實戰$534$507 -
DevOps Handbook ｜打造世界級技術組織的實踐指南, 2/e (中文版) (The Devops Handbook: How to Create World-Class Agility, Reliability, & Security in Technology Organizations, 2/e)$650$514 -
$556大規模語言模型：從理論到實踐 -
$356Python數據科學實戰 -
Chatbot 從0到1：對話式交互實踐指南, 2/e$714$678 -
$403碼上行動：用 ChatGPT 學會 Python 編程巧用 ChatGPT 快速搞定 Python -
$356Python數據科學基礎 -
Llama 大模型實踐指南$474$450 -
$403AI 提示工程 — 基礎.應用.實例 -
數據科學技術：文本分析和知識圖譜$774$735 -
用 ChatGPT 詠唱來點亮 React ＆ 前端技能樹$880$695 -
前端開發測試入門｜現在知道也還不遲的自動化測試策略必備知識$580$458 -
建立演進式系統架構｜支援常態性的變更, 2/e (Building Evolutionary Architectures: Automated Software Governance, 2/e)$580$458 -
Kubernetes 零基礎實戰$419$398 -
駕馭組織 DevOps 六面向：變革、改善與規模化的全局策略$750$525 -
Clean Code 錦囊妙計 (Clean Code Cookbook : Recipes to Improve the Design and Quality of Your Code)$880$695 -
Go語言中的高效並發技術$534$507 -
C的快速 + Python 的易學 - Go語言全功能開發養成書$880$695 -
前端測試指南：策略與實踐$650$507 -
演算法 圖解原理 x Python 實作 x 創意應用 王者歸來, 4/e$780$616
相關主題
商品描述
"當今更流行的JavaScript庫的實操指南 在《ReactJS實踐入門》一書中，全棧開發者Chris Minnick使用廣受歡迎的前端工具ReactJS為讀者講解基本的編程概念，教會讀者如何理解React，並通過示例說明瞭如何應用所學知識來構建應用程序。 《ReactJS實踐入門》將幫助讀者學習ReactJS開發人員使用的專業術語，以及實踐對於React編程新手和老手都有幫助的現代示例。《ReactJS實踐入門》假定讀者沒有軟件工程知識基礎或相關經驗，因此在介紹相關術語時會進行詳細 闡述。 對於剛接觸JavaScript和前端開發的讀者，包括那些初次接觸編程的讀者，《ReactJS實踐入門》是一個很優秀的資源，適合初出茅廬的訓練營畢業生，半路出家自學成才的程序員，以及具有WordPress、Drupal或其他編程語言基礎且想要學習React的開發人員。對於資深JavaScript開發人員，《ReactJS實踐入門》則可作為一本簡明易懂的React指南，幫助他們快速上手。 "
目錄大綱
目 錄
第1章 Hello,World！ 1
1.1 在沒有工具鏈的情況下
如何使用React 1
1.2 使用Create React App
和JSX創建交互式
“Hello,World”應用程序 6
1.3 本章小結 7
第2章 React基礎 9
2.1 React名稱的由來 9
2.2 UI層 10
2.3 虛擬DOM 11
2.4 React的原理 12
2.4.1 關於組件 12
2.4.2 組合與繼承 13
2.4.3 React是聲明式的 13
2.4.4 React是慣用語 14
2.4.5 為什麽要學習React 15
2.4.6 React與其他框架的
比較 15
2.4.7 React不是什麽 17
2.5 本章小結 18
第3章 JSX 21
3.1 JSX不是HTML 21
3.2 什麽是JSX 26
3.2.1 JSX的工作方式 26
3.2.2 轉譯器 28
3.3 JSX的語法基礎 29
3.3.1 JSX是JavaScript XML 29
3.3.2 避免使用保留字 30
3.3.3 JSX使用駝峰式命
名法 30
3.3.4 為DOM元素中的自定義
屬性加上data-前綴 30
3.3.5 JSX布爾屬性 31
3.3.6 使用花括號包含
JavaScript字面量 31
3.3.7 何時在JSX中使用
JavaScript 32
3.3.8 JSX中的條件 32
3.3.9 JSX中的表達式 34
3.3.10 在JSX中使用子
元素 35
3.3.11 React Fragment 36
3.3.12 本章小結 37
第4章 組件 39
4.1 什麽是組件 39
4.2 組件和元素 40
4.2.1 組件定義元素 40
4.2.2 元素調用組件 41
4.3 內置組件 42
4.3.1 HTML元素組件 42
4.3.2 Attributes和Props 46
4.4 用戶定義的組件 50
4.5 組件類型 51
4.5.1 類組件 51
4.5.2 逐步瞭解React類
組件 60
4.5.3 函數組件 67
4.5.4 函數組件和類組件的
區別 75
4.6 React子組件 75
4.6.1 this.props.children 75
4.6.2 Children的用法 76
4.7 組件的生命周期 79
4.7.1 掛載 79
4.7.2 更新 80
4.7.3 卸載 82
4.7.4 錯誤處理 82
4.7.5 提高性能並避免錯誤 82
4.8 渲染組件 87
4.8.1 用ReactDOM渲染 87
4.8.2 虛擬DOM 88
4.8.3 其他渲染引擎 89
4.9 組件的術語 91
4.10 本章小結 92
第5章 React DevTools 93
5.1 安裝和入門 93
5.2 檢查組件 95
5.2.1 使用組件樹 96
5.2.2 搜索組件 97
5.2.3 篩選組件 99
5.2.4 選擇組件 100
5.3 在DevTools中編輯組件
數據 101
5.4 使用額外的DevTools
功能 103
5.5 性能分析 104
5.6 本章小結 106
第6章 React數據流 107
6.1 單向數據流 107
6.1.1 理解單向數據流 108
6.1.2 為什麽使用單向
數據流 109
6.2 Props 110
6.2.1 組件接收Props 110
6.2.2 Props可以是任何數據
類型 110
6.2.3 Props是只讀的 111
6.2.4 使用PropType驗證
傳入的Props 112
6.2.5 默認Props 123
6.3 ReactState 127
6.3.1 什麽是state 127
6.3.2 初始化state 127
6.3.3 state和props的區別 130
6.3.4 更新狀態 130
6.3.5 狀態中應包含的
內容 140
6.3.6 構建Reminders應用
程序 141
6.3.7 狀態中不應包含的
內容 147
6.3.8 放置狀態的位置 147
6.3.9 狀態提升 148
6.3.10 關於key Prop 154
6.3.11 篩選提醒 160
6.3.12 實現isComplete
更改功能 164
6.4 轉換為類組件 166
6.5 本章小結 173
第7章 事件 175
7.1 React中事件的運行
機制 175
7.2 什麽是SyntheticEvent 177
7.3 使用事件偵聽器屬性 178
7.4 Event對象 178
7.5 支持的事件 180
7.6 事件處理函數 184
7.6.1 編寫內聯事件處理
程序 184
7.6.2 在函數組件中編寫
事件處理程序 185
7.6.3 在類組件中編寫
事件處理程序 186
7.6.4 綁定事件處理程序
函數 187
7.6.5 將數據傳遞給
事件處理程序 190
7.7 本章小結 191
第8章 表單 193
8.1 表單具有狀態 193
8.2 受控輸入與非受控輸入 194
8.2.1 更新受控輸入 195
8.2.2 控制函數組件中的
輸入 195
8.2.3 控制類組件中的輸入 196
8.3 提升輸入狀態 197
8.4 使用非受控輸入 199
8.5 使用不同的表單元素 200
8.5.1 控制input元素 200
8.5.2 控制textarea元素 201
8.5.3 控制select元素 201
8.6 阻止默認操作 202
8.7 本章小結 203
第9章 ref 205
9.1 什麽是ref 205
9.2 如何在類組件中
創建ref 206
9.3 如何在函數組件中
創建ref 206
9.4 使用ref 206
9.5 創建回調ref 208
9.6 何時應使用ref 209
9.7 何時不應使用ref 210
9.8 示例 210
9.8.1 管理焦點 210
9.8.2 自動選擇文本 210
9.8.3 控制媒體播放 212
9.8.4 設置滾動位置 212
9.9 本章小結 213
第10章 樣式化React 215
10.1 樣式的重要性 215
10.2 將CSS導入HTML
文件 216
10.3 在組件中使用普通的舊
CSS 216
10.4 編寫內聯樣式 218
10.4.1 JavaScript樣式
語法 219
10.4.2 為什麽使用內聯
樣式 220
10.4.3 為什麽不使用內聯
樣式 220
10.4.4 使用樣式模塊改進
內聯樣式 220
10.5 CSS模塊 221
10.5.1 命名CSS模塊
文件 222
10.5.2 高級CSS模塊
功能 223
10.6 CSS-IN-JS和樣式化
組件 224
10.7 本章小結 226
第11章 hook介紹 227
11.1 什麽是hook 227
11.2 為什麽要引入hook 227
11.3 使用hook的規則 228
11.4 內置hook 229
11.4.1 使用useState管理
狀態 229
11.4.2 使用useEffect鏈入
生命周期 233
11.4.3 使用useContext訂閱
全局數據 240
11.4.4 將邏輯和狀態與
useReducer相結合 241
11.4.5 使用useCallback緩存
回調函數 242
11.4.6 使用useMemo緩存
計算值 245
11.4.7 使用useRef訪問
子對象 246
11.4.8 使用useImperativeHandle
自定義公開值 247
11.4.9 使用useLayoutEffect
同步更新DOM 248
11.5 編寫自定義hook 248
11.6 使用UseDebugValue標記
自定義hook 250
11.7 查找並使用自定義
hook 252
11.7.1 use-http 252
11.7.2 react-fetch-hook 252
11.7.3 axios-hook 252
11.7.4 react-hook-form 253
11.7.5 @rehooks/local-
storage 253
11.7.6 use-local-storage-
state 254
11.7.7 其他有趣的hook 254
11.7.8 hook列表 254
11.8 本章小結 254
第12章 路由 257
12.1 什麽是路由 257
12.2 React中路由的用法 259
12.3 使用React Router 260
12.3.1 安裝並導入
react-router-dom 260
12.3.2 路由器組件 261
12.3.3 鏈接到路由 263
12.3.4 創建路由 268
12.3.5 location、history和
match對象 274
12.4 React Router hook 280
12.4.1 useHistory 281
12.4.2 useLocation 281
12.4.3 useParams 281
12.4.4 useRouteMatch 281
12.5 本章小結 281
第13章 錯誤邊界 283
13.1 錦囊妙計 283
13.2 什麽是錯誤邊界 284
13.3 實現錯誤邊界 286
13.3.1 構建自己的
ErrorBoundary組件 286
13.3.2 安裝預先構建的
ErrorBoundary組件 295
13.4 錯誤邊界無法捕獲的
錯誤 296
13.4.1 使用try/catch捕獲
錯誤邊界中的錯誤 296
13.4.2 使用react-error-boundary
捕獲事件處理程序中的
錯誤 297
13.5 本章小結 298
第14章 部署React 299
14.1 什麽是部署 299
14.2 構建應用程序 299
14.2.1 運行build腳本 300
14.2.2 檢查build目錄 300
14.2.3 filenames的由來 302
14.3 部署的應用程序有何
不同 303
14.4 開發模式與生產模式 303
14.5 發布到Web上 304
14.5.1 Web服務器托管 304
14.5.2 節點托管 304
14.5.3 使用Netlify進行
部署 305
14.6 本章小結 308
第15章 從頭開始初始化React
項目 309
15.1 構建自己的工具鏈 309
15.1.1 初始化項目 310
15.1.2 HTML文檔 310
15.1.3 主JavaScript文件 311
15.1.4 根組件 311
15.1.5 在瀏覽器中運行 312
15.2 Webpack的工作原理 315
15.2.1 加載器 315
15.2.2 插件 315
15.3 自動化構建過程 316
15.3.1 製作HTML模板 316
15.3.2 開發服務器和熱
重載 317
15.3.3 測試工具 317
15.3.4 創建npm腳本 321
15.4 構建源目錄 322
15.4.1 按文件類型分組 322
15.4.2 按功能分組 323
15.5 本章小結 323
第16章 獲取和緩存數據 325
16.1 異步代碼：與時間
有關 325
16.2 JavaScript永不休眠 326
16.3 在React中如何運行異步
代碼 329
16.4 獲取數據的方法 331
16.5 使用Fetch獲取數據 332
16.6 使用axios獲取數據 332
16.7 使用Web Storage 334
16.7.1 Web Storage的兩個
屬性 334
16.7.2 何時使用
Web Storage 335
16.7.3 何時不使用
Web Storage 335
16.7.4 Web Storage是
同步的 335
16.7.5 使用localStorage的
示例 336
16.7.6 使用localStorage
存儲數據 336
16.7.7 從localStorage
讀取數據 337
16.7.8 從localStorage中
刪除數據 339
16.8 本章小結 339
第17章 Context API 341
17.1 什麽是prop drilling 341
17.2 Context API如何解決
問題 342
17.2.1 創建Context 342
17.2.2 創建Provider 343
17.2.3 使用Context 343
17.3 Context的常見用例 345
17.4 不適用Context的情況 345
17.5 合成模式作為Context的
替代方案 346
17.6 示例應用程序：用戶偏好
設置 349
17.7 本章小結 351
第18章 React Portal 353
18.1 什麽是Portal 353
18.1.1 如何創建Portal 353
18.1.2 為什麽不直接渲染
多個組件樹 356
18.2 常見用例 357
18.2.1 模態對話框的渲染與
交互 357
18.2.2 使用模態管理鍵盤
焦點 362
18.3 本章小結 363
第19章 React中的無障礙性 365
19.1 為什麽無障礙性
很重要 365
19.2 無障礙性基礎 366
19.2.1 Web內容無障礙性
指南(WCAG) 366
19.2.2 Web無障礙計劃-無障礙
富互聯網應用程序
(WAI-ARIA) 367
19.3 在React組件中實現無障
礙性 367
19.3.1 React中的ARIA
屬性 367
19.3.2 語義化的HTML 368
19.3.3 表單無障礙性 369
19.3.4 React中的焦點
控制 369
19.3.5 React中的媒體
查詢 371
19.4 本章小結 373
第20章 高級主題 375
20.1 測試 375
20.1.1 Mocha 376
20.1.2 Enzyme 376
20.1.3 Chai 377
20.2 服務器端渲染 379
20.2.1 Flux 380
20.2.2 Redux 380
20.2.3 GraphQL 382
20.2.4 Apollo 383
20.2.5 React Native 383
20.2.6 Next.js 384
20.2.7 Gatsby 384
20.3 需要關註的人 384
20.4 有用的鏈接和資源 385
20.5 本章小結 385
