123,123

內(nèi)容簡(jiǎn)介

　　本書通過一個(gè)奇幻故事的外殼講解 React 開發(fā)的核心思維模型，即如何用 React 的獨(dú)特方式思考和解決問題。故事主角用腦機(jī)進(jìn)入“Web 宇宙”，登陸“React 星”。通過體驗(yàn)各種離奇見聞，由淺入深地介紹 React 開發(fā)的核心知識(shí)點(diǎn)，例如聲明式和響應(yīng)式編程、不可變約定、單向數(shù)據(jù)流、組件組合的運(yùn)用、組件渲染特性、Hook 的基本原理和常見模式、組件構(gòu)架設(shè)計(jì)和State 管理，等等。“讓讀者在娛樂中學(xué)習(xí)”，這是作者的初衷。為了幫助讀者理解和記憶，本書為每一個(gè)思維模型都配備了生動(dòng)有趣的故事橋段和漫畫插圖。本書強(qiáng)調(diào)揭示各個(gè)概念的本質(zhì)，不光展示“如何做”，更注重解釋“為什么”，并輔以實(shí)例操作，旨在打開一扇門——鼓勵(lì)讀者深挖基礎(chǔ)知識(shí)，增強(qiáng)自行推演結(jié)論、進(jìn)一步學(xué)習(xí)實(shí)戰(zhàn)知識(shí)的能力。本書主要適合對(duì) HTML、CSS、JavaScript、DOM 有一定了解的前端開發(fā)者、設(shè)計(jì)師和高校學(xué)生等閱讀。

作者簡(jiǎn)介

　　葉凌東是一名軟件工程師、科普作者和創(chuàng)業(yè)者，React Working Group成員，致力于創(chuàng)新，熱衷于知識(shí)分享，信奉終身學(xué)習(xí)。多年來活躍在軟件工程、設(shè)計(jì)工具、開發(fā)與設(shè)計(jì)協(xié)作等領(lǐng)域。2017年創(chuàng)辦 LearnReact.Design 網(wǎng)站，至今已經(jīng)幫助了世界各地?cái)?shù)萬(wàn)名設(shè)計(jì)師和前端工程師提升編程技能，包括來自谷歌、臉書、亞馬遜、推特、Uber 等公司的設(shè)計(jì)師及開發(fā)者。所寫文章發(fā)表于 Smashing Magazine、UX Planet、FreeCodeCamp 等業(yè)內(nèi)知名網(wǎng)站。 Beebee我是插畫師Beebee，我經(jīng)常從我的夢(mèng)中獲得畫畫的靈感。在夢(mèng)中，我看見猛犸象在追逐馬戲團(tuán)里騎車的小熊；我看見洲際導(dǎo)彈在空中綻放出璀璨的煙花；我試圖說服秦始皇停止殺戮；我和愛德華王子用中文交談；我停留在了一個(gè)奇異的地方，那里有金色的睡蓮、湛藍(lán)的水草，還有蒼白的死魚……那么，在你的夢(mèng)里面有些什么呢？

圖書目錄

