在这里插入图片描述

引言

在 AI 辅助编程快速发展的世界里,像 Anthropic 的 Claude Code 这样的工具正在改变开发者将创意转化为功能性产品的方式。在这个由 Avthar (@avthars) 制作并通过 X (推特) 分享的 34 分钟大师级教程中,他介绍了 PSB 系统——一种精简的“三阶段”方法,用于启动和执行 Claude Code 项目。PSB 代表 规划 (Plan)设置 (Setup)构建 (Build),旨在消除代码混乱、工作流低效和无休止重构等常见陷阱。

Avthar 借鉴了过去一年构建数十个项目的经验,强调前期适当的规划和配置可以让项目变得轻松 10 倍。这篇博文总结了视频的全部内容,详细拆解了每个阶段的步骤、技巧和示例。无论你是刚刚涉足 AI 编程的新手,还是寻求优化流程的资深开发者,本指南都将帮助你利用 Claude Code 高效地构建最小可行性产品 (MVP)。

如果你对 Claude Code还不熟悉,它是 Anthropic 推出的基于终端的 AI 编程助手,可以集成到你的代码库中,实现实时协作、自动化,并支持插件和子智能体 (sub-agents) 等高级功能。让我们深入了解 PSB 系统。

第一阶段:规划 (Plan) —— 为成功奠定基础

规划阶段的核心是在编写任何代码之前,让你的项目走上正轨。Avthar 强调,跳过这一步就像是在没有蓝图的情况下盖房子——虽然可能建成,但过程会非常混乱且低效。在这里哪怕只花 15 分钟,也能为你节省后续数小时甚至数天的时间。

问自己两个关键问题

拿起纸笔或打开一个简单的 Google 文档进行头脑风暴。回答以下两个关键问题:

  1. 你到底想要实现什么?
    通过理清项目的目标来决定优先级。你是在学习一项新技术、向用户验证一个想法、构建 Alpha 版本,还是在进行可行性原型设计?如果是原型设计,应专注于核心功能,忽略边缘情况的打磨。如果是面向用户的产品,则必须包含安全性、错误处理和易用性设计。
  2. 功能的里程碑是什么?
    将项目分解为不同阶段。定义 MVP (最小可行性产品) 为验证想法所需的绝对核心要素。然后规划第 2 版及以后的改进(如优化或附加功能)。明确每个里程碑中包含什么、包含什么。

此处的清晰度确保 Claude 构建的正是你想要的。目标模糊会导致 AI 进行无谓的假设和返工。

利用 AI 完善你的计划

尽早利用 AI 来充实想法:

  • 提示 AI 提问: 将你的头脑风暴分享给 Claude(或其他 AI,如 ChatGPT),并问它:“为了成功构建这个 MVP,我需要回答哪三个最重要的问题?”这能帮你发现盲点并完善思路。
  • 语音模式对话: 使用语音聊天来梳理想法、用户流程和功能。让 AI 将讨论总结为一个 Markdown 文件,作为项目的起点。

创建项目规格文档 (Project Spec Doc)

核心交付物是一份 项目规格文档,结合了产品和工程需求。根据你的目标调整其详细程度——原型设计可以简略,生产级项目则需深入。

产品需求

专注于 做什么 (What)为什么 (Why)

  • 目标用户和问题: 为谁而建?解决了什么问题?
  • 用户体验细节: 具体描述交互过程。例如,对于日记应用,需说明条目是空白开始还是带有提示,是否允许上传照片,或是否支持编辑。
  • 里程碑和范围: 确定功能的优先级。定义每个里程碑的“完成”标准,以避免范围蔓延。基于反馈进行迭代——先构建第 1 版,评估后再规划第 2 版。
工程需求

专注于 怎么做 (How)

  • 技术栈选择: 指定偏好以避免 AI 随机选择。Avthar 推荐的 Web 应用技术栈:
  • 前端: Vercel (托管), Next.js (框架), Tailwind (样式), Shadcn (组件)。
  • 后端/数据库: MongoDB 或 Supabase。
  • 认证/支付/邮件: Clerk, Stripe, Resend。
  • 存储/AI: Cloudflare R2, Anthropic 模型 (图像可配合 Google Gemini)。

如果不确定,可以要求 Claude 生成一份包含选项的研究报告。

  • 技术架构: 概述系统设计、组件、数据库模式和 API 结构。如果可能,委托给 Claude 设计,但为了团队一致性,最好有明确规定。提前配置好基础设施(如数据库、API 密钥)。

在规划结束时,你会拥有一份清晰、可执行的规格文档,能有效地指导 Claude。

