非技术人的 Vibe Coding 实战：用自然语言让 Cursor 帮你搭内部工具

01 痛点钩子

很多产品或运营同学卡在同一个地方：你知道需求应该长什么样，但你无法把它快速变成可演示页面。每次都要排研发，验证周期又长又贵。

02 结果预告

读完这篇，你可以在 30 分钟内让 Cursor 生成一个可运行的内部工具初版（含表单、列表和筛选），并且知道怎么迭代成可交付版本。

03 工具简介

Vibe Coding 不是“不会代码也能写系统”的神话，而是用自然语言把需求拆成可执行任务。Cursor 在这里扮演“实现助手”，你扮演“业务导演”。

04 实战演示

先在 Cursor 里新建空项目，把下面 Prompt 贴进去执行。

你是资深全栈工程师，请为我生成一个“销售线索管理”内部工具 MVP，要求：
1) 技术栈：Next.js App Router + TypeScript + Tailwind
2) 页面：
   - 首页：关键指标卡（新增线索、跟进中、已签约）
   - 线索列表页：表格 + 搜索 + 按阶段筛选
   - 线索详情页：可编辑字段（公司、联系人、阶段、下次跟进时间）
3) 交互：
   - 所有筛选支持 URL 参数同步
   - 提供“新增线索”弹窗表单
   - 表单校验失败给出可读错误
4) 代码要求：
   - 目录结构清晰
   - 组件可复用
   - 提供 mock 数据
   - 最后输出“下一步可接入真实数据库”的改造步骤
请先输出实现计划，再分文件给代码。

你会得到一个可运行的业务骨架，然后再按业务规则追加字段，不要一开始就追求“完美架构”。

05 避坑提示

• 不要一次塞 20 个需求，先把单个流程跑通。
• Prompt 里必须给“页面 + 交互 + 数据字段”，否则结果会空泛。
• 每次改动后让 AI 输出“变更说明”，避免自己忘记上下文。

06 进阶拓展

下一篇建议直接衔接 Hermes Agent 落地销售线索调研流程，把“页面搭建”升级为“流程自动化”。