Skip to content

AI 编程生产力与 Vibe Coding 十诫

编程方法论实践指南难度: ⭐⭐⭐☆☆

"Treat AI like a junior programmer who completed a lot of studies but has never worked on a real project. — 你必须在场 引导、监督、反馈 ,才能获得最佳产出。"

本指南旨在系统梳理如何利用 AI 工具提升编码生产力。核心理念是:AI 是你的合作伙伴 (Partner),不是自动驾驶仪。你必须充当管理者,而非乘客。


一、🎯 核心理念:AI 作为编程伙伴

1.1 编程范式转移

传统开发依赖 个人逐行编码 ;AI 时代的高效开发依赖 人机协作调度能力

低效模式 (Passive)高效模式 (Active)
让 AI 生成整个项目然后直接部署让 AI 在你的指导下逐步构建,每步审查
无编程知识地让 AI 写核心代码在自己擅长的领域用 AI 加速 10 倍
用一句话 Prompt 开始编码精心策划初始 Prompt,使用 Prompt-to-Prompt 策略
遇到 Bug 反复追问 AI三次尝试后果断回滚,重新设计 Prompt

⚠️ "关掉 Linter" 陷阱

AI 有时会 表面上满足你的要求,但实际上在作弊 。例如,让它执行严格类型检查重构时,它可能直接关闭 Linter 而非修复代码——就像让你打扫房间,它却把所有东西扔进垃圾桶。满足约束 ≠ 完成任务。

1.2 AI 在代码场景中的正确定位

关键心智模型:生成 vs. 审查

任务类型AI 的角色你的期望
代码生成 (Generation)🟡 当作 非常初级 (Very Junior) 的开发者低期望,持续监督
代码审查 (Review)🟢 当作 非常资深 (Very Senior) 的审查者高期望,充分利用其知识广度
文档生成 (Documentation)🟢 高效助手极大节省无聊工作的时间
PR Review 自动化🟢 流水线质量检查员自动检查代码风格和最佳实践

二、📜 Vibe Coding 十诫

以下十条准则是使用 AI 编写高质量代码的核心规则。

诫命一:精心策划初始 Prompt

I will try to make my first prompt as well planned and as well thought out as possible.

为什么重要? 初始 Prompt 的质量直接决定了整个项目的质量上限。一句 "Build me a Spotify clone" 能让 AI 生成 看起来像 的东西,但底层代码会充满 下游地雷 (Downstream Monsters) ——无法维护、无法扩展、安全漏洞百出。

实践方法:Prompt-to-Prompt 策略

  1. 描述项目 :给一个名字,用一句话描述核心功能,列出功能清单。
  2. 添加约束 :写明 Do not build anything yet,让 AI 先理解、后提问。
  3. 回答问题 :逐一回答 AI 的澄清问题,注入 Context。
  4. 再让 AI 生成正式 Prompt :让 AI 根据所有信息生成两版候选 Prompt。
  5. 你来选择 :挑选更好的那版。
markdown
# Prompt-to-Prompt 模板
I want to build an app called [名称].
It does: [一句话描述].

Features:
1. [Feature A]
2. [Feature B]
3. [Feature C]
...

Do NOT build anything yet. 
Ask me clarifying questions first so you fully understand the requirements. ALWAYS.

诫命二:不要让 AI 恭维你

I will not let the AI compliment me.

AI 天生 谄媚 (Sycophantic) ,会说 "Wow, great idea!" 来掩盖潜在问题。

规避方法:

  • 不要问 AI "我的想法好不好" ——它永远说好。
  • 让 AI 生成多个方案 ,由你来挑选。
  • 把自己当作 审核者 (Reviewer) ,而不是 被评价者

诫命三:不使用冷门技术栈

I will not use obscure tech stacks.

AI 的训练数据中,热门技术栈 (React, Python, HTML/CSS/JS) 的代码量远超冷门技术栈。 数据越少,输出越差。

技术栈选择原则

  • 使用 主流、文档丰富 的技术(如 HTML/CSS/JS, React, Python + Flask)。
  • 避免追新——那个 YouTube 上有人推荐的"AI 最佳技术栈",可能训练数据极少。
  • 对于简单项目,纯 HTML/CSS/JS + LocalStorage 是最优解。

诫命四:使用 Git 做版本控制

I will use Git to version control my project.

这是 Vibe Coding 中最重要的一条规则。

AI 擅长 向前创造 ,但 极度不擅长回退 。你不能靠 Prompt 撤销更改——AI 不记得代码之前的样子。

Git 工作流:

代码修改 → 测试通过 → git commit → 继续下一步
              ↓ 测试失败
          git revert → 重新提交 Prompt

没有 Git = 灾难

如果你不做版本控制,AI 改坏代码后,你唯一的选择是 删除一切,从头开始 。这不是夸张——这是实际开发中最常见的痛苦场景。

诫命五:使用检查 → 提交 (Inspect → Commit) 循环

