Vibecoding
实战营
用自然语言描述需求，让 AI 写出可以上线的代码。我们教的不是“让 AI 随便写”，而是有工程纪律的 AI 编程。
什么是 Vibecoding？
2025 年初，AI 研究者 Andrej Karpathy 提出 “Vibe Coding” 一词：用自然语言告诉 AI 想要什么，由 AI 生成代码。真正能交付的项目，靠的是下面这个循环被反复、严谨地执行。
描述
DESCRIBE
写清目标、功能、约束和验收标准
生成
GENERATE
AI 先给计划，确认后再写代码
运行
RUN
立刻运行，用真实操作验证结果
审查
REVIEW
读懂改动，让 AI 解释看不懂的部分
提交
COMMIT
可用就提交，随时能回到这一版
同一个需求，两种写法
第二周课堂练习的真实题目。切换看看，差别在哪里。
prompt.txt
帮我做一个记账网站。
常见结果：功能随机、技术栈复杂、刷新后数据丢失，改了三轮还不是想要的。
prompt.txt
角色：你是一名资深前端工程师。 目标：做一个个人记账网页，单页面，数据保存在浏览器本地。 功能： 1. 新增一笔收支：金额、分类（餐饮/交通/购物/其他）、日期、备注 2. 列表按日期倒序展示，每条可删除 3. 顶部显示本月收入、支出和结余 约束：只用 HTML、CSS 和原生 JavaScript，放在一个文件里；手机上也要能正常使用。 验收：刷新页面后数据不丢失；金额为空时不能提交，并给出提示。 先列出你的实现计划，等我确认后再写代码。
常见结果：一次生成即可运行，后续只需小幅调整样式。
工程师写法多做了五件事
指定角色让 AI 用专业标准要求自己，代码结构更规范。
功能可验证每一条都具体到字段和行为，做没做到一目了然。
限定技术约束防止 AI 引入你看不懂、装不上的框架。
写明验收标准边界情况提前说清楚，AI 不会漏掉。
先计划后执行方向错了在计划阶段纠正，成本最低。
6 周课程大纲
点开每一周，查看知识点、课堂实操和课后作业。
知识点
- 文件、文件夹与路径，电脑如何找到你的代码
- HTML、CSS、JavaScript 各管什么
- AI 编辑器的三种用法：对话、补全、智能体模式
课堂实操
用一句话生成个人主页，再通过 5 轮对话把它改到满意。
课后作业
给主页加上作品区和联系方式，截图提交。
知识点
- 需求三层拆解：页面、功能、数据
- 好提示词的五要素：角色、目标、功能、约束、验收
- 先计划后执行，以及什么时候该开新对话
课堂实操
把“做一个记账网站”拆成可执行的需求说明，并让 AI 按计划实现。
课后作业
为自己想做的小工具写一份需求说明，下节课互评。
知识点
- 表单与事件：用户点击之后发生了什么
- 数组与对象：数据在程序里长什么样
- localStorage 本地存储
课堂实操
做一个刷新后数据不丢失的记账本。
课后作业
增加按分类统计和按月筛选功能。
知识点
- 读报错的三个关键位置：错误类型、文件行号、调用栈
- 浏览器开发者工具：Console 与 Network
- Git 提交、对比与回滚
课堂实操
讲师在项目里埋好 5 个 bug，用 AI 加开发者工具逐个定位并修复。
课后作业
让 AI 逐段解释自己项目的代码，写一份审查笔记。
知识点
- 前端与后端的分工
- 接口 API 与 JSON 数据格式
- 用 Python 处理 Excel 与文件
课堂实操
写一个自动汇总多个 Excel 报表、生成图表的脚本。
课后作业
找一件工作或学习中重复做的事，把它自动化。
知识点
- 域名、服务器与静态托管
- 把代码推送到 GitHub 或 Gitee
- 怎样把作品讲清楚
课堂实操
把结课项目发布到公网，生成可分享的链接。
结课展示
5 分钟讲清楚：做了什么、怎么做的、学到了什么。