Normal view

There are new articles available, click to refresh the page.
Before yesterdayMain stream

用 Antigravity 开发的车辆管理工具 CarNote

By: Kaiyuan
5 February 2026 at 01:41
CarNote Bennar

这是一个功能完整的车辆记录管理系统,支持油耗、电耗追踪、保养管理、配件跟踪和数据分析。

项目托管和起因

代码在 GitHub,我自己也建了一个在线版,开始我是在 NAS 自用的,然后觉得要建个演示的,干脆就直接建一个完整的吧,然后就有了 https://carnote.boxks.com 。

我之前用的是微信里面,腾讯我的车中油耗工具,但是每次都要打开微信,点小程序,点更多才到油耗用具。一顿操作…猴年马月了,而且我也想要记录保养和配件等内容。现在有这个工具就点开然后马上就能添加能耗记录了。

开发过程

项目功能说明

因为之前用 Cursor 和 Kiro 做过几个小工具,所以知道这类工具开发大致是怎么回事,这次我先给项目写了一份描述文档

开发

然后给 Antigravity 使用 Planning 模式开始,他会根据要求生成他理解的文档,拆分多个开发步骤。然后我看一下,没啥问题就叫他开始开发,然后 Antigravity 自动给我在文件夹中建立对应文件夹不停的在敲代码,大概有半小时吧,一个能跑的程序就出来了,但是他分开前后端的,作为懒人,我直接叫他给我一个在 WSL 一键启动的脚本。这样第一版就完成了,当然,第一版是有很多依赖什么的没有成功跑起来的,然后出什么提示直接丢给 Antigravity 等他自己看和修复。第一版是 Antigravity 自己根据理解做的,排版什么的我都不是很满意,我直接就把 PrimeVue 首页的例子截图丢给他,之后就出了现在的版面了。因为成现在的界面我才建立 git 仓库,所以已经看不到最开始 AI 自己生成的界面了。

很多细节为因为我没有详细的描述,也没有画原型图,所以都是 Antigravity 根据自己理解做的,所以前期针对前端的细节改了很多,甚至改到周额度用完了,我就等了几天继续改。做了两周的晚上,初版能用的做好了。我自己在 NAS 上跑起来了。

后来想着,既然发布到 GitHub 上了,怎么也得给别人看看成品是怎样的把,这时候,我就想到,我直接搭建一个大家直接用的算了,而服务器的费用,我就想到了,弄会员把,这样我就能赚点服务器的钱了。然后问了一下 OpenAI 国内个人开发者怎么收钱,他给的方案就是爱发电淘宝,然后我登录爱发电看看详细的设置,然后又注册了淘宝店铺,看看虚拟序列号后台没有自动发卡,需要手动发卡,需要找其他办法,还是爱发电方便点。

会员设置

开源版没有任何功能限制,我建好的 https://carnote.boxks.com 则普通用户可以管理两台车,进阶会员 ¥30/年,可以管理5台车,专业会员 ¥200/年,可以无限制增加车辆,首页的数据展示可以同时多辆车对比数据,也可以自定义时间段数据进行对比。

这样设置的理由是,普通用户两台车是正常的了,而你有超过2台车需要管理,这一年30块也是意思意思给个服务器的费用,超过5台车,那就更不用说了吧。

快速部署

# CarNote Docker Compose 配置
# 包含后端 API 服务和可选的 PostgreSQL 数据库

version: '3.8'

services:
  # 主应用服务 (包含前后端)
  app:
    image: kaiyuan/carnote:latest
    build:
      context: .
      dockerfile: Dockerfile
    container_name: carnote
    ports:
      - "53300:53300"
    environment:
      - NODE_ENV=production
      - PORT=53300
      - DB_TYPE=sqlite
      - SQLITE_PATH=/app/data/carnote.db
      # - DB_TYPE=postgresql
      # - PG_HOST=172.20.0.1
      # - PG_PORT=5432
      # - PG_DATABASE=carnote
      # - PG_USER=carnote
      # - PG_PASSWORD=postgresqlPassword
      - UPLOAD_PATH=/app/uploads
      # JWT 密钥
      - JWT_SECRET=${JWT_SECRET}
      # 跨域资源共享
      - CORS_ORIGIN=http://localhost
      # SMTP 配置 (可选)
      # - SMTP_HOST=smtp.example.com
      # - SMTP_PORT=465
      # - SMTP_USER=user@example.com
      # - SMTP_PASS=password
      # - SMTP_SECURE=true
      # - SMTP_FROM=CarNote <noreply@example.com>
    volumes:
      # SQList 数据库目录及数据库备份目录
      - ${carnote_data}:/app/data
      # 上传文件目录
      - ${carnote_uploads}:/app/uploads
    restart: unless-stopped
    healthcheck:
      test: [ "CMD", "node", "-e", "require('http').get('http://localhost:53300/health', (r) => {process.exit(r.statusCode === 200 ? 0 : 1)})" ]
      interval: 30s
      timeout: 3s
      retries: 3
      start_period: 10s
    networks:
      - carnote-network
  # 数据卷
volumes:
  carnote_data:
    driver: local
  carnote_uploads:
    driver: local
  # postgres_data:
  #   driver: local

  # 网络
networks:
  carnote-network:
    driver: bridge

Vibe Code 经验

用过几个 AI 编程相关的 Vibe Code 软件,叫 AI 开发和平时做其他事情一样,需要事情将自己想要的东西结构并编写一份清晰的文档,这份文档越详细越细致越好,再有就是能画出 UI 的原型图更好,Google Stitch 能直接生成整套前端 UI,当然还是得是要有清晰的描述,所以可以的画还是用 Figma 自己画好,然后放到项目文档中让 AI 自己依照原型图开发。


❌
❌