自動播放
自動完成
上一個單元
Complete and Continue
[FE301] React 基礎(Class component 版)
課前須知
課前須知
先別急著學 React
先用 jQuery 來寫一個 todo list 吧! (22:03)
把 todo list 給存起來 (18:01)
todo list 的問題在哪? (4:59)
來寫一個不一樣的 todo list! (9:09)
其實這就是 React (4:38)
React 環境建置
建置 React 環境 (1:10)
前置作業:webpack (6:38)
前置作業:babel (5:12)
把 React 加進來 (6:33)
webpack dev server (6:31)
另一個選擇:create react app (5:39)
React 基礎
Component 與 render function (5:29)
JSX 語法 (8:03)
React 的事件機制 (3:24)
state 與改變 state (17:57)
props 與 state (11:03)
Component 間的溝通 (8:55)
如何加上 CSS? (8:32)
React 的生命週期
constructor 的作用 (11:33)
shouldComponentUpdate (11:55)
componentDidMount 與 componentWillUnmount (6:08)
componentDidUpdate (9:01)
其他生命週期 (5:09)
把 Todo list 改寫成 React
基本功能:新增、刪除、標記完成與 filter (23:17)
加上 localStorage (5:18)
初探 React 背後的運作方式
JSX 的真面目 (2:59)
React 的渲染機制與 Virtual DOM (4:57)
Pure component 與 Immutable data
React 實戰:Form 報名表單
先從刻介面開始 (5:58)
controlled 與 un-controlled 的差異 (13:08)
幫其他元件加上 state (21:08)
進階練習:表單驗證功能 (1:03)
進階練習:表單還沒 submit 就驗證 (0:55)
魔王練習:自動暫存內容 (1:20)
Job Board 職缺報報
一樣先從介面開始 (3:11)
開始實作功能 (5:51)
進階練習:加入 filter (1:20)
進階練習:加入關注清單 (0:53)
魔王練習:實作搜尋功能 (1:01)
Teach online with
另一個選擇:create react app
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock