你的项目不是一次性的：vibe-vibe 迭代思维实战指南——从“做完“到“好用“

• 文档
• 教程
• Vibe Coding
• 示例工程

本篇指南基于 vibe-vibe 开源教程"5.4 再进化：项目的持续迭代与优化"第一节展开，核心回答一个问题：为什么做完第一版只是开始？你将理解"完成 ≠ 结束"的迭代逻辑、一次性作业心态与持续进化心态的本质区别，掌握"做 → 用 → 改 → 做"的迭代循环，并学会用第二章的"灵魂三问"为自己的待办清单项目找到下一步改进方向。文中所有原理都会落到本仓库demo-01-todo、demo-02-todo-auth的真实源码上，让你看到迭代思维在真实项目里留下的痕迹。

你可能有的困惑：为什么"完成"只是开始

"第四章做完的待办清单，已经能用了，还需要改吗？"

这个想法很正常。我们从小写作业，交了就完事了。但做工具不一样——好用的工具，都是用出来的，不是一次做出来的。

把"能用"当成终点，是典型的作业思维；而做产品的人都知道，第一版只是起点。教程 5.4 章的开篇说得更直接："第四章，你完成了待办清单的第一版。但这不是终点。真正好用的工具，都是在使用中不断改进出来的。"（见 5.4 章节导航）

在本仓库中，这个"第一版"的真实形态就存放在 demos/demo-01-todo 里——一个具备添加、删除、标记完成等基础 CRUD 能力的 Next.js 待办应用。它确实"能用"，但它并不是这个项目的终态。

看看那些你每天用的产品：没有产品是一步到位的

微信刚上线时是什么样子？

微信用了6年，从一个简单的聊天工具变成了一个超级平台。

淘宝最早就是一个简陋的网页，连图片都模糊。你现在用的"猜你喜欢"、"直播购物"，都是后来一点点加上去的。

没有哪个产品是一步到位的。你的待办清单也不需要。

一次性作业 vs 持续进化：两种心态的对照

第二种心态，是创造者的心态。

注意对照表中的差异并不在于"做得多不多"，而在于如何看待做完之后的阶段：前者把 bug 视为失败的证据，后者把 bug 视为改进的线索。心态一换，你的待办清单就从"作业"变成了"作品"。

迭代循环：做 → 用 → 改 → 做

┌─────────────┐ │ 做一版 │ └──────┬──────┘ │ ▼ ┌─────────────┐ │ 用一用 │ └──────┬──────┘ │ ▼ ┌─────────────┐ │ 发现问题 │ └──────┬──────┘ │ ▼ ┌─────────────┐ │ 改进它 │ └──────┬──────┘ │ └──────────────┐ │ ┌──────────────┘ │ ▼ (回到"做一版")

每转一圈，你的工具就好用一点。

这不是因为你第一次做得不好，而是有些问题只有用了才会发现。自己写代码时觉得"显而易见"的操作，真正用起来可能处处别扭；只有把版本交付给使用场景，问题才会浮出水面。教程 5.4 章把这个循环浓缩成了一句话："第一版完成 → 自己用用看 → 让朋友试试 → 收集反馈 → 改进 → 更好用"（见 5.4 章节导航），下一节 5.4.2 收集反馈 会专门讲如何拿到真实的反馈。

仓库实证：demo 项目就是"迭代"出来的

迭代思维不是抽象口号。打开本仓库的 demo 项目，你能在源码里直接看到"迭代"留下的痕迹——它们正是 5.4.3 节"功能扩展方向"里反复提到的那些功能。

表结构的演进痕迹

先看第一版 demo-01-todo 的表结构：

export const todos = pgTable('todos', { id: serial('id').primaryKey(), title: text('title').notNull(), completed: boolean('completed').default(false), category: text('category').default('inbox'), dueDate: timestamp('due_date'), order: integer('order').default(0), createdAt: timestamp('created_at').defaultNow(), })

从源码结构看，可以推断这张表不是"一次做出来的"：category（分类）、dueDate（截止日期）、order（排序权重）这些字段，恰好对应 5.4.3 节里列出的"任务分类标签"（⭐⭐）、"截止日期提醒"（⭐⭐⭐）、"任务排序"（⭐⭐⭐）等扩展方向（见 5.4.3 功能扩展）。也就是说，这些字段本身就是"做一版 → 用一用 → 发现问题 → 改进"循环的产物。

而 demo-02-todo-auth 的表结构 又往前走了一步：在待办表上新增了priority（优先级）、note（备注）和userId（归属用户），并把用户拆成user、session、account、verification四张认证相关表。这正是"持续进化"的直观案例——同一个待办清单，从单机个人工具（demo-01）进化为带用户系统的多用户应用（demo-02），每一轮迭代只解决一个问题。

