Vibe Coding 实践
尝试用 AI 辅助研发开发了两个项目,分享一下与 AI 结对编程的一些体验

当下氛围编程已经是势不可挡,作为 9 年的技术人,别无选择,只能拥抱变化。
最近利用空余时间,我尝试结合 TRAE 做了两个项目,一个单身活动线下配对小程序,另一个就是现在这个博客系统;全程一个人从梳理需求到设计,编码,上线; 这放在以前,我承认我一个人是做不来的;但是有了 AI 的加持,可为如虎添翼,进展非常顺利。
小程序: 原生框架 + 腾讯云函数
博客: nextjs + vditor + prisma + PostgreSQL + docker + nginx
接下来分享一下我的 vibe 心得:
选择合适的模型,合适的 IDE
IDE: Cursor 或者 TRAE model: auto 或者 Gemini,Claude;
这些基本都是看自己条件吧~
新项目先写技术方案
我会先根据自己之前做项目的经验写下一些我的设计方案prompt;
例如: 1,我希望的技术栈是 nextjs 实现 ssr,用第三方库实现 markdown 编辑文章。 数据层我希望走靠近node + Typescript 的方案; 2,我需要几个导航栏: 首页,项目,文章,作者,合作几个模块 3,要求支持主题色切换 4,前后端分离架构 5,前端尽量采用组件式开发 ...
请你基于以上要求,先写一份更加详细,可落地的技术方案,md 格式;
(等它写完,看一下它的方案,通常是会比自己写的更加具体把一些不需要的扩展点删掉,整理一下基本就可以~)
去找一些UI设计平台做一个设计图
请根据我提供的 UI 图 + 你列出来的技术方案,先实现一个技术框架;(为了控制质量,一步步来)
控制好影响范围
千万不要一口吃成一个胖子 控制好每次改动的影响范围 例如让它帮你实现 menu 导航;则预期它只会改到前端代码,不应该改到后端代码 结合 git,以及 IDE 工具,都可以很容易知道它改了什么地方
错了就打断它
如果你发现它已经偏离你预设的方向 你可以打断它的工作的
然后说明你的纠正方案,然后让它基于修正的方向改
这一点是可以放心的,因为大模型其实对语义的理解是非常强的;它能知道你的意图!
适当添加截图
多模态模型是能看懂图片的 一些不好描述的场景,修改点,其实可以通过增加截图,或者草图来给出编程方向
一些不清楚的领域,可以让让它给出分析
例如对个人博客项目,是 SSR 好还是 SSG 好;你帮我分析一下!
注意检查代码质量
人通常是不会做很多重复性编码的,但是 AI 不会,早期使用一些初级模型编码,它是会不断的复制粘贴代码,不管维护性的 所以,每次做完一个功能点,其实还是需要我们有 review 代码的能力; 看到一些冗余代码,劣质方案,可以要求它统一修改; 这就像堆积木,基础打牢,你才能盖起高楼!
改 bug 才是真正考验工程师能力的时候
在没 vibe code 之前,很多声音都说程序员会被替代了;我也有点慌了 但是经过 vibe code尝试之后,我觉有经验,能排查错误,能理解 AI 实现方案的工程师是不会被替代的,因为 AI 的代码,BUG 是真的不少! 这就好像,都提供了水泥,砖,还是会有人建得好有人建不好一样
相反,当个人能力被工具再次放大!那些真正努力的人,将再次获得优先分配权!
待探索的方向
1,prompt 优化 2,mcp 结合开发 3,agent 开发