# 《React 思維進化》讀書會第四組章節分工

## 讀書會規則：
- 認領該章節的導讀人有**閱讀責任**及**主持責任**，需要讀完該章節並做筆記（簡報）於讀書會期間分享螢幕畫面帶著與會者導讀，並自行出題目引導大家回答與討論。
- 若導讀人需要請假請於讀書會舉行前一週「自行」到讀書會組別頻道中尋求章節交換。
- 認領該筆記工的人需紀錄讀書會期間的討論，並將筆記上傳至 [GitHub 討論區](https://github.com/Tech-Book-Community/Zet-React-Book/discussions)。
- 成員都至少導讀人及筆記工各當一次，意即本次讀書會最多招收 8 人，這 8 人都當過一次導讀人及筆記工，最少 4 人，最少人數則會各當過 2 次。
- 若讀書會成員需要請假請自行於讀書會組別頻道中請假。
- 成為「讀書會成員」請務必持有「書籍」（實體、電子皆可），**「旁聽者」不需要準備書籍，也不需要認領章節**。
- **若你在讀書會期間有可能會請假兩次以上，建議以「旁聽者」身份參加（意即不用認領章節，時間到上線即可）。**
- 2025/2/18（二）晚上 20:30 ~ 22:00 舉行第一次讀書會，每雙週二舉辦一次，共舉辦 8 次，2025/5/27 結束。

## 導讀人流程：
- 自我介紹
- 前次回顧
- 本次導讀
- 引導成員每個人至少發言一次
- 自行出本次章節的題目讓每個人至少回答一次
- 成員問題討論
- 引導成員對本次章節的疑問及討論
- 成員回饋導讀人
- 次回日期、章節導讀人及筆記工預告

書籍勘誤表：https://zet-chou.notion.site/React-5c66a77a540c4f46911c69f052b73d26

<iframe src="https://docs.google.com/spreadsheets/d/1LuOf6akQuKmgkBxK5WuCYQ1DwFvlS4bIyXaxkypPnzk/edit?gid=48699463" width="100%" height="500px"></iframe>

## 第一篇 暖身準備
自己讀就行

## 第二篇 React 的畫面管理機制

### 2-1 DOM 與 Virtual DOM </br> 2-2 建構畫面的最小單位：React element </br> 2-3 Render React element
- 日期：2025/2/18
- 導讀人：Evan
- 筆記工：上竣
- 簡報連結：https://hackmd.io/@jBtIOIbzQw6TAP6mgQvCYQ/2-1
- 請假：
- 缺席：

### 2-4 JSX 根本就不是在 JavaScript 中寫 HTML </br> 2-5 JSX 的語法規則脈絡與畫面渲染的實用技巧</br>2-6 單向資料流與一律重繪渲染策略
- 日期：2025/3/4
- 導讀人：Jasmine
- 筆記工：Evan
- 簡報連結：[簡報](https://hackmd.io/@ZfvMNjp-R5aqMnWoR8YnfA/HkHgTy1oke)
- 請假：33
- 缺席：

### 2-7 畫面組裝的藍圖：component 初探</br>2-8 React 畫面更新的發動機：state 初探 </br> 2-9 React 畫面更新的流程機制：reconciliation
- 日期：2025/3/18
- 導讀人：上竣
- 筆記工：stella
- 簡報連結：https://slidev-react-20250318.vercel.app/
- 請假：
- 缺席：

## 第三篇 State 資料的管理與維護

### 3-1 如何在子 component 裡觸發更新父 component 的資料 </br> 3-2 深入理解 batch update 與 updater function
- 日期：2025/4/1
- 導讀人：小9
- 筆記工：33
- 簡報連結：[簡報](https://docs.google.com/presentation/d/1cAHL9KLfacsZskK9_yAcEHsUbjD3zTxtTw8GYH0_O9g/edit?usp=sharing)
- 請假：
- 缺席：

### 3-3 維持 React 資料流可靠性的重要關鍵：immutable state </br> 3-4 Immutable update
- 日期：2025/4/15
- 導讀人：33
- 筆記工：Blue
- 簡報連結：[簡報](https://www.canva.com/design/DAGkTgoaEkM/A0d8qY6agGCGM4zYIMf2Jg/edit)
- 請假：stella
- 缺席：

## 第四篇 Component 的生命週期與資料流

### 4-1 Component 的生命週期 </br> 4-2 Function component 與 class component 關鍵區別 </br> 4-3 每次 render 都有自己的 props、state 與 event handler 函式
- 日期：2025/4/29
- 導讀人：Blue
- 筆記工：Tay
- 簡報連結：[簡報](https://gamma.app/docs/429-React--rm8iyuyhgq30bnq)
- 請假：小 9
- 缺席：

## 第五篇 Effect 與 hooks

### 5-1 React 中的副作用處理：effect 初探 </br> 5-2 useEffect 其實不是 function component 的生命週期 API</br> 5-3 維護資料流的連動：不要欺騙 hooks 的 dependencies
- 日期：2025/5/13
- 導讀人：Tay
- 筆記工：小9
- 簡報連結：[簡報](https://hackmd.io/@IQUfgf94T5yBroECxuNbzA/H1ocUQClxx#/)
- 請假：33
- 缺席：

### 5-4 React 18 的 effect 函式在 mount 時為何會執行兩次？ </br> 5-5 副作用處理的常見情境設計技巧 </br> 5-6 useCallback 與 useMemo 的正確使用時機 </br> 5-7 Hooks 的運作原理與設計思維
- 日期：2025/5/27
- 導讀人：stella
- 筆記工：Jasmine
- 簡報連結：[簡報](https://www.figma.com/slides/GRnQZTm8vy5JEv8i0qGSF1/React-%E6%80%9D%E7%B6%AD%E9%80%B2%E5%8C%96%E8%AE%80%E6%9B%B8%E6%9C%83?node-id=0-1&t=xTHidnwElXJ5jF0b-1)
- 請假：
- 缺席：