第1 章　重返React 星 / 1
1.1 墻上的洞 / 2
1.1.1 上帝視角：代碼例子 / 4
1.1.2 讓它動(dòng)起來 / 5
1.1.3 State / 7
1.1.4 模板：將數(shù)據(jù)從用戶界面中分離 / 8
1.2 儀式之二 / 9
1.2.1 聲明式與命令式 / 10
1.2.2 響應(yīng)式 / 14
1.3 初展神跡 / 15
1.3.1 獲取文本框內(nèi)容 / 17
1.3.2 將新內(nèi)容寫回文本框 / 19
1.3.3 修復(fù)文本框 / 20
1.3.4 在 React 代碼里使用 CSS 樣式 / 21
1.4 拍照墻的偽裝 / 23
1.4.1 JSX / 25
1.4.2 JSX 的屬性 / 26
1.4.3 嵌套標(biāo)簽 / 26
1.4.4 _jsx 的返回值 / 28
1.4.5 原來就是一個(gè)表達(dá)式 / 28
1.4.6 理解 JSX 和 HTML 的區(qū)別 / 29
1.5 手翻書 / 31
1.6 誘餌 / 35
1.6.1 墻怪愛吃表達(dá)式 / 36
1.6.2 兩種“洞” / 38
1.6.3 條件顯示 / 39
1.6.4 數(shù)組 / 40
1.7 不能修葺的房子 / 42
1.7.1 不可變約定 / 43
1.7.2 State 中的對(duì)象 / 44
1.7.3 State 中的其他類型值 / 45
1.7.4 immer / 46
1.7.5 為什么要不可變 / 49
1.8 筆記強(qiáng)迫癥 / 50
第2 章摩組城 / 53
2.1 摩組城鳥瞰 / 55
2.1.1 自定義 JSX 標(biāo)簽 / 57
2.1.2 組件的寫法 / 58
2.1.3 “啞”組件 / 60
2.2 組件的組合 / 61
2.2.1 包含關(guān)系 / 62
2.2.2 動(dòng)態(tài)包含 / 64
2.2.3 特例化 / 66
2.2.4 組件引用 / 66
2.3 周而復(fù)始的面試 / 67
2.3.1 重復(fù)不斷地渲染 / 68
2.3.2 渲染必須快 / 70
2.3.3 State 筆記本 / 70
2.3.4 異步操作不能等 / 71
2.3.5 渲染要“純粹” / 72
2.4 傳送工程師的接力 / 74
2.4.1 單向數(shù)據(jù)流 / 77
2.4.2 數(shù)據(jù)所有者和消費(fèi)者 / 81
2.5 單向電梯 / 82
2.5.1 prop drilling / 85
2.5.2 Context / 87
2.5.3 prop drilling 的其他解決辦法 / 88
2.6 便攜式蟲洞 / 88
2.6.1 從下往上傳數(shù)據(jù) / 91
2.6.2 在樓下交付文件 / 93
2.6.3 下放控制權(quán) / 94
2.6.4 通過 Context 傳遞回調(diào)函數(shù) / 94
2.6.5 JavaScript 中的回調(diào)函數(shù) / 96
2.7 筆記 / 96
第3 章瑞海驚魂 / 99
3.1 古典帆船 / 100
3.2 遭遇胡克船長(zhǎng) / 102
3.3 風(fēng)向急變 / 106
3.3.1 從外部環(huán)境中“勾”回新功能 / 108
3.3.2 保存數(shù)據(jù)以備下次渲染 / 110
3.3.3 保存只讀數(shù)據(jù) / 111
3.3.4 保存可變數(shù)據(jù)，更改時(shí)觸發(fā)渲染 / 113
3.3.5 保存可變數(shù)據(jù)，更改時(shí)不觸發(fā)
渲染 / 118
3.4 尤日伊費(fèi)克特大副 / 122
3.4.1 useEffect 的用法 / 123
3.4.2 Hook 的優(yōu)越性 / 125
3.5 大副的真正職責(zé) / 126
3.5.1 副作用（side effect） / 128
3.5.2 為何要用 useEffect 管理副作用 / 130
3.5.3 副作用同步 / 132
3.5.4 依賴數(shù)組詳解 / 134
3.5.5 組件思維模型 / 137
3.5.6 事件處理器中的副作用 / 139
3.5.7 其他同步 / 141
3.6 戒律清規(guī) / 141
3.6.1 Hook 使用規(guī)則 / 143
3.6.2 山寨 useState / 147
3.6.3 保存多個(gè)狀態(tài) / 150
3.6.4 任性違規(guī) / 153
3.7 條件扔鉤 / 158
3.7.1 有條件地使用 Hook / 159
3.7.2 分拆到子組件 / 160
3.7.3 在 Hook 內(nèi)部講條件 / 161
3.7.4 一直調(diào)用，條件使用 / 161
3.7.5 自律 / 162
3.8 鐵鉤特勤編隊(duì) / 163
3.8.1 自定義 Hook / 164
3.8.2 函數(shù)組合的威力 / 167
3.8.3 狀態(tài)邏輯 / 169
3.9 筆記 / 171
第4 章靈緣幻境 / 175
4.1 React 星的祈禱 / 177
4.2 項(xiàng)目組織結(jié)構(gòu) / 181
4.3 評(píng)判準(zhǔn)則和實(shí)施策略 / 182
4.4 從靜態(tài)出發(fā) / 183
4.4.1 占位符 / 184
4.4.2 重復(fù)部分 / 186
4.5 文件和目錄結(jié)構(gòu) / 188
4.5.1 一個(gè)組件一個(gè)文件？ / 188
4.5.2 目錄結(jié)構(gòu) / 189
4.6 何時(shí)劃分組件 / 190
4.7 業(yè)務(wù)邏輯 / 193
4.7.1 容器和表現(xiàn)層組件 / 193
4.7.2 使用自定義 Hook / 195
4.7.3 容器、表現(xiàn)層組件和Storybook / 197
4.8 State 管理 / 201
4.8.1 State 簡(jiǎn)化 / 201
4.8.2 提升 State / 204
4.8.3 State 放哪里 / 207
4.9 回程 / 212
第5 章后記 / 215
5.1 樣式方案 / 217
5.2 應(yīng)用框架 / 218
5.3 表單 / 218
5.4 路由 / 219
5.5 State 管理 / 220
5.6 開發(fā)輔助工具 / 222
5.7 性能優(yōu)化 / 223
5.8 測(cè)試 / 225
5.9 類組件及相關(guān) / 226
5.10 TypeScript / 227
5.11 前沿技術(shù) / 228