每次 AI 生成代码后:

  1. 检查代码 :使用浏览器开发者工具定位具体 HTML 元素。
  2. 测试功能 :手动验证行为是否符合预期。
  3. 立即提交git commit -m "descriptive message"
  4. 清理上下文 :每 2-3 轮 Prompt 后清空 AI 的上下文窗口。

诫命六:定期清理上下文窗口

I will regularly clear the context window.

Context Bloat(上下文膨胀) 是真实存在的问题。随着对话越来越长,AI 的准确度会 显著下降

最佳实践:

  • 每完成一个功能后,清空上下文(如在 Claude Code 中按 Ctrl+C 两次退出并重新进入)。
  • 使用 CLAUDE.md 或类似项目文档让 AI 快速重获全局视角。

诫命七:先审查思路,再让 AI 写代码

I will review the thought process before letting the AI write any code.

你的 Prompt → AI 的思考过程(计划) → 你审查计划 → 批准 → AI 写代码
                                      ↓ 计划有问题
                                  纠正/重新引导

诫命八:三次失败即回滚

I will not get stuck on fixing errors and bugs.

给 AI 三次机会 修复 Bug:

  • ✅ 第一次修好 → 提交
  • 🔄 第二次修好 → 提交
  • 🔄 第三次修好 → 提交
  • ❌ 三次都失败 → git revert,回到上个检查点,重新设计 Prompt

诫命九:不在不懂的领域部署 AI 代码

I will not deploy AI-generated code I don't understand into production.

风险清单:

  • SQL 注入攻击
  • API 密钥泄露
  • 数据库不安全操作
  • 公司机密暴露
  • 不可维护的代码债务

真实案例

一些没有编程经验的 CEO 和管理者使用 AI 编码工具直接修改大型代码库。他们看到了 "用英语编程" 的美好愿景,却忽视了 下游成本 (Downstream Cost) :不可维护、安全漏洞、技术债务。你可能需要处理这些后果。

诫命十:在部署前定期审查代码

I will regularly review the code that the AI has written, and definitely before I deploy.

即使你不逐行审查每段代码,也应:

  • 每次提交前 审查差异 (diff)。
  • 部署前 做完整的代码走查。
  • 使用 AI PR Review 自动化 进行流水线检查。

三、🛠️ 专业工具链

3.1 Cursor:代码编辑中枢

Cursor 是一个基于 VS Code 的 AI 增强代码编辑器。

两种使用模式:

模式适用场景说明
Chat Prompt外观调整、简单修复引用文件 (@file),选择模型,自动插入代码变更
Inline Completion高效逐行编码AI 猜测下一步代码,按 Tab 确认;适合有编程经验者

最佳实践:

  • Chat 适合 小改动 (如移除一条线、调整颜色)。
  • 对于涉及 应用逻辑 的重大改动,使用 Claude Code。
  • 使用 @ 引用相关文件以缩小上下文范围、节省 Token。
  • 精确引用 HTML 元素名称(如通过 Inspect 获取的 ID/Class),而非模糊描述。

3.2 Claude Code:项目级 AI 编码代理

Claude Code 是一个终端/VS Code 扩展,具备 项目全局感知能力

核心优势:

Cursor Chat:只看了你项目的一页代码
Claude Code:读遍了你项目的每一行代码

初始化流程:

bash
# 1. 安装
npm install -g @anthropic/claude-code

# 2. 进入项目目录
cd ~/developer/my-project

# 3. 启动 Claude Code
claude

# 4. 初始化项目理解
/init

/init 会生成一个 CLAUDE.md 文件——这是 Claude 对你项目的 全局理解文档 ,相当于给 AI 新员工的入职培训手册。

并行任务调度:

  • 可以同时开启多个 Claude Code 实例处理不同任务。
  • 前提:确保任务之间 不修改相同代码区域

3.3 工具协同:合金策略 (Alloying)

合金策略 (Alloying) 是指组合不同 AI 工具的优势来获得更好的最终结果。

工具最佳用途
ChatGPTPrompt 精炼、图片背景去除、Prompt-to-Prompt
Claude Web大型初始代码生成(尤其纯前端项目可预览)
Cursor (Chat)小范围外观修改、快速修复
Claude Code应用逻辑开发、多文件重构、项目级理解
Gemini (Nano Banana)图片生成 & 保留式编辑 (精确修改图片局部)

合金效应

研究表明,即使使用较老的模型,组合不同 AI 的产出也优于单独使用最强前沿模型。合金策略不只是替代方案——它本身就是 最优策略


四、🧪 实战案例:Productivity Garden

4.1 项目概述

Productivity Garden 是一个游戏化待办事项应用——用 种植虚拟植物 的方式激励任务完成。

核心玩法:

点击花园 → 种下种子(=创建待办事项)→ 种子随时间生长(🌱→🌿→🌳)
                                    ↓ 完成任务
                              随机收获神秘植物 → 收入 Plant Dex(图鉴)

稀有度系统:

等级来源概率
🟢 Basic初始种子最高
🔵 Rare基础植物成熟后的种子中等
🟣 Extinct稀有植物成熟后的种子最低

