Next.js 学习路线

目标

系统学习 Next.js，达到可以独立开发项目、理解核心原理、应对前端/全栈岗位面试的程度。

前置基础

• JavaScript ES6+
• TypeScript
• React
• HTML / CSS
• HTTP 基础
• Node.js 基础

学习阶段

第一阶段：入门

• Next.js 是什么
• 创建项目
• 项目目录结构
• App Router 基础
• page.tsx
• layout.tsx
• Link 导航

第二阶段：核心机制

• Server Components
• Client Components
• SSR / SSG / ISR / CSR
• Suspense
• Streaming
• Hydration

第三阶段：数据与缓存

• Server Component 获取数据
• fetch 缓存
• revalidate
• 动态渲染
• 客户端数据获取

第四阶段：后端能力

• Route Handlers
• Server Actions
• 表单提交
• Cookies
• Headers
• Middleware
• Auth

第五阶段：工程化

• 环境变量
• 目录规范
• 组件拆分
• 错误处理
• 性能优化
• 部署

第六阶段：实战项目

• Todo App
• Blog System
• Admin Dashboard
• Fullstack Auth Project

第七阶段：面试准备

• 高频概念题
• 原理题
• 项目亮点
• 性能优化
• 手写题