功能组件：把"改进"落成代码

迭代改进最终要落成代码，仓库里处处可见对应实现：

• 分类筛选：CategoryFilter.tsx 定义了all / inbox / work / personal四个分类，用 URL 查询参数category与后端联动；
• 搜索功能：SearchInput.tsx 使用 300ms 防抖（useDebouncedCallback），搜索词存入全局状态（app-store.ts），在 page.tsx 中对标题做不区分大小写的实时筛选——"任务多了之后能快速找到"正是 5.4.3 节搜索功能的核心诉求；
• 截止日期高亮：TodoItem.tsx 用isToday/isPast区分"今天到期"、"已过期 · M月d日"两种状态并配不同颜色徽章——对应 5.4.3 节"过期任务标红、今天到期标黄"的设想；
• 拖拽排序：TodoItem.tsx 基于useSortable实现，排序结果通过 queries.ts 中的 useReorderTodos 提交到/api/todos/reorder；
• 服务端过滤：API 路由 支持按category和status（active/completed）组合查询。

测试：确保"改"不破坏"用"

迭代最怕的是新功能把旧功能改崩。仓库里的 todos.test.ts 正好演示了如何守住这条底线：测试覆盖GET /api/todos（含分类过滤）、POST /api/todos（正常创建、标题为空返回 400、缺字段返回 400）。这印证了 5.4.3 节测试检查清单的第一条——"原有功能（添加、删除、完成任务）仍然正常"。输入校验则由 validation.ts 中的 zod schema 兜底（标题 1~200 字、分类枚举、可选截止日期）。

体验层的"微迭代"

迭代不只发生在功能层面，也发生在体验层面。queries.ts 中新增待办的onMutate乐观更新（先本地立即显示新项，失败再回滚），以及 page.tsx 中进度达到 100% 时触发 confetti 彩带动画，都是"用起来觉得不顺手 → 改进"的典型产物。这类细节无法在设计阶段一次想全，只能靠真实使用来暴露。

回顾灵魂三问：你的改进方向

还记得第二章的"灵魂三问"吗？（见 2.5 灵魂拷问）

• 用户是谁？→ 谁在用你的待办清单？你自己？家人？室友？
• 痛点在哪？→ 用了一段时间后，什么地方让你不爽？
• 为什么选你？→ 和手机自带的备忘录比，你的有什么特别之处？

这三个问题，在迭代阶段同样有用。

当你不知道下一步该改什么时，问自己：

• 我用的时候，哪一步最麻烦？
• 我希望它能做什么，但目前做不到？

这些答案，就是你的迭代方向。

仓库源码也印证了这套方法论的价值：demo-01 的分类设计成收件箱 / 工作 / 个人三个固定枚举（validation.ts），而不是随意的一堆标签，正是回答了"用户是谁"之后做出的取舍；5.4.2 节还会提醒你，面对相互矛盾的需求时，要"回到第二章的灵魂三问：你的工具到底是给谁用的？优先满足核心用户的需求"（见 5.4.2 收集反馈）。

本节要点

• 完成第一版只是开始，不是终点
• 好的工具都是在使用中慢慢进化出来的
• 每次改进只需要解决一个问题
• 第二章的灵魂三问，可以帮你找到改进方向

::: tip 一个好的心态 不要想着"一次做到完美"。

做出来 → 用起来 → 发现问题 → 改进它。

这就是创造者的日常。 :::

接下来做什么

迭代方向明确后，就该动手收集反馈、扩展功能、优化代码、整理作品了。教程按这个顺序安排了后续四节，你可以顺次深入：

• 5.4.2 收集反馈：让使用者告诉你——三种零门槛的反馈收集方法与记录模板；
• 5.4.3 功能扩展：让 AI 帮你添加新功能——用 S.C.A.F.F. 框架写功能扩展 Prompt，本文谈到的分类、搜索、深色模式、截止日期都有现成模板；
• 5.4.4 代码优化：让 AI 帮你改进代码质量——功能稳定后再优化的 5 类优化方向；
• 5.4.5 从项目到作品集——把迭代成果整理成可展示的 README 与作品。

动手迭代前，别忘了先做版本提交——这正是 5.4.3 节强调的"黄金法则"：每次改动前先 Commit，改崩了才能随时恢复（版本管理的入门见 5.1 版本控制）。你的待办清单，将从"能用"，一步步变成"好用"、"可展示"。

• 文档
• 教程
• Vibe Coding
• 示例工程