vibecoding实战篇1--todo待办
最近用 Vibe Coding 做完并上线了自己的第一个项目：一个 Todo 待办工具。
做这个项目的原因也很简单。平时工作的时候，我经常会在电脑记事本里写下今天要做的事情。但问题是，记下来了不代表真的会去看。如果不主动打开记事本，很多事情还是容易忘。
所以我就想做一个更适合自己使用习惯的 Todo 工具，能记录每天要做的事，也能通过提醒功能及时提示自己。
这个项目主要使用 Codex 和 Gemini 辅助完成。Codex 主要负责需求分析、技术选型，以及 MVP 版本的代码编写；Gemini 则更多用在后续优化需求、修改 bug 和调整细节上。
目前项目已经支持注册登录、待办管理、优先级、状态、截止时间、分类标签、看板视图、日历视图、归档和提醒功能，也做了移动端适配。
这不是什么很复杂的项目，但对我来说挺有意义。它是我第一次把一个想法从 0 到 1 做成了可以真实访问和使用的小产品。
项目地址：http://todo.honghuaijie.online/
欢迎大家试用，也欢迎提建议。
我个人的开发流程是这样的，首先选了一些我比较熟悉的技术栈
- 前端：Vue 3 + TypeScript + Vite + Ant Design Vue + Pinia + Vue Router + Axios
- 后端：Go + Kratos + GORM + MySQL
给codex和gemini 都配置了superpowers 和 planning-with-files 以及 ui-ux-pro-max-skill
1、我先自己写了一版 Todo 工具应该有哪些功能，然后交给 Codex，让它帮我整理成一份需求文档。后面我再根据自己的想法不断调整这份需求文档。 2、需求文档写好后，我让codex根据这个需求文档，以及我确认好的技术栈生成了一份技术架构文档 用于确定前后端的技术架构 3、然后我使用ui-ux-pro-max-skill 这个技能，让codex读需求文档和技术架构文档，让它生成了一份 ui设计文档 用于描述页面和组件如何呈现。 4、通过ai 给前端和后端各写了一份编码规范文档，用于约束 AI 在写代码时，必须遵守哪些规则，避免代码风格太乱。 5、让codex自己创建了两个agent代理，分别去写前端和后端代码。这部分我吓哭了，太消耗token了，写完之后直接给我plus套餐的的5小时额度光了。之前一直不太理解为什么别人token用这么快，现在理解了。 6、写完第一版之后，肯定会有很多问题，比如ai实现的跟我想的不一样，还会有不少bug。然后就是不断的改bug，优化功能，这部分主要是用gemini写的，因为codex额度用光了。 7、功能都开发完后，就把前端和后端代码都部署到容器里面，然后通过宝塔创建个站点，就把项目上线了。
