Vibe Coding：让文档成为代码生成的核心
在 Vibe Coding 的理念中，我们不再直接写代码，而是通过文档、设计稿与上下文，与智能 coding agent（如 Trae）协作完成产品开发。从 Chrome 插件到 Web 应用，代码只是结果，思考与结构才是关键。
一、低代码与 Coding Agent 的结合
-
产品实现方式
- 零代码、低代码
- Coding Agent（如 Trae）自动生成逻辑
-
开发者角色转变
- 不再是写代码的人
- 而是提供清晰上下文与意图的人
二、以 Chrome 扩展为例：Hulk 插件构想
-
参考案例：JsonView
- 把接口返回的 JSON 格式化展示，方便阅读。
-
Hulk 插件目标
- 点击图标 → 弹出窗口 → 一键改变网页背景色为绿色。
-
实现指令（instruction.txt）
- 使用 icons 文件夹中的图标
- 弹窗中显示提示文字与按钮
- 点击按钮后改变当前页面背景颜色为绿色。
三、Vibe 协作模式
与 Trae 的协作不依赖“指令式写代码”，而是基于清晰的语义环境：
-
核心要素
- 需求文档
- 技术文档
- 设计稿（如 UX 图）
- 接口与测试文档
-
Vibe Writing
- 把 Trae 不擅长的部分（模糊需求、缺乏上下文）由人来补足。
- 我们的任务：提供结构化、语义清晰的上下文。
- Trae 的任务：生成可运行的代码与实现。
四、Vibe 学习方式
- 编写需求文档 → 梳理线框图 → 搭建目录架构
- 在文档层面耐心打磨，逐步训练出“有 vibe”的合作方式。
结语
Vibe Coding 并非抛弃编程，而是重新定义“写代码”这件事：当代码成为文档的自然延伸，创作的核心就回到了思考与表达本身。