---
# System prepended metadata

title: React筆記

---

# React筆記

### 課前 Day 2｜ ES6 物件解構與強化
[六角題目](https://hackmd.io/N5wSVYrHR5u1kkMaRMCWHg) / [我的codepan](https://codepen.io/wangtaiyan/pen/PoREYyG?editors=0011)

### 課前 Day 3｜ ES6 陣列解構與強化
[六角題目](https://hackmd.io/qroTYRa_TVSSgvHUAALZMg) / [我的codepan](https://codepen.io/wangtaiyan/pen/WNzdeLE?editors=0011)

### 課前 Day 4 ｜ JavaScript 展開與其餘
[六角題目](https://hackmd.io/rC55tBk0Qtyjq-eApUeZMw) / [我的codepan](https://codepen.io/wangtaiyan/pen/RwMxbOr?editors=0011)

### 課前 Day 5｜常見 JS 陣列方法練習
[六角題目](https://hackmd.io/dCnz5QdZQp-oJuqR0IJFqg) / [我的codepan](https://codepen.io/wangtaiyan/pen/PoREowp)

### Day 1｜React JSX
[六角題目](https://hackmd.io/8oroP7oJSS6gqN-ykcbn9A?both) / [我的codepan](https://codepen.io/wangtaiyan/pen/PoRQOXK)

### Day 2｜JSX 屬性練習
[六角題目](https://hackmd.io/yBagsoeCSkKEQ-jXvLpqag?both) / [我的codepan](https://codepen.io/wangtaiyan/pen/NWYyXdE)

### Day 3｜React Hook - useState
[六角題目](https://hackmd.io/EJQ12mm_SIu9BtNqpHNGeg?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/abYGMwG)

### Day 4｜React Hook - useState 進階練習
[六角題目](https://hackmd.io/YG83weiMQtG7EZailLq0bQ?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/XWEYaJP)

### Day 5｜React Hook - useEffect
[六角題目](https://hackmd.io/lGayE3kzT-qfUnAgpPSReQ?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/xxWzLrN)

### Day 6｜React Hook - useEffect 呼叫 API
[六角題目](https://hackmd.io/htysRrOhQ4iQzk9qSh6Sfw?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/BarVdqm)

### Day 7｜元件建立
[六角題目](https://hackmd.io/gORV81mjQWmnviYie2XBnw?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/mdxjJMq)

### Day 8｜整合練習 - 呼叫 API、Loading 元件切換
[六角題目](https://hackmd.io/K62fIzZeTRi8r7UxSXvp0w?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/OJvwExQ)

### Day 9｜元件 props 資料傳遞
[六角題目](https://hackmd.io/4xV05GEoQECiEI3lkVKzLA?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/XWExrzQ)

### Day 10 ｜元件陣列資料 props 傳遞
[六角題目](https://hackmd.io/1gouMJamQj6zQSX-Ym04cg?view) / [我的codepan](https://codepen.io/wangtaiyan/pen/oNqaNNB)

### Day 11 ｜元件 props 事件處理
[六角題目](https://hackmd.io/W1wee-fpT5aBqHIWlERBCQ) / [我的codepan](https://codepen.io/wangtaiyan/pen/Barqbgb)

### Day 12｜React Hook - useContext
[六角題目](https://hackmd.io/UWHU1d57TPKjRPhxZPr9sA) / [我的codepan](https://codepen.io/wangtaiyan/pen/XWEyzrQ)

### Day 13 ｜React Router 建立
[六角題目](https://hackmd.io/VqEGaLa7TAW41hKsWZp4kA) / [GitHub](https://github.com/TedWang06/react-daily-task-router/blob/main/src/App.js)

### Day 14 ｜React Router
[六角題目](https://hackmd.io/2PcaYppLQlCmx7eldhTJ1w) / [GitHub](https://github.com/TedWang06/react-daily-task-router/blob/main/src/App.js)

### Day 15 ｜React Router 動態路由
[六角題目](https://hackmd.io/F3UphiNUQx6XP5nXxhCOEQ) / [GitHub](https://github.com/TedWang06/react-daily-task-router/blob/main/src/App.js)

### Day 16 ｜React Hook Form - required
[六角題目](https://hackmd.io/v5gALNn4R2it5FzooT2sew) / [我的codepan](https://codepen.io/wangtaiyan/pen/dyebYBK)

### Day 17 ｜React Hook Form - email, password
[六角題目](https://hackmd.io/cBGCCAQTT_WZEYcKrd5taA) / [我的codepan](https://codepen.io/wangtaiyan/pen/bGMbEqV)

### Day 18 ｜React Hook Form - Submit Form
[六角題目](https://hackmd.io/PfhXp-a1QxiCgkk6XYoGmg) / [我的codepan](https://codepen.io/wangtaiyan/pen/GRdKwQd)

### Day 19 ｜axios headers token settings
[六角題目](https://hackmd.io/neQCMjvQSQC0kG6arpf0Mw) / [我的codepan](https://codepen.io/wangtaiyan/pen/rNvBQEM)


### 第一週講義 [連結](https://rpg.hexschool.com/training/31/show?embedhm=EYEIimtpQH6rETHtlvLEgg)
[作業lv1](https://codepen.io/wangtaiyan/pen/xxWzXrE?editors=0010)
[作業lv2](https://codepen.io/wangtaiyan/pen/oNqypZv)
[作業lv3](https://codepen.io/wangtaiyan/pen/rNdrOGm)

### 第二週講義 [連結](https://rpg.hexschool.com/training/31/show?embedhm=8M7VYdBAQJqcnZMatyc42Q)
[todolist](https://codepen.io/wangtaiyan/pen/WNJbGqr?editors=0010)