用 Claude Code 从零做一个小产品：这个网站就是这么来的

你现在看的这个网站，从第一行代码到上线前的样子，都是 Claude Code 写的。我做的事情只有三件：说清楚要什么、拍板选方案、验收挑毛病。

这篇把过程原样讲一遍，你做自己的小产品可以直接照搬。

第一步：用一句话说清楚要什么

我最开始的需求就一句：

做一个 AI 个人站，展示我的产品、AI 教程、我每天用 AI 产出的内容，还有每天的 AI 热点。

这句话够用，是因为它讲清了给谁看（关注 AI 的人）和有哪几块（四个栏目）。技术怎么选、页面长什么样，交给 AI 提方案，不用你懂。

新手最容易犯的错，是一上来就说「帮我用 React 做」。不懂技术就别指定技术，说清楚目的就行。

第二步：先定设计，再动手

AI 写代码很快，返工也快，但方向错了再快也白搭。所以我要求它先出设计稿，不急着写页面。

它给了两个方向：A 是作品优先，首页先看到我做的东西；B 是资讯优先，首页先看热点。我最后选了首页用 A、热点页用 B。这个决定只有我能做，因为它取决于我想让别人怎么认识我。

同样的思路用在了品牌上：先定颜色（深海军蓝加荧光绿）、字体、Logo，写成一份设计规范，之后所有页面、封面都照着它来。

第三步：让它动手，但要看得到结果

说「做好了」不算数，要看到能打开的东西。每做完一块，我都让它给我一个预览链接，手机和电脑各看一遍。

发现问题就直接说现象，不用说原因。比如：

• 「手机上顶部导航和正文重叠了」
• 「这个 Logo 光标被拉得太细了，不是我过审的那版」
• 「前端不要显示评分构成」

AI 会自己去找原因、改好，再给我看。

第四步：碰到限制，换条路而不是卡住

过程中碰到过几次走不通的地方：

• 没有 Anthropic 的 API Key：热点打分改用火山方舟的豆包模型，接口是兼容的，改个地址就行
• 热点站的数据不能直接用：人家的条款不允许转载，那就自己去采原始信源
• 自制字体改了好几轮还是不满意：直接换成免费商用的钉钉进步体

这些都是「目标不变，换个办法」。你要做的是告诉 AI 哪条路不能走，它会去找别的路。

第五步：把决定记下来

做到后面，前面定过的规矩很容易被忘掉。我的做法是让 AI 把每个拍板的决定写进项目记忆：Logo 只用哪一版、专属字体只用于标题、分数不在前端显示……下次再改东西，它会先看这些规矩。

总结

不会写代码不是问题，说不清楚要什么、不肯验收才是问题。