載入中…
載入中…
學習 React 元件化開發思維，掌握 Props、State、Hooks 與路由管理，完成一個完整的 React 前端專案。
每章講義 PDF 可免費線上預覽；範例程式碼與打包下載請進入各章節頁。
講義教材整理中，敬請期待。
建立一個使用者列表頁面，從 JSONPlaceholder API 取得 10 筆使用者資料，實作即時搜尋（輸入名稱立即篩選），並加入 loading 與 error 狀態。
用 useEffect 的 cleanup function 取消前一次請求，或搭配 AbortController 避免 race condition。
用 React + React Router 建立購物車應用：商品列表頁、商品詳情頁、購物車頁。實作加入購物車、修改數量、刪除商品、計算總金額功能。
購物車狀態用 useContext + useReducer 管理，或用 Zustand 套件。使用 localStorage 讓資料在重新整理後保留。
建立 ProfileCard 元件，Props 包含姓名、職稱、技能列表、頭像 URL。技能列表用 map 渲染，加入 isOnline 布林 prop 顯示線上/離線狀態。
用 conditional rendering：{isOnline && <span>🟢</span>} 或三元運算子。