Outcomes
学完这一阶段，你应该能做到什么
不要求一次到位，但你至少应该把这几个判断和动作练熟。
- 知道如何把前端、后端、数据层和部署拆成可协作子任务。
- 能让 AI 参与接口设计、数据库迁移、认证与监控方案讨论。
- 理解发布不是“把站点传上去”，而是一条从构建到验证的完整链路。
Lessons
核心课时
每节课都为一个工程动作服务，而不是只堆定义。
Course Content
正式课程内容
下面这部分才是这个阶段真正要读、要练、要做的正文。建议先顺序读，再回头做 mission 和 quiz。
真正的全栈项目难点不在于前端、后端、数据库、部署分别怎么做，而在于这些层之间怎样有边界地协作。AI 在这里最适合做的是加速，而不是替你拍板架构。
这阶段要建立的是产品交付视角：每一层都要知道自己的输入、输出和风险，再让 AI 帮你补实现、查问题、写说明和准备发布。
前端页面、组件与状态
UI 不是堆组件，而是围绕用户路径组织页面、状态和反馈。
这一课要掌握什么
- 知道前端结构为什么要先于样式细节。
- 理解页面、组件、状态的分层。
- 学会约束 AI 只在明确边界内落 UI。
正式讲解
前端最容易出现的问题是看起来有很多组件，但用户路径并不清楚。你应该先问：用户从哪进来、第一眼看什么、点完下一步去哪、状态从哪里来、出错时如何反馈。
AI 很适合帮你写组件和交互细节，但你要先定义页面结构、信息层级和状态来源。否则它会在不同组件里随意分散状态，后面很难维护。
所以前端任务最好分成三层：页面目标、组件边界、状态流。把这三层写清楚，AI 写出的 UI 才会更像系统，而不是拼图。
Practice
练习：为一个页面写状态地图
- 选一个后台列表页或课程页。
- 写出页面目标、主要组件和数据来源。
- 标出加载、空态、错误态和成功态。
Homework
课后作业：前端页面、组件与状态
- 选一个真实功能或 bug，把这节课的方法应用一遍。
- 记录你让 AI 参与的部分，以及你自己保留判断的部分。
- 补一份最小验证清单，确保这节课不是只停留在“会说”。
交付一份真实任务记录，包含改动目标、AI 参与方式和验证结果。
Test
你能不能把这节课的方法用到一个陌生但相似的问题上？
你应该能回答
- 请说明这节课最关键的工作流顺序。
- 请举例说明如果跳过验证会发生什么。
- 请给出一个你会保留人工判断的节点。
通过标准
- 能说清正确顺序，而不是只记住几个动作名词。
- 知道这节课最主要的风险点。
- 能把 AI 和人工判断分工讲明白。
Evaluation
优秀
你已经能把这节课的方法稳定迁移到真实开发任务中，并主动补验证。
达标
你能在给定场景里按步骤完成任务，并识别主要风险。
还需加强
你还容易把 AI 当作自动完成器，没有把验证和人工判断守住。
学完自检
- 我先想用户路径，再写组件。
- 我能说明状态从哪里来。
- 我会要求 AI 明确空态和错误态。
后端接口与数据层
接口和数据边界是全栈项目最不能含糊的部分。
这一课要掌握什么
- 理解为什么接口契约要先明确。
- 知道数据层和业务层应分开考虑。
- 学会让 AI 在受控边界内生成接口草稿。
正式讲解
在全栈项目里，接口契约相当于前后端之间的共同语言。接口返回什么字段、错误如何表达、权限怎么判定，如果这些地方一开始就模糊，AI 很容易替你做出错误假设。
数据层则要求你想清楚存储结构和业务逻辑的关系。表结构怎么设计、字段哪些必须唯一、哪些操作要有事务边界，这些都不能靠感觉补。
AI 可以帮你列接口草案、找常见错误处理、生成初版 schema，但真正该先完成的仍然是契约定义。
Practice
练习：定义一个接口契约
- 选一个常见动作，比如“创建记录”。
- 写出请求体、成功返回、错误返回和权限前提。
- 检查前后端是否能只凭这份说明独立实现。
Homework
课后作业：后端接口与数据层
- 选一个真实功能或 bug，把这节课的方法应用一遍。
- 记录你让 AI 参与的部分，以及你自己保留判断的部分。
- 补一份最小验证清单，确保这节课不是只停留在“会说”。
交付一份真实任务记录，包含改动目标、AI 参与方式和验证结果。
Test
你能不能把这节课的方法用到一个陌生但相似的问题上？
你应该能回答
- 请说明这节课最关键的工作流顺序。
- 请举例说明如果跳过验证会发生什么。
- 请给出一个你会保留人工判断的节点。
通过标准
- 能说清正确顺序，而不是只记住几个动作名词。
- 知道这节课最主要的风险点。
- 能把 AI 和人工判断分工讲明白。
Evaluation
优秀
你已经能把这节课的方法稳定迁移到真实开发任务中，并主动补验证。
达标
你能在给定场景里按步骤完成任务，并识别主要风险。
还需加强
你还容易把 AI 当作自动完成器，没有把验证和人工判断守住。
学完自检
- 我能给接口写出清楚契约。
- 我会区分业务逻辑和数据结构。
- 我不会让 AI 自己猜接口。
认证、安全与观测性
这些不是上线前才补的增强项，而是设计阶段就该进入边界定义的核心内容。
这一课要掌握什么
- 理解认证、安全和观测性为什么要提前出现。
- 知道最小安全清单包含什么。
- 建立上线后可观测的意识。
正式讲解
很多项目在 demo 阶段跑得很快，但一到接近上线就暴露出大量问题：谁能访问什么、错误发生后怎么看、敏感数据怎么保护、线上出问题怎么发现。原因通常不是技术难，而是这些问题从一开始就没进设计。
认证决定了角色和权限边界，安全决定了哪些输入和数据需要保护，观测性决定了上线后你有没有办法看见问题。任何一个环节缺失，项目都很难稳定进入真实使用。
所以在定义任务时，你至少要问：这页谁能看？这个接口谁能调？出了错我在哪里看到？日志里要不要脱敏？
Practice
练习：给一个小系统写最小安全清单
- 列出 3 条权限规则。
- 列出 3 个你要记录的错误或行为日志。
- 列出 2 个你必须保护的敏感信息。
Homework
课后作业：认证、安全与观测性
- 选一个真实功能或 bug，把这节课的方法应用一遍。
- 记录你让 AI 参与的部分，以及你自己保留判断的部分。
- 补一份最小验证清单，确保这节课不是只停留在“会说”。
交付一份真实任务记录，包含改动目标、AI 参与方式和验证结果。
Test
你能不能把这节课的方法用到一个陌生但相似的问题上？
你应该能回答
- 请说明这节课最关键的工作流顺序。
- 请举例说明如果跳过验证会发生什么。
- 请给出一个你会保留人工判断的节点。
通过标准
- 能说清正确顺序，而不是只记住几个动作名词。
- 知道这节课最主要的风险点。
- 能把 AI 和人工判断分工讲明白。
Evaluation
优秀
你已经能把这节课的方法稳定迁移到真实开发任务中，并主动补验证。
达标
你能在给定场景里按步骤完成任务，并识别主要风险。
还需加强
你还容易把 AI 当作自动完成器，没有把验证和人工判断守住。
学完自检
- 我会在设计阶段写权限边界。
- 我知道上线后必须能看到错误。
- 我不会把安全当成最后补丁。
从本地构建到 Cloudflare 发布
发布的本质是把本地可验证结果稳定地送到线上，而不是点一个按钮。
这一课要掌握什么
- 理解构建、预览、发布三步的区别。
- 知道部署前必须确认哪些信息。
- 学会把上线过程写成标准清单。
正式讲解
本地能跑并不代表线上能用。构建阶段会暴露路径、类型、资源、环境变量等问题；预览阶段会让你看到发布后的真实产物；正式发布阶段则要求你确认域名、凭据、回滚和观察方式。
Cloudflare 这类平台会让静态站和全栈站的发布非常方便，但‘方便’不等于‘可以跳过检查’。你仍然需要先确认 build 命令、输出目录、环境变量、预览地址和域名绑定是否都正确。
真正成熟的发布方式是把这套步骤写进脚本和清单里，让你和 AI 都能重复执行，而不是每次靠记忆手动操作。
Practice
练习：写一份最小发布清单
- 列出 build 前要确认的 3 项信息。
- 列出预览阶段要检查的 3 个页面或行为。
- 列出正式发布后要观察的 2 个指标。
Homework
课后作业：从本地构建到 Cloudflare 发布
- 选一个真实功能或 bug，把这节课的方法应用一遍。
- 记录你让 AI 参与的部分，以及你自己保留判断的部分。
- 补一份最小验证清单，确保这节课不是只停留在“会说”。
交付一份真实任务记录，包含改动目标、AI 参与方式和验证结果。
Test
你能不能把这节课的方法用到一个陌生但相似的问题上？
你应该能回答
- 请说明这节课最关键的工作流顺序。
- 请举例说明如果跳过验证会发生什么。
- 请给出一个你会保留人工判断的节点。
通过标准
- 能说清正确顺序，而不是只记住几个动作名词。
- 知道这节课最主要的风险点。
- 能把 AI 和人工判断分工讲明白。
Evaluation
优秀
你已经能把这节课的方法稳定迁移到真实开发任务中，并主动补验证。
达标
你能在给定场景里按步骤完成任务，并识别主要风险。
还需加强
你还容易把 AI 当作自动完成器，没有把验证和人工判断守住。
学完自检
- 我知道 build、preview、deploy 的区别。
- 我能写出最小发布清单。
- 我不会把发布理解成纯按钮操作。
Deep Dive
这一阶段真正要建立的工程习惯
读完下面这些部分，再去做练习和复盘，学习效率会高很多。
全栈项目最怕边界模糊
前端、后端、数据库和部署同时变化时，AI 很容易在未明确约束的地方做出隐性假设。因此你要先定义接口、数据模型、错误语义和发布边界。
边界越清晰，越适合并发拆任务；边界越模糊，越应该由主代理或人类先收敛方案。
安全和监控要提前出现
认证、权限、敏感数据、日志脱敏和错误监控，不应该被当成后面补的“增强项”。如果你一开始不写进任务边界，AI 生成的初版往往会遗漏这些高风险点。
把这些内容提前定义，也能让 review 更聚焦。
部署是工程能力，不是按钮
发布到 Cloudflare Pages 之前，你需要先保证本地能稳定构建、环境变量可管理、输出目录正确、预览链接可验证。
这套流程越明确，后续接 GitHub 自动部署和自定义域名时越省心。
Mission
设计一个全栈课程网站的交付方案
围绕课程站点，拆分出前端内容渲染、进度存储、部署配置和域名绑定四类任务，并说明每类任务的验证方法。
- 先写各模块的输入、输出和接口边界。
- 再写哪些部分可以用 AI 并发推进，哪些需要主代理统筹。
- 最后把发布前检查写成清单，包括构建、预览和域名。