VibeCoding入门，两个AI工具从0做完整网站

不会写代码但想做自己的产品？我用两个AI工具从0搭了一个完整网站，带支付、带AI对话、能导出PDF，前后大概两天时间。

这个玩法叫 Vibe Coding——不是逐行敲代码，而是用自然语言告诉AI你要什么，它帮你生成、你来验收。

我的工具组合很简单，就两个：
Claude Code 负责前期——帮我梳理需求、写PRD、出UI设计稿
Codex 负责写代码——代码质量好，而且成本比Claude Code低不少

具体怎么跑的？拿我做的"妙集"作品集网站举例👇

第一步：把想法丢给Claude Code
一开始我就一句话："想做个在线作品集网站"。然后跟Claude Code聊，它会追问你：要什么功能？用户怎么用？有没有参考？几轮对话下来，模糊想法就变成了一份清晰的PRD。

第二步：让Claude Code出UI
我用了一个前端设计skill，直接描述"我要一个模版中心页面，左侧筛选右侧卡片网格"，它就能出HTML界面稿。不满意就继续说哪里改——调色、调间距、换布局，跟设计师沟通一样。

第三步：把PRD+设计稿丢给Codex写代码
Codex擅长按规格交付。我把需求文档和UI截图一起给它，它输出的代码结构清晰，基本能直接跑。遇到bug就截图丢回去，说"这里报错了"，它自己修。

蕞后部署上线，一个带AI对话、模版系统、会员支付的完整产品就跑起来了。

踩坑Tips：
1. 需求一定要拆细再给AI，一次塞太多它容易跑偏
2. 设计和代码分开做，效率远高于让一个工具全包
3. 遇到报错别自己硬看，截图丢给AI是蕞快的debug方式