Next.js 基础:从不懂 React/JS 到能做一个小站

这门课给「想学 Next.js 基础,但不懂 React,对 JavaScript 也不太了解」的学习者。它不把你直接扔进一堆配置和框架名词里,而是先补上能读懂 Next.js 项目的最小 JS/React,再一步步做页面、路由、样式、交互、服务端取数和一个收尾小站。

学完你将能(course objectives):

• 能说清 Next.js、React、JavaScript、Node.js 在一个项目里各管什么。
• 能创建并运行一个 App Router 项目,看懂 app/、page.tsx、layout.tsx、public/ 的职责。
• 能用 JSX、组件、props、数组渲染写出静态页面。
• 能用路由、布局、Link、CSS Modules、Image 组织一个小网站。
• 能判断什么时候需要 Client Component,并用事件处理和 useState 做简单交互。
• 能在 Server Component 里取数据,并用 next build 做一次交付前检查。

先修: 会使用电脑文件夹和命令行的最基本操作。不会 React、不会 Next.js、JS 不熟都可以。

练习环境: 你自己的 IDE/终端/纸笔。本课不内嵌沙盒;代码都可以放进一个本地 Next.js 项目里。

课时表

来源见 sources.md。