Vibe Coding - 技术栈

什么是 Vibe Coding

Vibe Coding（氛围编程）由 OpenAI 联合创始人 Andrej Karpathy 在 2025 年 2 月提出。

核心理念：

复制代码

不写代码，只描述需求
AI 生成代码
你看一眼觉得差不多就行

"Vibe" = 感觉、氛围。意思是凭感觉编程，不再逐行写代码、逐行审查。

传统编程 vs Vibe Coding

	传统编程	Vibe Coding
编码方式	手写每一行代码	自然语言描述需求，AI 生成
核心技能	语法、算法、框架 API	描述需求的能力（提示词工程）
调试方式	看报错 → 改代码	把报错丢给 AI → AI 改
开发速度	取决于编码熟练度	取决于需求描述的清晰度
适合谁	专业开发者	任何人（产品经理、设计师、创业者）
代码理解	你写的，你都懂	你可能不完全理解 AI 写的代码

一个完整的 Vibe Coding 过程

以"做一个待办事项 Web 应用"为例：

传统方式

复制代码

1. 选技术栈（React? Vue? 后端用什么？）
2. 初始化项目（npm create vite@latest）
3. 写组件（TodoList.tsx、TodoItem.tsx）
4. 写样式（CSS / Tailwind）
5. 写状态管理（useState / Zustand）
6. 写 API 接口
7. 写数据库表结构
8. 联调测试
9. 部署

耗时：1-3 天

Vibe Coding 方式

复制代码

你：帮我做一个待办事项应用，要有添加、删除、标记完成功能，
    用 React + Tailwind，数据存 localStorage，界面要好看

AI：生成完整项目代码

你：加一个拖拽排序功能

AI：修改代码，添加拖拽

你：颜色太丑了，换成暗色主题

AI：修改样式

耗时：10-30 分钟

主流 Vibe Coding 工具

第一类：AI 代码编辑器（本地开发）

工具	特点	价格
Cursor	最火的 AI 编辑器，基于 VS Code 魔改，Agent 模式可以自主执行多步操作	免费版有限额，Pro $20/月
Windsurf	原 Codeium，主打 "Flow" 模式，AI 理解整个项目上下文	免费版可用，Pro $15/月
GitHub Copilot	微软出品，VS Code / JetBrains 插件，Agent 模式（2025年新增）	$10/月，学生免费
通义灵码	阿里出品，VS Code / JetBrains 插件，支持中文，国内可用	个人免费

第二类：浏览器端（零环境，打开就用）

工具	特点	适合场景
Bolt.new	浏览器里用自然语言生成全栈应用，可一键部署	快速原型、小项目
v0.dev	Vercel 出品，擅长生成前端 UI 组件	前端界面
Lovable（原 GPT Engineer）	自然语言生成完整 Web 应用，支持数据库	完整应用
Replit Agent	在线 IDE + AI Agent，自动搭建环境	教学、快速验证

第三类：终端/命令行

工具	特点
Claude Code	Anthropic 官方 CLI，终端里用自然语言操作代码、文件、Git
Aider	开源，终端 AI 编程助手，支持多种模型
Codex CLI	OpenAI 的命令行编程工具

各工具适用场景

复制代码

想做一个完整的 Web 应用（不想装环境）
  → Bolt.new / Lovable

想做前端 UI 组件
  → v0.dev

日常写代码、改代码（专业开发者）
  → Cursor / Windsurf / GitHub Copilot

在终端里操作项目（运维/后端）
  → Claude Code

国内网络、中文友好
  → 通义灵码

Vibe Coding 的正确姿势

1. 需求描述越清晰，结果越好

复制代码

❌ 差的描述：
"帮我做个网站"

✅ 好的描述：
"帮我做一个个人博客网站，要求：
  - 用 Next.js + Tailwind CSS
  - 首页展示文章列表，每篇显示标题、摘要、日期
  - 点击进入文章详情页，支持 Markdown 渲染
  - 暗色主题
  - 文章数据从 /posts 目录下的 .md 文件读取"

2. 迭代式开发

不要一次描述所有需求，分步走：

复制代码

第一步：先做出基本框架
  → 确认能跑

第二步：加功能
  → "加一个搜索功能"

第三步：调样式
  → "把卡片改成圆角，加阴影"

第四步：优化
  → "加载速度太慢，优化一下"

3. 出错了直接丢给 AI

复制代码

你：运行报错了
   [粘贴错误信息]

AI：修复代码

你：还是报错
   [粘贴新的错误信息]

AI：继续修复

4. 不要盲目信任

Vibe Coding 的风险：

复制代码

AI 生成的代码你可能不理解
  → 出了 bug 不知道怎么排查
  → 安全漏洞可能被忽略
  → 架构可能不合理

建议：

复制代码

原型 / Demo / 个人项目 → 大胆 Vibe
生产环境 / 企业项目 → 审查每一行代码

Vibe Coding 能做到什么程度

已经可以的

复制代码

✅ 前端页面和组件
✅ CRUD 后端 API
✅ 数据库表设计和查询
✅ 自动化脚本
✅ 简单的移动端应用
✅ 命令行工具
✅ 单元测试
✅ 配置文件（Docker、Nginx、CI/CD）

还做不好的

复制代码

❌ 复杂的分布式系统架构
❌ 高性能优化（并发、内存）
❌ 安全关键系统
❌ 大规模项目的长期维护
❌ 需要深度领域知识的算法

对开发者的影响

不会被取代，但会被改变

复制代码

以前值钱的：
  会写代码（语法、API 记忆力）

现在值钱的：
  知道要写什么（需求分析）
  知道写得对不对（代码审查）
  知道怎么组合（架构设计）
  知道出了问题怎么排查（调试能力）

新的技能要求

复制代码

1. 提示词工程 --- 把需求描述清楚的能力
2. 代码审查 --- 看懂 AI 写的代码，判断质量
3. 架构思维 --- AI 写细节，你把控全局
4. 工具选择 --- 知道什么场景用什么 AI 工具

阿里系 AI 编程工具

通义灵码（Tongyi Lingma）

阿里云出品的 AI 编程助手：

复制代码

功能：
  - 代码补全（写一半自动续写）
  - 自然语言生成代码
  - 代码解释
  - 单元测试生成
  - 代码优化建议

支持 IDE：
  - VS Code
  - JetBrains（IntelliJ IDEA、PyCharm 等）

支持语言：
  - Java、Python、JavaScript、TypeScript、Go、C++ 等

价格：
  - 个人版免费
  - 企业版付费

百炼平台

百炼是阿里的模型服务平台，不是编程工具：

复制代码

百炼 = 提供 API（Qwen 模型、向量检索、Agent 编排等）
通义灵码 = 编程工具（IDE 插件，用了百炼的模型能力）

关系：
  通义灵码底层调用的是百炼平台上的 Qwen 模型
  但用户使用通义灵码时不需要关心百炼

总结

复制代码

Vibe Coding = 用自然语言让 AI 写代码

不是某个软件
而是一种编程方式

工具只是载体：
  Cursor、Claude Code、Bolt.new、通义灵码...
  都是实现 Vibe Coding 的工具

本质变化：
  从"我来写代码" → "我来描述需求，AI 来写代码"