2天落地, 从 Excel 表格到家庭被子管理系统

2天时间,把家里的被子管理从 Execl 表格迁移为 Web 系统。
使用以AI对话驱动的 vibe coding自动完成95%的工作。​​

缘起

家里有十几条被子,从2018年开始用Excel管理。记录了名称、季节、尺寸、重量、存放位置、使用历史这些信息。用了好几年,一直够用。

转眼到了2025年,AI编程火了,网上到处是免费的 API key。

既然有免费的,那一定要使劲薅。我就开始试着把这个Excel表格改成 Web 应用。

第一版:2天做出来

周末打开VS Code,使用copoilt,把需求描述了一遍。用的是vibe coding方式,我说要什么,AI自动生成代码,测试,有问题再帮我改。

技术栈是AI建议的

  • Next.js做前端
  • Neon Serverless Postgres做数据库,Neon 的无服务器按需计费与自动休眠适合个人项目,读写量低时成本可忽略;后期可按连接池与分支策略优化体验。
  • Tailwind做样式
  • Vercel部署

核心功能2天完成

  • 登录
  • 被子列表的增删改查
  • 状态切换(在用/收纳/维护)
  • 从Excel导入数据
  • 导出备份

部署上线,界面干净,状态一目了然。比Excel体验好很多。

10月:Claude Code和Prisma问题

用了几次后,我偶然得到了Claude Code的试用账号,于是让Claude Code 审查一下我的项目,看看有啥好改进的。

Claude Code说这个APP直接写 SQL 不够”规范”。应该用 Prisma 做 ORM,那就做呗,于是让 AI 帮忙集成。

本地测试没问题,部署到 Vercel 后经常超时。Prisma 在 Serverless 环境下冷启动很慢,数据库连接不稳定。试了各种配置都没解决。

最后决定删掉 Prisma,回到直接写 SQL。删除后部署秒开,再也没超时过。

11月:功能扩展

系系统稳定运行了一段时间,我突然有了 Kiro 的账号,可以免费用 Claude Sonnet 4.5 了。有了这么高级的 model 当然要用起来,于是开始加新功能。新的 AI model 配合很顺畅:

  • 图片管理:给每条被子拍照,比 Excel 插入图片好太多
  • 使用追踪自动化:改状态就自动记录时间,不用手动填
  • UI 重构:用 Shadcn UI,支持网格和列表两种视图
  • 天气集成:显示温度,根据天气推荐被子
  • 数据统计:使用频率、长期未用提醒
  • 搜索过滤:按季节、位置、品牌等筛选
  • 国际化:中英文切换

AI debug 图片功能花了点时间,遇到显示、压缩、删除各种问题,来回改了十几次才稳定。不过也就是让 Kiro 在副屏上使劲跑,我负责加油就可以了。

12月:第二次简化

其实功能已经很完善了,可 Google 出了 Antigravity。免费的不能不用啊,于是让 Antigravity review 我的项目,给意见做优化。

Google 说项目里用了 tRPC 做类型安全,作为一个单用户家庭应用,太复杂了。

我无所谓。删就删。于是决定删掉 tRPC,改回 Next.js 原生 API Routes。

删除后构建时间从45秒降到28秒,代码也更简单了。

现在的状态

主要功能

  • 管理被子信息(替代Excel)
  • 照片记录(Excel做不到)
  • 使用时间自动追踪(Excel要手动填)
  • 数据统计可视化(Excel要自己算)
  • 手机随时查看(Excel在手机上很难用)

性能

  • 首屏加载0.8秒
  • Lighthouse 98分
  • Vercel上稳定运行

技术栈(最终版):

  • Next.js 15
  • Neon PostgreSQL直连(没用ORM)
  • Tailwind CSS 4
  • Shadcn UI

时间投入

到12月12日为止,实际操作时间不到4小时,都是零碎时间:周末描述需求,AI生成代码,测试反馈,AI修改。

Git显示500多次提交,但大部分是AI在调整代码。

两次删减的收获

第一次删Prisma:想让架构更”专业”,结果不适合Serverless环境。删掉后反而更快更稳。

第二次删tRPC:想要端到端类型安全,但对单用户应用太复杂。删掉后构建更快,代码更简单。

两次都是做减法,两次都带来了提升。

AI的作用

所有代码都是AI写的。我的工作是:

  • 描述需求
  • 纠正AI的理解错误
  • 黏贴错误代码
  • 决定加什么删什么
  • 判断什么时候够了

AI擅长生成代码,但不知道”刚刚好”在哪里。它建议加Prisma和tRPC时理由都很充分,但实际不合适。这些判断需要人来做。

项目地址

开源在GitHub:https://github.com/ohengcom/qms-app

演示地址: https://www.414080.xyz

留下评论

您的邮箱地址不会被公开。 必填项已用 * 标注