前序
第一课：小橙酱：第一课学员专用：如何写出优秀作业的完整指南
第二课：小橙酱：作业建议：先定位，再出发；先收敛，再发散。
第三课：小橙酱：第三课作业建议：从 Vibe Coding 到 AI 接入，一次把链路跑通
第四课：小橙酱：第四课作业建议：不做工具的奴隶，做解决问题的主人（4期第4课）
期中复盘：小橙酱：Vibe Coding 实战训练营通关手册：写在训练营进行一半时
在第四课，云舒老师把我们扔进了集成开发环境（IDE）和命令行（CLI）的真实代码世界，很多人可能还在环境配置的泥潭里挣扎。
到了第五课，我们稍微把头抬起来一点。这节课虽然讲义上看起来是在回顾“需求文档（PRD）”和“Vibe Coding”，但本质变了。
- •前几课我们是在学“招式”——怎么生成一个网页、怎么写一个脚本、怎么接一个 API 接口。
- •这节课我们是在学“内功”——如何使用本地运行的编程工具，像正常的产品开发一样，从零开始，有章法、有节奏地让一个产品“生长”出来。
在开始聊作业之前，我想先回应一下这两天在群里和私聊中感受到的焦虑，特别是送给“燕子”同学以及像她一样感到迷茫的你们。
一、写在作业前：给“燕子”们的碎碎念
昨晚和一个叫“燕子”的学员聊了很久。
她很焦虑，她说：“老师，我学完了第三课觉得没希望，上了第四课第五课想放弃。我找不到痛点，我觉得生活很平淡，我甚至不知道该做什么。”, 她觉得别人的痛点都很高大上，而自己只是在纠结“过年回不回家”、“哪天回家”这种琐事。
我想对所有像“燕子”一样的同学说：找不到商业痛点，不是你的错。
也许是因为生活磨平了你的棱角，让你习惯了忍受不便。
但请记住，Vibe Coding 的本质是赋予你一种“将想法变为现实的能力”。
如果你现在实在找不到一个惊天动地的商业痛点，那就请为了“练习技能”本身而做作业。
不要因为“没有好点子”就停下敲键盘的手。
哪怕是做一个“过年回家倒计时”网页，哪怕是做一个“今天吃什么”的随机选择器，只要是你亲手用本地开发工具（IDE/CLI）跑通的，它就有价值。
行动，是治疗焦虑的唯一良药。
二、Skills（技能）到底是什么？
上一课的作业我们提到了 Skill（技能），全称Agent Skills。这项定义和规范主要由开发Claude的人工智能公司Anthropic所制定，目前在业界形成了较为广泛的共识。这节课云舒老师在演示时也用到了 Skill 来辅助写需求文档。
Skill 是一种“产品用法”，而不是一种“黑科技新技术”。
不要把它想得太神圣。剥开洋葱你会发现，Skills 的底层没有任何新发明的技术：
- •它的大脑：依然是大语言模型（LLM）。
- •它的记忆：依然是把文本塞进上下文（Context）。
- •它的手脚：依然是标准的 API 等常见的接口调用。
它唯一的创新，就是一份《如何写说明书的说明书》。
所以，不使用Claude Code也是可以把Skills运行起来的。
并参考了云舒老师的思路云舒：写文章找配图太麻烦，于是我给自己捏了个配图助手Skills调了一版适合自己的配图助手，这篇文章的AI配图就是通过这个定制的Skills实现的
以前我们要写一大段提示词，还要自己配置环境。
现在，Anthropic 定义了一个标准（.md 文件 + YAML 头），告诉软件：“嘿，把这个流程封装好，下次用户点一下就能用。” 所以，理解 Skill，本质上是在理解如何把你的“经验”封装成一套“可执行的配置文件”。
关于Skill的用法探究，可以参阅2026年1月23日本期训练营的自习室分享【https://waytoagi.feishu.cn/minutes/obcnga2t91qc1x4jaj297fi7】，以及社区知识库相关内容。另外推荐阅读🥨小水：小白必看！10分钟搞定Claude Code + Skills 喂饭级教程（附详细文档）
三、作业策略：告别云端沙箱，拥抱本地开发
原始作业要求：第5课：和Al一起vibe coding做产品
本次作业还是分为初阶和进阶。
但无论哪一阶，这一课的核心区别在于工具的变化：
请尝试离开网页版的 Enter.pro/秒搭等Web IDE工具，开始使用本地集成开发环境（IDE，如 Cursor、Trae、Codex 等）来完成这次作业。
为什么？因为 Enter.pro 是“云端沙箱”，它保护了你，也限制了你。
第五课的核心是“做产品”，真正的产品需要文件管理、需要版本控制、需要更复杂的调试，这些在本地环境中才能获得完整体验。
初阶作业：确保你手里有一个AI生成的网页/网站
原始要求：完成自己个人主页的第一个版本开发（或给喜欢的明星、体育、文学等搭建一个网站）。
我的解读：
- •为什么是个人主页？因为这个需求最不需要“痛点”，每个人都有介绍自己的需求。但这只是一个靶子，你完全可以做任何网页类产品。
- •核心目标：这是为了兜底。如果你前四课一直没能完整跑通一个网页项目，或者一直在做 Python 脚本，那么这节课必须补上这一课。反之，如果你前四课本身就跑通过网页项目，那么建议你直接做高阶作业。
- •步骤参考：
- 在本地电脑中新建一个文件夹。
- 用 AI IDE/CLI 生成一个 HTML 网页。
- 能在浏览器里打开看到它。
- 尝试使用云舒老师演示的“先和AI沟通，用文本字符画出大概布局，再让 AI 写代码”的方法。这种方法能让你和 AI 在写代码前先对齐视觉结构。
进阶作业：像正式开发一样迭代产品
原始要求：完成 3 个版本主页的开发内容。
我的解读：为什么要做（至少） 3 个版本？
很多同学做作业是“一锤子买卖”，做出来就结束了。但真实的产品是“长”出来的，不是一次性“造”出来的。
通过迭代，你能体会到从简陋到完善的过程，以及如何管理代码的变化。
怎么做迭代？（这里假设一个场景下的步骤）
- •V1.0（骨架版/MVP）：参考课堂演示，先用 ASCII 字符图确认布局，生成一个最简陋但结构正确的页面。比如：只有左侧头像和右侧工具列表，数据是写死的，样式可能很丑。
- •V2.0（数据版/美化版）：把写死的数据变成动态的，或者大幅优化 UI 样式。比如：把那种“程序员风格”的丑陋界面，通过让 AI 参考某个设计风格（如赛博朋克风、极简风），改成一个现代化的网页。
- •V3.0（智能版/功能版）：这是高阶玩法的核心。试着在你的网页里集成一个 Skill，或者让你的网页能调用后端的某个能力。比如：加一个“AI 总结我的简历”按钮，或者“AI 推荐工具”的功能。
你要展示上述假设中的 V1 -> V2 -> V3 的进化过程，并用飞书写好作业笔记，这才是“做产品”的证据。
四、避坑指南与实战技巧
1.学会“组合拳”：发挥不同模型的特长
云舒老师在课上演示了一个非常真实的场景：Codex 的逻辑能力很强，但它的审美确实一般，写出来的网页像 90 年代的古董。
现象：如果你只用一个模型死磕，可能会发现逻辑对了但界面很丑，或者界面好看了逻辑又乱了。
解法：不要在一个模型里死磕所有问题。
- •用Codex或ChatGPT 模型去写后端逻辑、去处理复杂的代码结构，因为它们逻辑严密。
- •把写好的逻辑代码截图或者复制给Claude Code（或者 Cursor 里的 Claude 模型），对它说：“逻辑保留，请参考这个风格帮我优化 UI 样式”。
- •我们要学会像指挥官一样，把任务分发给最擅长那个领域的 AI 模型。
2.警惕“一步到位”的贪念
写需求文档（PRD）的时候，AI 会很热情地给你列出一大堆功能。
千万别全做！
云舒老师演示时，哪怕是做一个简单的个人主页，也分了 5 个阶段。
做作业时，请强制自己：一次只发一个指令，一次只改一个功能。
如果你让 AI “把这个网页做完，要好看，要有搜索，要有后台”，它也许会给你一坨跑不起来的代码，还浪费了不少积分。
请改成：
- •“先帮我生成左侧的个人信息卡片布局。”
- •“确认无误，现在在右侧增加一个工具列表容器。”
- •“现在给工具列表增加一个搜索框。”
3.Debug（调试）的心态：你不是修理工，你是导演
进入第五课，随着代码库不断扩展，版本迭代日益精进，报错几乎成了必经之路。当然，如果你是从零搭建一个极其简单的网页，或许能幸运地一次通过；但对于复杂的项目，遇到问题几乎是必然的。
当网页跑不通时：
❌错误做法：盯着代码看，试图理解哪一行错了（除非你是程序员），或者只会说“它坏了”。
✅正确做法（参考小橙酱：第三课作业建议：从 Vibe Coding 到 AI 接入，一次把链路跑通-第四部分-网站出了问题怎么办）
- 打开浏览器控制台（F12 -> Console）。
- 把红色的报错信息复制下来。
- 扔给 AI：“我遇到了这个报错，请分析原因，并告诉我怎么修改。”
4.更高级的做法：让 AI 在代码里“打日志”（console.log）。告诉 AI：“我不知道哪一步断了，请在关键步骤帮我加上 console.log，让我看到数据流到了哪里。”记住：Debug 不是你去找 Bug，而是你指挥 AI 去通过日志和报错信息定位 Bug。
五、最后检查
做完作业后，请对照这份清单进行一次“灵魂拷问”：
1.我是在“做产品”，还是在“堆功能”？
我的 V2 版本是为了解决 V1 的某个问题（如不好看、不好用），还是纯粹为了凑数加了个无用的按钮？
2.我有没有真正经历了“从想法到落地”的全过程？
如果整个过程非常丝滑，一次报错都没有，大概率是你做的东西太简单了，或者你只是在复制粘贴老师的代码。只有当你遇到了问题，并指挥 AI 解决了问题，知识才真正属于你。
3.如果要把这个网页发给面试官或朋友，我拿得出手吗？
这就是产品思维的底线——交付感。一个能跑通的丑网页，比一个永远停在脑子里的完美产品值钱得多。
各位同学，第五课是一个很好的练兵场。
它不是什么惊天动地的大新闻，而是把我们前几课学到的零散招式，整合成一套连贯的动作。不管你是类似“燕子”同学还是“大神”，请打开你的 IDE，建一个新的文件夹。
2026年1月22日 @爱思考的小橙酱
学员须知（小白基础答疑手册）
作业提交步骤指导：☎️AI训练营 - 学员须知（持续更新）
VibeCoding主文档：第四期：Vibe Coding实战训练营
AI训练营数据中心（含证书获取、找搭子）：🌈AI训练营第1课：第1课：大势不可逆，得势者必胜第2课：第2课：从 Website 开始构建一款应用产品第3课：第3课：与时俱进做出你的第一款 AI 应用第4课：第4课：AI编程下一站，走入代码的世界第5课:第5课：和Al一起vibe coding做产品第6课：第6课：把产品交付到真实世界——上线与发布第7课:第7课：一个工具产品是怎么做出来的第8课：第8课：Demo Day：AI开发完整流程复习课-你的数字化毕业展答疑汇总：Coding答疑汇总页面优秀笔记:优秀笔记分享自习室：自习室
⚠️@版权归WaytoAGI及课程讲师所有，未经许可不得传播售卖。如有侵权将依法追究法律责任。
@版权归WaytoAGI及课程讲师所有，未经许可不得传播售卖。如有侵权将依法追究法律责任。
此功能需登录或注册后使用