Next.js 14 - 進階 培訓

引言

現代 React

• React 18 和 19 的新增內容
• 現代化工具及方法改變

React 高級 Hooks

• useMemo, useCallback, useDispatch, useRef, useImperativeHandle

React 中的併發模式

• 使用 useTransition、useDeferredValue hooks

Next.js 路由

• App Router 和 Pages Router 之間的差異

Next.js 渲染策略

• 伺服器端渲染 vs. 單頁應用程序 vs. 靜態生成

伺服器組件和伺服器操作

• ‘use server’ 和 ‘use client’ 指令的使用

數據獲取與緩存

• 增量靜態再生策略

將 Next.js 用作後端

• Edge Functions 和 Edge Runtime

狀態管理

• React Context、Redux，以及原子狀態管理（Zustand）

在 Next.js 中創建模板

• 可重用模板
• 可用的 CSS 方法和模板庫

性能優化

• 提升加載時間，實現高水平的 Web Core Vitals 分數

儀表板

Next.js 測試

Monorepo 策略

• 結合 TurboRepo / Nx 使用 Next.js

監控、部署和編排

總結與下一步