Vibe 编码实战指南：用 Claude 代码、光标和 Codex 快速构建全栈应用

这门课的名字里带着 "Vibe 编码"，但内容并不玄。它讨论的是一套具体的工程做法：把 Claude Code、Cursor、Codex 这三类工具放进同一个全栈项目的开发流程里，让它们在合适的环节各自出力——命令行里跑代理、编辑器里做补全和重构、需要批量生成或迁移时切到代码模型。资料以视频为主，配套一份说明文档，节奏偏演示驱动，适合边看边在本地起一个项目对照着敲。

技术栈覆盖了什么

从前端侧看，课程涉及的组合比较杂，不是单一框架的一条线走到底，而是把组件化 UI、状态管理、路由组织和构建工具串在一起讲，重点在于"怎么让工具理解你的目录结构"，而不是从语法开始教。后端部分出现了 Python 技术栈的痕迹，包括用 Pydantic 做数据校验、搭建带评估和可观测性的 AI 代理，这部分对做服务端接口和数据契约的开发者比较有参考价值。另外还拿出了一节讲 ComfyUI 作为本地后端的替代方案，说明作者有意把生成式能力落到可离线运行的架构里，而不是只调云端 API。

几个可以直接复用的模块

• 提示词的组织方式：正向提示和负面提示被单独拆出来讲，这套思路同样适用于代码生成场景——先说清约束和禁忌，再谈要产出什么，能明显减少返工。
• 代理的评估与观测：把 AI 代理当成一个有输入输出、需要度量质量的服务来对待，包含校验层和日志埋点，这部分结构可以搬到自己的项目里。
• 本地后端替代：不依赖外部服务跑通链路，对于需要反复调试、控制成本的开发场景更实用。
• 全栈脚手架的搭建顺序：从接口定义到前端消费，中间如何让工具保持上下文一致，是这门课反复演示的点。

项目结构上的取向

课程不是按"先学 HTML 再学框架"的教科书顺序排的，而是先立起一个能跑的应用骨架，再往里填功能。这种结构的代价是前期需要你自己补一些基础概念，好处是每一段代码都有明确的落点，不会出现学完一章不知道用在哪的情况。对于已经有基础、但想把 AI 工具真正接入日常开发流的人来说，这个取向更省时间。

怎么用这份资料

建议不要在纯观看模式下过一遍。比较有效的做法是：先按文档把环境和依赖跑通，然后挑一个自己熟悉的小型全栈需求，用同样的工具组合重做一次，遇到卡壳再回看对应段落。视频里演示的提示词和配置可以直接抄，但目录结构和命名最好换成自己的，否则很容易在后续扩展时被演示项目的假设限制住。这类资料的价值在于提供一个可对照的工程样本，而不是一套需要逐字复刻的标准答案。真正要带走的是工具分工的判断力和提示词的组织习惯，这两样东西换到别的技术栈里依然成立。