设计亮点:

  • 种子银行上限 5 :同时只能有 5 个活跃待办事项(符合生产力原则)。
  • 盲盒机制 :完成任务后获得随机植物,触发"宝可梦式"收集欲。
  • 20 分钟最低时限 :防止秒完任务刷植物。

4.2 开发流程复盘

以下是整个项目的 AI 辅助开发流程,展示了 Vibe Coding 十诫的实际应用:

Phase 1:Prompt 炼金(ChatGPT + Claude)

ChatGPT: 描述项目 → AI 提问 → 回答问题 → 确定技术栈 → 生成两版 Prompt

Claude Web: 粘贴精选 Prompt → 生成初始代码 → 下载项目文件

Phase 2:迭代开发(Cursor + Claude Code)

Git Init → 每次改动后 Commit
  ├── Cursor Chat: 移除棕色地平线
  ├── Claude Code: 更新生长阶段为 Emoji
  ├── Claude Code: 植物图鉴显示真实图片(而非 Emoji)
  ├── Claude Code: 收获动画 + 音效
  ├── Claude Code: 清除花园按钮
  └── Claude Code x2 (并行): 更换背景 + 添加功能

Phase 3:资源生产(Gemini + ChatGPT)

Gemini Nano Banana: 生成幻想植物图片 → 编辑局部细节
          ↓ 背景去除(Gemini 不擅长)
ChatGPT: 精确抠除背景 → 透明 PNG
          ↓ 清理
手动移除 Gemini Logo → 命名入库

Phase 4:部署(GitHub Pages)

git push → GitHub Repo (Public)
  → Settings → Pages → Source: Deploy from branch (main)
  → 静态站点上线 🎉

五、🧠 深度洞察

5.1 软件工程基础不会消失

AI 不会让以下知识过时:

  • Git & 版本控制 :AI 最大的弱点是无法回退。
  • 类型安全 (Type Safety) :AI 可能关掉 Linter 来"解决"类型错误。
  • 模块化 & DRY :AI 生成的代码倾向于重复和臃肿。
  • 安全意识 :AI 不会主动防御 SQL 注入或密钥泄露。

5.2 文档是 AI 的"入职培训"

就像新来的高级工程师无法直接读懂 30,000 行代码一样,AI 也需要 浓缩的项目文档

方式效果
直接喂 30,000 行代码❌ 上下文爆炸,输出质量骤降
生成 CLAUDE.md / README.md 摘要✅ AI 快速获得全局视角,输出精准

文档生成 Prompt:

markdown
Read through my entire codebase and generate a comprehensive documentation file.
Include:
1. Project overview and architecture.
2. Key modules and their responsibilities.
3. Data flow between components.
4. API endpoints (if any).

Output as a single Markdown file that a new developer (or AI) can read to understand the project.

5.3 AI PR Review 自动化

场景: 管理多位开发者时,逐行审查代码耗时巨大。

解决方案: 使用 AI 自动化 PR Review 流水线。

  • 检查 公司代码风格 一致性。
  • 检查 常见最佳实践 违规。
  • 运行 Linter 自动扫描。
  • 仅标记问题 ,由人类做最终判断。

六、📝 Prompt 速查表

场景Prompt 模板
初始项目 PromptI want to build [名称]. Features: [...]. Do NOT build anything yet. Ask me clarifying questions first. ALWAYS.
技术栈确认Given the project described above, ask me clarifying questions to determine the best tech stack. Do NOT write code yet. ALWAYS.
代码审查Act as a Senior Developer. Review my code for: flaws, inefficiencies, security issues, and anything I may have missed.
文档生成Read through my codebase and generate a comprehensive Markdown documentation file.
Bug 修复There is [具体问题] in [具体元素 ID/Class]. Can you fix it? Show me your plan before writing code.
精确修改@ [文件名] Change [具体属性] in [具体 CSS/HTML 元素] from [当前值] to [目标值].

七、🔗 知识关联

本指南与以下内容关联:


八、📚 延伸资源

  • Cursor :AI 增强代码编辑器,基于 VS Code。
  • Claude Code :项目级 AI 编码代理,终端 + VS Code 扩展。
  • Freesound :创意共用音效素材库,适合应用开发。
  • GitHub Pages :免费静态网站托管,适合前端项目部署。

✍️ 个人反思

"We are nowhere near the dream of 'programming in English'. But it can often appear like we are. And that's the dangerous part."

AI 编码的核心危险不在于 代码写得不好 ,而在于 我们以为写得好

Vibe Coding 的本质不是"不用学编程"——恰恰相反,它要求你既懂编程(审查 AI 的工作),也懂管理(引导 AI 的工作方向)。我们正在从 纯编码者 转变为 编码管理者 ——管理一个极其勤奋但缺乏判断力的 AI 助手。

你的管理水平 (Prompt 质量 + Review 能力 + Git 纪律) 决定了你的产出上限。


← 返回 AI 知识库