[{"data":1,"prerenderedAt":156},["ShallowReactive",2],{"\u002F2026\u002Fvibecoding-01":3,"surround-\u002F2026\u002Fvibecoding-01":147},{"id":4,"title":5,"body":6,"categories":124,"date":126,"description":12,"draft":127,"extension":128,"image":129,"meta":130,"navigation":132,"path":133,"permalink":129,"published":129,"readingTime":134,"recommend":129,"references":129,"seo":139,"sitemap":140,"stem":141,"tags":142,"type":145,"updated":126,"__hash__":146},"content\u002Fposts\u002F2026\u002Fvibecoding-01.md","Vibe Coding series の 01",{"type":7,"value":8,"toc":120},"minimark",[9,13,16,24,27,30,43,54,59,64,102,109],[10,11,12],"p",{},"vibe  coding盛行时代",[10,14,15],{},"几乎过几周几个月甚至几天就有新的spec，新的model，新的编程ide工具 让人应接不暇",[10,17,18,19,23],{},"对于实时热点，个人一般是先持观望态度，等时间沉淀，结合市面上已有的实践经验以及较好的效果反馈才会去慢慢上手尝试，",[20,21,22],"del",{},"当然不排除有懒得成分"," ，最近的openclaw就挺火的来着，在公司也加了养虾群，不过感觉就我本人来说似乎还没有什么用处",[10,25,26],{},"以下为个人最近实操vibe coding的一些心得，其实很多都是浅谈，vibe coding除了提前规范，个人基础知识能力 还有就是时间上的耗费了",[10,28,29],{},"即使是vibecoding，我们也循项目基本的流程走 ： 需求确立 - 评审 - 系统设计分析 - 开发 - 联调 - 测试 - 回归验收",[31,32,33],"ul",{},[34,35,36,37],"li",{},"原型 ui\u002Fux 设计 ->  ",[38,39,40],"a",{"href":40,"rel":41},"https:\u002F\u002Fstitch.withgoogle.com\u002F",[42],"nofollow",[44,45,46,49],"blockquote",{},[10,47,48],{},"ai快速生成搭建原型界面，可导出以下格式",[50,51],"pic",{"caption":52,"src":53},"stitch export setting","\u002Fimg\u002F2026\u002F1773580559764.png",[31,55,56],{},[34,57,58],{},"检索信息-> grok",[44,60,61],{},[10,62,63],{},"个人很喜欢用grok来当日常搜索，环境配置问题or简单热点问题都可以回答的很好。不过也不要无脑相信ai，结合官方文档以及搜索引擎 可能有更好的方法，再回丢给grok让它解释",[31,65,66,73,81],{},[34,67,68,69,72],{},"需求明确 -> Gemini\u002Fds ，虽然哈吉米在代码能力上可能比不过Claude,gpt最新高级模型，但是",[20,70,71],{},"当陪聊很不错","（bushi，输出内容很详细",[34,74,75,76,80],{},"系统分析设计：将基本需求确定下来作为 ",[77,78,79],"code",{"code":79},"prd.md","保存在workspace，plan模式 下基于已有的需求做整体框架设计分析以及补充。接下来就可以开始正式开发了。",[34,82,83,84],{},"开发：现将后端跑通，等后端单测以及集成测试跑通后再开发前端",[31,85,86,89],{},[34,87,88],{},"后端：参考现有的设计框架源码，like 若依，基本的权限校验 数据管理等。基本的框架还是要设计好，分各个模块专项负责",[34,90,91,92,97,98,101],{},"前端：结合前端热门agent ",[38,93,96],{"href":94,"rel":95},"https:\u002F\u002Fskills.sh\u002F",[42],"skills"," ",[77,99,100],{"code":100},"关键字：frontend"," 或者个人喜欢的设计风格（Claude官网 、Apple等）规约限制“ai模板味”",[10,103,104,105,108],{},"ide：vscode + 插件（",[77,106,107],{"code":107},"claude code for vscode , codex , copilot...","）或者官方ai ide\u002Fcli，调试切换到熟悉的ide即可（pycharm，idea等）",[44,110,111],{},[10,112,113,114,119],{},"闲言碎语：热点技术迭代很快，虽说倒也不必有热点就一股脑得扑上去，不过关注一些也不是一件坏事，就当新闻听听也行 -> ",[38,115,118],{"href":116,"rel":117},"https:\u002F\u002Fspace.bilibili.com\u002F285286947\u002F?spm_id_from=333.788.upinfo.detail.click",[42],"juya"," . 另外最重要的一点应该就是实践了吧，很多概念刚开始可能看得眼花缭乱，可以结合实际项目来使用，慢慢捋清思路和使用技巧，迭代转化为自己的知识库.",{"title":121,"searchDepth":122,"depth":122,"links":123},"",4,[],[125],"vibecoding","2026-03-14 21:06:00",false,"md",null,{"slots":131},{},true,"\u002F2026\u002Fvibecoding-01",{"text":135,"minutes":136,"time":137,"words":138},"4 min read",3.395,203700,679,{"title":5,"description":12},{"loc":133},"posts\u002F2026\u002Fvibecoding-01",[143,144],"ai","随笔","tech","y2QxKOMzBIN2ImsExyL_BvMu_BND3bKp1oZ5iMxPrnA",[148,152],{"date":149,"draft":127,"path":150,"title":151,"type":145},"2025-10-21 15:22:00","\u002F2025\u002Ftools","工具合集",{"date":153,"draft":127,"path":154,"title":155,"type":145},"2026-03-25 21:06:00","\u002F2026\u002Fvibecoding-02","Vibe Coding series の 02",1788727861019]