🐟 鱼蛋花费:为鱼蛋做的小账本和成长日志

当爸爸的感觉很奇妙。自从知道鱼蛋要来的那一刻起,就总想为她做点什么。

一开始只是在手机备忘录里记几笔——今天买了云柔巾花了多少钱,明天又添置了什么小物件。记着记着就觉得,光记账好像还不够,要是能把鱼蛋成长的点点滴滴也一起记录下来就好了。

于是就有了这个小项目:鱼蛋花费

为什么做这个?

其实市面上记账软件很多,写博客的平台也不少。但我想要的是一个只属于我们小家的地方——一边记录为鱼蛋花的每一分钱,一边写下她成长的小故事。不用太复杂,够用就好。

所以这个小站就两个核心功能:

📒 鱼蛋小账本

给鱼蛋买东西,经常是想起什么就买什么。如果每次都要打开APP,选分类,填金额,太麻烦了。

所以这个账本的设计理念就是:录入足够快,查看足够清楚

  • 支持简单的自然语言输入:说一句「午饭 35」就记好了一笔支出
  • 可以通过 Telegram Bot 直接发消息记账,带娃的时候手机掏出来就能记
  • 支持按分类、关键词筛选,想看看鱼蛋这个月奶粉花了多少钱,一搜就知道
  • 用 Supabase 存数据,安全又省心

现在给鱼蛋买东西,习惯性地就给机器人发一句:「奶粉 280」,几秒就记好了。

🌱 成长 Log

除了花钱,更想记下鱼蛋成长的每一步。

  • 直接用 Markdown 写,放在 content/blog/ 目录里
  • 支持代码高亮,以后说不定可以教鱼蛋写代码呢(笑)
  • 不用数据库,静态生成,部署维护都简单

想写的时候就写,不用特意登录什么后台。今天鱼蛋会笑了,明天学会翻身了,都可以记下来。等她长大了,再一起回头看,应该会很有意思。

🧱 技术栈

作为程序员爸爸,选了自己熟悉的技术:

  • 框架:Next.js 16 App Router
  • 语言:TypeScript
  • UI:Tailwind CSS 4 + Radix UI
  • 数据存储:Supabase PostgreSQL(只给账本用)
  • 内容:Markdown + react-markdown
  • Bot:Telegram Webhook

整体是个很轻量的项目,想加功能随时可以加。

一点感想

其实做这个项目的过程,也是在学习当爸爸的过程。

以前写代码总想着要做个大而全的东西,现在觉得,能解决一个小问题就好。能帮我好好记录鱼蛋的成长,能让以后有东西可回忆,这就够了。

未来可能还会加些功能:比如做个统计图表看看每个月花了多少钱,或者给博客加上草稿功能。但不急,慢慢来,和鱼蛋一起慢慢成长。


如果你也想搭一个类似的小站,可以去 GitHub 看看,代码都在那里。也欢迎提 Issue,一起交流育儿(和写代码)的心得。

鱼蛋,这是爸爸给你做的第一个小项目。欢迎你来到这个世界 ❤️