Phase 3: 开发

目标：掌握 AI 辅助开发的日常工作流——不是单个 Prompt，而是一整天的工作方式。

预计时间：1-1.5 小时

前置：Phase 2 的设计文档（数据模型、API、架构图）

工具：Claude Code（主力）、Cursor / Windsurf（备选 IDE）

为什么”开发”不只是让 AI 写代码

很多人以为 AI 开发 = “写一个 Prompt → 拿到代码 → 完事”。实际上，AI 辅助开发是一个持续对话的过程：

• 大功能要先让 AI 出计划，你审核后再分步实现
• AI 写完代码你要验证，不是直接用
• 遇到 Bug 要把上下文喂给 AI，不是只贴错误信息
• 代码审查要把检查清单喂给 AI，不是自己逐行看

核心模式：Plan → Code → Verify → Review → Repeat

AI 参与度

环节	你做	AI 做
项目初始化	审核目录结构	搭建脚手架
功能开发	描述需求 + 验证结果	写代码
调试	复现问题 + 判断方案	分析原因 + 提供修复
代码审查	最终决策	逐项检查
Git 操作	确认 commit/PR	写消息

---

3.1 项目初始化

方法论

第一步不是写功能，而是搭建项目骨架。把 Phase 2 的设计文档一次性喂给 AI，让它搭建完整的项目结构。

关键：设置好 CLAUDE.md。这个文件告诉 AI 你的项目规范，后续所有对话 AI 都会参考它。详见 AI 工具入门。

实操

Prompt：

请根据以下设计文档初始化项目。

## 技术栈
- 后端：Go + Gin + GORM + PostgreSQL
- 前端：React + Vite + Tailwind CSS
- 部署：Docker Compose

## 数据模型
[粘贴 Phase 2 的 Go struct]

## API 端点
[粘贴 Phase 2 的 API 列表]

## 请完成
1. 创建项目目录结构（分 server/ 和 web/ 两个子项目）
2. 后端：初始化 Go module，安装依赖，创建 main.go + 路由 + 数据库连接
3. 前端：用 Vite 创建 React 项目，安装 Tailwind CSS
4. 创建 docker-compose.yml（PostgreSQL）
5. 创建 CLAUDE.md，写明项目规范
6. 确保 `docker compose up -d && cd server && go run .` 能跑起来

检查点

初始化完成后验证：

• docker compose up -d 启动数据库成功
• cd server && go run . 启动后端成功
• cd web && npm run dev 启动前端成功
• 访问 http://localhost:5173 看到页面
• CLAUDE.md 文件存在且内容合理

---

3.2 功能开发工作流

方法论

功能开发不是一个 Prompt 解决的——按功能大小采用不同策略：

功能大小	策略	示例
大功能	先出计划 → 审核 → 分步实现	看板拖拽、用户认证
小功能	直接描述 → 实现 → 验证	添加一个筛选按钮
Bug 修复	贴错误 + 上下文 → 分析 → 修复	API 返回 500

实操：大功能开发（以”看板 CRUD”为例）

第 1 步：让 AI 出计划

我要实现项目管理工具的看板功能。请先出一个实现计划，不要直接写代码。

## 功能描述
- 用户可以创建项目
- 在项目中创建任务（标题、描述、分配人、截止日期、优先级）
- 任务在看板上按状态分列显示（待办/进行中/测试中/已完成）
- 可以更改任务状态（后续再做拖拽，先做按钮切换）

## 已有
- 数据模型已定义（Project, Task, User 等）
- API 端点已设计
- 前端项目已初始化

## 请输出
- 实现步骤（按什么顺序做？先后端还是先前端？）
- 每一步的大致内容
- 预计的文件变更列表

第 2 步：审核计划，然后逐步实现

计划确认。请开始第 1 步：实现后端的项目 CRUD API。

要求：
- 按照已设计的 API 端点实现
- 包含输入验证
- 包含错误处理（统一错误响应格式）
- 写完后告诉我怎么用 curl 测试

第 3 步：验证

AI 写完代码后，不是直接进入下一步——先验证：

# 编译检查
cd server && go build ./...

# 启动服务
go run .

# 用 curl 测试 API
curl -X POST http://localhost:8080/api/projects \
  -H "Content-Type: application/json" \
  -d '{"name": "测试项目", "description": "这是一个测试"}'

如果有问题，把错误信息完整贴给 AI：

API 返回了以下错误，请分析原因并修复：

[粘贴完整的错误信息，包括终端输出和 curl 响应]

工具对比

工具	最适合	优势	劣势
Claude Code (CLI)	后端开发、全栈项目	直接操作文件系统，能跑命令	没有 IDE 界面
Cursor (IDE)	前端开发、UI 调整	内嵌在编辑器中，所见即所得	上下文窗口较小
Windsurf (IDE)	类似 Cursor	Cascade 模式体验好	生态较新

实用建议：