第二阶段:设置 (Setup) —— 配置 Claude Code 以提升效率

有了计划后,配置 Claude Code 使其成为“调音完美的乐器”。Avthar 分享了一份七步清单,外加两个高级技巧。你不需要全部用到——挑选相关的即可。

第 1 步:设置 GitHub 仓库

  • 支持 Web/移动端访问,利用 GitHub CLI 查看历史/PR,以及轻松部署(如 Vercel 预览)。
  • 使用分支开发功能,保持主分支 (main) 的稳定性。
  • 支持基于 Issue 和多智能体的开发模式(稍后介绍)。

第 2 步:创建环境变量文件

  • 让 Claude 根据你的规格文档生成一个 .env 文件示例。
  • 填入 API 密钥和凭证,这样 Claude 就不会因为缺少这些而暂停。

第 3 步:创建 claude.md

  • 充当项目的“记忆”——始终保持在上下文中。
  • 保持简洁;链接到其他文件。
  • 包含内容:项目目标/架构、设计指南、约束条件(例如:禁止直接推送到 main 分支)、仓库礼仪、常用命令、测试规则。

第 4 步:设置自动化文档

  • 将文档分离以保持上下文清晰,并自动更新。

  • 核心文档:

  • architecture.md: 系统概览。

  • changelog.md: 演变历史。

  • project-status.md: 里程碑、进度、上次会话笔记。

  • 功能参考文档: 高层概览(如:用户引导、支付流程)。

  • 使用指令或斜杠命令 (slash commands) 来自动更新这些文档。

第 5 步:安装插件

  • 扩展命令、子智能体等功能。
  • 推荐插件:Anthropic Frontend (更好的 UI), Anthropic Feature Dev (简化功能开发), Every Compound Engineering (改进套件)。

第 6 步:设置 MCP (模型上下文协议服务器)

  • 集成外部工具。
  • 根据技术栈选择:数据库用 MongoDB/Supabase,前端测试用 Playwright/Puppeteer,部署用 Vercel,分析用 Mixpanel。

第 7 步:设置斜杠命令和子智能体 (Sub-Agents)

  • 斜杠命令: 快捷方式(如 /commit, /pr-commit,自定义文档更新命令)。
  • 子智能体: 专门的分支任务(如:规划、代码库搜索;自定义用于变更日志、前端测试、回顾的智能体)。
  • 子智能体允许在不共享上下文的情况下并行工作。

额外的高级技巧

  1. 预配置权限: 提前批准/阻止命令,避免过程中断。
  2. 钩子 (Hooks): 自动化脚本(如:测试检查、Slack 通知)。

这种设置确保 Claude 拥有快速构建所需的所有工具和上下文。

第三阶段:构建 (Build) —— 通过工作流执行并应用技巧

现在,开始编写代码。首先专注于你的 MVP,然后使用三种工作流迭代里程碑。

构建你的 MVP

  • 使用规格文档提示 Claude:“构建里程碑 1,尽可能使用并行子智能体。”
  • 使用 Plan Mode (计划模式) 以获得更好的结果——Claude 会拆解任务并提出问题。

工作流 1:通用模式 (适用于单一功能)

  • 研究 (Research): 可选的研究报告,用于技术决策。
  • 规划 (Plan): 使用计划模式进行分步拆解。
  • 实现 (Implement): 利用设置好的工具(插件、MCP)。
  • 测试 (Test): 自动运行测试。

工作流 2:基于 Issue 的模式

  • 将 GitHub Issues 作为真理来源 (Source of Truth)。
  • Claude 根据规格文档创建 Issues;并行处理这些 Issue(例如同时修复多个 Bug)。
  • 使用斜杠命令自动化流程。

工作流 3:多智能体模式 (高级)

  • 在 Git Work Trees (隔离分支) 上运行多个 Claude 实例。
  • 完成后合并——非常适合并行开发功能。
  • 需要一定的设置知识;对扩展规模非常有用。

生产力技巧

  1. 使用顶级模型: Opus 4.5 用于规划/复杂任务,Sonnet 用于代码实现,Haiku 用于简单任务。
  2. 迭代调整 claude.md: 通过斜杠命令更新;与提交 (commits) 同步。
  3. 防止回退: 使用 # 自动将指令合并到 claude.md 中。
  4. 勇于抛弃代码: 代码是廉价的——利用检查点 (checkpoints) / 回退 (rewind) 功能轻松恢复。

结论

PSB 系统将混乱随性的提示转变为构建 Claude Code 项目的结构化、高效流程。通过彻底的规划、明智的设置和经过验证的工作流进行构建,你将能更快地发布 MVP,并减少挫折感。

Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