Appearance
第 14 课：PR、CI/CD 与 AI 协作开发流程
第三章：产品开发协作 | 第 14 课
课前思考
前两课我们学了 Git 的基本操作和 Worktree 并行开发。但 Git 只是工具——真正的产品开发是一套流程：代码怎么写、谁审查、怎么测试、怎么上线。
在 AI 编程时代，这个流程多了一个新角色：AI Agent。它写代码、提交 PR、修 CI 报错——而你的角色从「催进度」变成了「审 PR 和做判断」。
本课带你走一遍完整的开发流程，从一行代码到上线，以及 PM 在每个环节的具体参与方式。
一、完整的开发流程概览
一个标准的功能开发流程（从 PM 提出需求到上线）：
PRD 评审通过
│
▼
开发（或 AI Agent）编码 ──→ git commit ──→ git push
│
▼
创建 Pull Request
│
▼
CI/CD 自动检查
（测试 · 代码风格 · 构建）
│
┌─────┴─────┐
▼ ▼
通过 失败
│ │
▼ ▼
Code Review 修复后重新推送
│
▼
合并到 main
│
▼
自动部署上线PM 在其中的四个关键介入点：
- PRD 评审通过后：确认 AI Agent 理解了需求（见第 5 课）
- PR 创建后：审查 AI 生成的代码是否符合产品意图
- CI/CD 失败时：判断是否需要调整需求还是纯技术问题
- 部署上线后：验证功能是否符合验收标准
二、Pull Request：代码的门禁
2.1 PR 是什么
PR（Pull Request）是「请求把你的代码合并到主分支」的正式流程。它不是技术操作，而是协作仪式——代码在进入主分支之前，必须经过审查。
2.2 一个标准的 PR 包含什么
PR 标题：feat: 新增笔记搜索功能
PR 描述：
## 做了什么
- 在首页添加搜索框，支持按书名和内容关键词搜索
- 搜索为实时过滤，无需按回车
- 无匹配结果时显示"未找到相关笔记"
## 关联需求
PRD: 阅记 v1.0 第 3.3 节「搜索功能」
## 测试方式
- 输入已存在的书名关键词，确认列表实时过滤
- 输入不存在的词，确认显示"未找到相关笔记"
- 清空搜索框，确认恢复完整列表
- 刷新页面后重新搜索，确认 localStorage 数据正确
## 截图
（附带搜索前后的对比截图）2.3 PM 如何审查 PR
你不一定需要看懂代码，但你需要检查：
| 检查维度 | 具体做法 |
|---|---|
| 功能完整性 | PR 描述中列出的功能点，是否覆盖了 PRD 的要求？ |
| 边缘情况 | 空输入、超长输入、特殊字符——PR 中有没有提到测试过？ |
| 用户体验 | 附带截图里的交互，和 PRD 中的交互描述一致吗？ |
| CI 状态 | 绿勾（通过）才能合并。红叉表示：测试挂了/代码冲突/构建失败 |
如果你用的是 AI Agent 提交的 PR，额外检查：
- AI 是否理解对了 PRD 的意图，而不是逐字照搬
- AI 是否在非相关区域做了不必要的修改（看 PR 的 Files Changed）
三、CI/CD：自动化的质量门
3.1 什么是 CI/CD
- CI（持续集成）：每次推送代码，自动运行测试、检查代码风格、构建项目。目的是：合并前发现问题。
- CD（持续部署）：代码合并到 main 后，自动部署到服务器。目的是：减少人工操作，加速上线。
3.2 CI 检查会做什么
一个典型的前端项目 CI 流程：
yaml
# 每次 git push 后自动执行
1. 安装依赖 npm install
2. 代码风格检查 eslint（检查格式规范）
3. 运行测试 npm test（单元测试 + 集成测试）
4. 构建项目 npm run build（确保能编译通过）四个步骤全部绿勾 → CI 通过 → 可以合并 PR。
任何一个红叉 → CI 失败 → 必须修复后重新推送。
3.3 PM 需要关注什么
| CI 状态 | 含义 | PM 该做什么 |
|---|---|---|
| 全部绿勾 | 代码通过了自动化检查 | 可以进入 Code Review |
| 测试挂了 | AI 生成的代码有逻辑问题 | 检查 PR 描述，看看哪个边缘情况没覆盖 |
| 构建失败 | 代码无法编译 | 通常是技术问题，通知开发或让 AI 修 |
| 代码冲突 | 和 main 分支有冲突 | 需要更新分支，重新解决冲突 |
四、AI Agent 参与的完整实战
以下是一段真实的产品开发流程：PM 用 Claude Code 或 Codex 驱动 AI 完成开发。
4.1 第一步：PM 写需求规范
在项目规范文件（CLAUDE.md 或 AGENTS.md）中更新需求：
markdown
## 新功能：搜索笔记
### 需求
在首页顶部添加搜索框，placeholder 为"搜索书名或关键词..."
### 交互
- 实时过滤，无需按回车
- 匹配范围：书名 + 笔记内容
- 无结果时显示"未找到相关笔记"
- 清空搜索框恢复完整列表
### 边界情况
- 搜索词为空 → 显示全部笔记
- 特殊字符（@#$%）→ 正常处理，不做特殊过滤
- 超长搜索词（100+ 字）→ 截断处理4.2 第二步：AI Agent 编码
PM 在 Claude Code 或 Codex 中输入：
根据 AGENTS.md 中「新功能：搜索笔记」的规范，实现搜索功能。
完成后提交代码并创建 PR。AI 会：
- 读取规范文件，理解需求
- 修改
index.html（添加搜索框）、app.js（添加搜索逻辑）、style.css（搜索框样式） - 自动
git add→git commit→git push - 自动创建 PR，标题和描述由 AI 根据 commit 信息生成
4.3 第三步：CI 自动运行
代码推送后，CI 自动触发。30 秒后：
✓ 代码风格检查 通过
✓ 单元测试 通过（12 tests passed）
✓ 构建 通过全部绿勾——可以进入 Review。
4.4 第四步：PM 审查 PR
你打开 PR 页面，看到：
- Files Changed：修改了 3 个文件，+45 行，-8 行
- 截图：AI 自动附上了搜索前后的对比截图
- 测试结果：12 个测试全部通过
审查要点：
- 截图里的交互是否符合 PRD？（搜索框位置、卡片过滤效果）
- 空搜索词、特殊字符的边缘情况是否处理了？
- Files Changed 中有没有不必要的改动？
审查通过 → 点击 Merge。
4.5 第五步：自动部署
合并到 main 后，CD 自动触发。两分钟后，新功能上线。
PM 打开线上地址，验证：
- 搜索框出现在预期位置
- 输入关键词能实时过滤
- 空搜索词恢复完整列表
- 无结果时显示提示文字
五、PM 与 AI Agent 的协作清单
每次从需求到上线，对照这张清单：
| 阶段 | PM 做什么 | AI Agent 做什么 |
|---|---|---|
| 需求定义 | 写规范文件（CLAUDE.md / AGENTS.md） | 读取规范，生成技术方案 |
| 开发 | 确认方案方向正确 | 编码 → git commit |
| PR | 审查 PR 描述、截图、Files Changed | 自动创建 PR、填写描述 |
| CI | 查看 CI 状态，红叉时判断是否产品问题 | 自动修复测试失败 |
| Review | 功能验收 + 体验验收 | 根据 Review 意见修改 |
| 上线 | 线上验证功能符合验收标准 | 自动部署 |
六、常见问题
Q1：AI 创建的 PR，描述不完整怎么办？
在项目规范文件中预设 PR 模板：
markdown
## PR 模板
每个 PR 必须包含：
1. 做了什么（3 行以内）
2. 关联的 PRD 章节
3. 如何测试（列出 3 个关键测试场景）AI Agent 会读取模板并按格式生成 PR 描述。
Q2：CI 失败，看不懂错误日志怎么办？
把错误日志贴给 AI Agent：
CI 构建失败了，日志如下：
[粘贴日志]
帮我分析原因，并用中文告诉我问题出在哪。AI 会翻译技术错误为人类可读的解释。
Q3：PR 有冲突（Conflict），PM 要处理吗？
不需要。 告诉 AI Agent：「这个 PR 和 main 有冲突，帮我 rebase 并解决」。AI 会自动处理。如果冲突涉及业务逻辑选择，AI 会问你以哪个版本为准。
本课实践
- 在你的阅记项目中，用 AI Agent 提交一个新功能的 PR
- 打开 PR 页面，审查 Files Changed 和描述
- 如果项目配置了 CI，观察自动化检查的运行过程
下一步
掌握了完整的 Git 协作流程之后，下一课我们学习 Claude Code——一个在终端中与 AI 协作的强大工具，让你可以直接用自然语言驱动整个开发流程。
课程讨论
有问题或想法？欢迎在下方留言讨论。