• 后端 API + 数据库：用 Claude Code（能直接跑 go build、curl 验证）
• 前端页面 + 样式：用 Cursor（边改边看效果）
• 全栈调试：用 Claude Code（能同时看前后端日志）

Prompt 分级技巧

大功能 Prompt 要素：

## 功能描述（做什么）
## 已有代码/文件（上下文）
## 技术要求（怎么做）
## 验证方式（怎么测）

小功能 Prompt：

在看板页面的顶部添加一个"按优先级筛选"的下拉菜单。
选项：全部 / 高 / 中 / 低。
选择后过滤显示的任务卡片。

Bug 修复 Prompt：

[贴完整错误信息]
[贴相关代码片段]
[描述复现步骤]
请分析原因并修复。

---

3.3 调试工作流

方法论

AI 调试的三步法：

1. 复现：确保你能稳定复现问题（随机出现的 Bug 先找规律）
2. 定位：把完整的错误信息 + 上下文喂给 AI，让它分析可能原因
3. 修复：让 AI 提供修复方案，你验证后再采纳

关键：上下文越完整，AI 定位越准。

四个常见场景

场景 1：前端页面白屏

前端页面打开后白屏，浏览器控制台报以下错误：

[粘贴 Console 错误信息]

相关组件代码：
[粘贴组件代码]

请分析原因。

场景 2：API 返回 500

调用 POST /api/tasks 返回 500。

请求体：
[粘贴 JSON]

服务端日志：
[粘贴 Go 终端输出]

相关 handler 代码在 server/handlers/task.go。请分析原因并修复。

场景 3：数据库连接失败

启动服务报错：
[粘贴错误信息]

docker-compose.yml 配置：
[粘贴配置]

.env 文件：
[粘贴数据库连接字符串]

请检查连接配置是否正确。

场景 4：Docker 容器起不来

docker compose up 后容器不断重启。

docker compose logs 输出：
[粘贴日志]

Dockerfile 内容：
[粘贴内容]

请分析原因。

提示：调试时，能给 AI 的信息越多越好。“它报错了”远不如”它在执行 X 操作时报了 Y 错误，日志显示 Z”。

---

3.4 代码审查工作流

方法论

AI 写完代码后，让 AI 审查自己的代码——听起来矛盾，但实际很有效。原因是：

• AI 写代码时关注”实现功能”
• AI 审查代码时关注”潜在问题”
• 两个 Prompt 的目标不同，产出也不同

核心技巧：把 代码审查清单 作为 Prompt 的一部分喂给 AI。

实操

请审查以下代码，按这份检查清单逐项检查：

## 检查清单
1. 数据模型：索引是否完整？外键关系是否正确？
2. 并发安全：有没有竞态条件？事务边界对吗？
3. API：分页方式对吗？有限流吗？错误响应统一吗？
4. 输入验证：用户输入都验证了吗？SQL 注入风险？
5. 认证授权：需要登录的接口都检查了吗？权限校验对吗？

## 代码
[粘贴代码，或让 AI 直接读项目文件]

请对每一项给出"通过 ✅ / 需要修复 ⚠️ / 严重问题 🚨"的评级和说明。

审查频率建议

• 每完成一个大功能后审查一次
• 不需要每个小改动都审查
• 上线前做一次完整审查

---

3.5 Git 工作流

方法论

用 AI 帮你写 commit message 和 PR 描述，保持 Git 历史清晰。

实操

Commit Message：

用 Claude Code 的 /commit 命令，或者：

请查看当前的 git diff，写一个清晰的 commit message。

格式要求：
- 第一行：类型(范围): 简短描述（不超过 50 字符）
- 空行
- 详细说明（如有必要）

类型：feat / fix / refactor / docs / chore

PR 描述：

请基于这个分支的所有 commit 生成 PR 描述。

格式：
## 改了什么
-

## 为什么改
-

## 怎么测试
-

## 截图（如有 UI 变更）

---

常见陷阱

陷阱	症状	对策
不验证就继续	AI 写完代码直接做下一步，累积错误	每步完成后跑一遍验证命令
上下文丢失	对话太长，AI 忘了前面的设计	关键信息（数据模型、API 设计）放在 CLAUDE.md
一次做太多	一个 Prompt 让 AI 实现 5 个功能	大功能分步，每步一个 Prompt
只贴错误信息	”报错了帮我看看”	贴完整上下文：错误 + 代码 + 复现步骤
跳过审查	”AI 写的应该没问题”	至少在大功能完成后做一次审查

Mini Exercise

在 Phase 2 的设计基础上，用 AI 完成以下开发任务：

1. ✅ 初始化项目结构（3.1）
2. ✅ 实现项目 CRUD API + 前端页面（3.2，大功能流程）
3. ✅ 实现任务 CRUD + 看板视图（3.2，大功能流程）
4. ✅ 修复过程中遇到的一个 Bug（3.3）
5. ✅ 对看板功能做一次代码审查（3.4）

提示：开发过程中随时参考 配方手册 的决策速查表，遇到”该用什么方案”的问题直接查。