我如何用 Codex 做一个能跑的小工具

用 Codex 写出一个页面并不难。难的是让这个页面真的完成产品闭环：需求完整、交互可用、手机端不崩，并且换一台电脑也能顺利启动。

第一步不是写 Prompt

我会先把需求压缩成一句可以验收的话：

用户输入一个正在思考的问题，点击按钮，得到七张结构稳定、可以复制的思考卡片。

这句话确定了第一版的核心输入、动作和输出。登录、历史记录、AI 自动回答都不在第一版里。

把“好看”翻译成设计约束

“做得像 AI 产品”不是一个可以直接执行的要求。我把它继续拆成：深色背景、卡片层级、克制的蓝紫色、轻微进入动画、移动端单列，以及清晰的按钮反馈。

当视觉要求变成约束，Codex 才更容易在不同页面保持一致。

让 AI 实现，也让它自证

实现完成不等于任务完成。我会要求它继续检查：

1. 依赖是否能安装；
2. 类型检查和构建是否通过；
3. 每个路由是否都能生成；
4. 空输入、示例填充、复制结果是否工作；
5. 项目里是否意外出现密钥或本机私人路径。

如果条件允许，我还会直接在浏览器里走一遍关键流程。产品里的很多错误不会出现在编译器里，比如提示不够明显、按钮在手机上太挤，或者生成后用户根本不知道页面发生了什么。

Codex 是实现搭档，不是需求替身

越具体的边界，越容易得到可靠的实现。AI 可以帮我快速探索写法、补全细节和执行检查，但“为什么做”“第一版做到哪里”“什么算完成”依然是产品判断。

Vibe Coding 最有价值的地方，不是不用理解代码，而是让产品判断可以更快地接受真实运行环境的检验。