在线体验：
https://meowhouse.cc.cd
一键体验：打开登录页，点击「体验演示账号」按钮，无需注册即可体验全部功能
推荐浏览器：Chrome / Edge / Safari（移动端 Safari 也可，支持 PWA 添加到主屏）
0. 先和大家打个招呼 
大家好，我是一个普通的铲屎官，家里养了 4 只猫，平时还在小区参与流浪猫 TNR 救助。我完全没有编程背景——在做这个项目之前，我连"终端"是什么都不知道，HTML 具体长什么样都没见过，SQL只在电脑课的桌面上撇过一眼。
但我用 TRAE，在两周多的业余时间里，从零做出了一个完整的全栈 Web 应用：喵屋 Meow House。
我是怎么和 TRAE 配合的
一开始我只会说"我想做一个管猫的 App"，TRAE 帮我搭了首页；后来我发现功能越堆越多，导航乱了，我跟它吐槽"手机上找不到功能"，它帮我重新设计了信息架构；再后来我想做公网访问，它一步步教我用 Docker 部署到家里的 NAS、配置 Cloudflare Tunnel 做免费内网穿透、配 SSL 证书——全程我没有花一分钱，没有买服务器，没有买域名（用的 DNSHE 免费域名 + Cloudflare Tunnel）。
最让我震撼的两个瞬间：
第一个瞬间是做体验账号系统的时候。我跟 TRAE 说"用户要能不用注册就体验，但体验完数据要能清掉，不能互相影响"，它帮我设计了一套完整的 DEMO 账号方案：一键生成临时账号、自动灌入 20 只猫的演示数据、24 小时自动过期清理、登出即销毁——而且做了 IP 限流防止滥用，密码哈希故意设成无效格式防止二次登录。这些安全细节我完全想不到，它自己帮我想到了。
第二个瞬间是部署公网的时候。我以为要花几百块买服务器，TRAE 告诉我"你家里有 NAS，用 Docker + Cloudflare Tunnel 就能免费搞"。我连 SSH 是什么都不会，它一步步教我 SSH 登录 NAS、安装 Docker、写 docker-compose.yml、配置 cloudflared，最后成功用一个免费域名让全世界都能访问。
一个完全不会写代码的人，真的可以用 TRAE 做出一个完整产品，而且是可以给全世界人用上的。 这是我做这个项目最大的感受。
1. Demo 简介
喵屋（Meow House） 是一款面向多猫家庭和流浪猫救助者的全栈 Web 应用，帮助铲屎官系统化管理猫咪健康、物资库存、猫粮配方匹配、流浪猫救助、领养捐赠、家庭共享等全场景事务。
- 产品形态：全栈 Web 应用（Next.js 16 + React 19 + Prisma + SQLite），响应式设计，支持桌面端和移动端，支持 PWA 离线使用、亮色/暗色双主题
- 面向用户：多猫家庭铲屎官、新手养猫人群、社区流浪猫救助志愿者
- 部署方式：Docker 部署在个人飞牛 NAS 上，通过 Cloudflare Tunnel 免费内网穿透实现公网访问，零服务器成本、零域名成本
核心功能
① 一键体验账号系统
打开登录页，点击「 体验演示账号」，无需注册即可进入系统。系统会自动生成一个独立的临时账号，灌入 20 只猫、10 项库存、完整健康记录、喂养关系、TNR 记录、领养帖子、捐赠记录、自定义提醒等全套演示数据。体验结束登出后，所有数据自动清除，不影响其他人。24 小时未登出也会自动过期清理。
② 智能仪表盘 Dashboard
首页一眼掌握全局——4 张统计卡片（猫咪总数/健康记录/当月花费/待办提醒）、紧急提醒横幅（疫苗到期、库存不足、超期未称重、猫粮不匹配、纪念日、自定义提醒）、猫咪卡片横向滚动墙（每只猫显示头像+名字+迷你体重趋势）、库存预警摘要、近期时间线、快捷操作栏（记体重/喂药/出库一键直达）。支持亮色/暗色双主题切换，半透明猫爪图案背景。
③ 猫咪全生命周期管理
支持添加猫咪档案（品种/毛色/生日/绝育日期/芯片ID/所在地点/是否亲人等），每只猫有独立详情页——体重趋势折线图（Recharts）、健康记录时间线（体重/疫苗/驱虫/用药/异常/生活事件六类，自动计算下次到期日）、就诊记录（诊所/医生/诊断/费用/复查日期）、关系图谱（SVG 可视化母子/兄弟姐妹/闺蜜等双向关系，支持拖拽）、就医档案卡（打印友好，可直接带去宠物医院）。支持最多 4 只猫体重曲线对比。
④ 库存控制 + 猫粮智能匹配引擎（核心算法亮点）
按地点分组管理猫粮、猫砂、药品等物资。核心算法：根据喂养关系自动聚合每日消耗量，实时扣减库存并计算剩余可用天数；低于预警阈值时首页红色横幅提醒；开封后有氧化提醒。
最亮眼的是猫粮配方匹配引擎：扫码录入猫粮后，系统会根据每只猫的生命阶段（幼猫/成猫/老猫）、健康状况（肾脏问题/过敏等）、处方粮需求，自动评估当前喂养关系是否合理——OK（绿色，匹配）、WARN（黄色警告，如幼猫吃成猫粮）、BLOCKED（红色阻断，如肾病猫吃高磷粮）。配方库支持 T1-T4 四级可信度分级（官方数据 > 包装 OCR > 众包录入），审核后台有三图证据槽位。
⑤ 健康记录与数据报表
健康记录支持单条录入和批量录入（多猫同时记录），6种记录类型自动分类。报表页提供体重趋势图、费用统计看板（医疗/库存/捐赠按猫拆分）、时间范围筛选、CSV 导出。
⑥ 流浪猫救助与领养捐赠
管理流浪猫档案和 TNR（捕捉-绝育-放归）进度，支持领养帖子发布、捐赠记录公示，提升民间救助透明度。流浪猫和家猫使用统一数据模型（origin 字段区分 home/stray/fostered/adopted），方便流浪到领养到家养的状态流转。
2. Demo 创作思路
灵感来源
我家里养了 4 只猫，加上小区救助的流浪猫，每天要面对的事情太多了：
- 谁今天该驱虫了？上次打疫苗是几个月前？
- 猫粮还剩多少？刚买的这袋粮适不适合我家幼猫吃？
- 小区那只三花做完绝育放归了吗？谁捐了钱？
这些信息散落在小红书收藏、微信群聊天记录、手机备忘录、Excel 表格里，每次要用的时候根本找不到。我试过市面上的宠物 App，它们要么偏社交晒猫、要么偏电商卖粮，真正帮我"管好多只猫日常"的工具——没有。
想解决的问题
- 信息碎片化：养猫需要的健康记录、物资管理、提醒事项分散在多个 App 里
- 多猫管理难：2只以上的猫，靠脑子记每只的体重变化、疫苗时间根本不现实
- 库存全靠猜：猫粮猫砂用完了才发现；更严重的是，不知道买的猫粮适不适合自己的猫（幼猫吃成猫粮、肾病猫吃高磷粮）
- 救助不透明：社区流浪猫 TNR 和物资捐赠靠微信群管理，账目不清、进度不明
- 体验门槛高：很多工具要求注册才能看，评审/朋友想体验一下还得填信息
为什么做这个方向、这些取舍
- 选 Web 而非小程序/App：响应式 Web 不用安装、即用即走，对偶尔使用的救助志愿者更友好；而且 Web 部署成本最低
- 选 SQLite 而非云数据库：单机 SQLite 零运维，Docker 一键部署到家里的 NAS 就能用，数据完全在自己手里
- 做全栈而非前端 Demo：因为我需要真实的数据持久化、用户系统、体验账号隔离，光做前端页面没法真正用
- 做体验账号系统：为了让评审零门槛体验，一键进入带完整数据的系统，登出即清除，这是对评审最友好的方式
- 做猫粮匹配引擎：这是我觉得最有价值的差异化功能——不仅管库存"有多少"，还管"能不能喂"，根据猫的生命阶段和健康状况做智能判断
- PWA + 暗色模式：晚上在床上记体重时暗色模式不刺眼，PWA 加到手机主屏就像原生 App
- 零成本公网部署：用 Cloudflare Tunnel + 免费域名 + 家里 NAS，不花一分钱服务器费
- 统一家猫/流浪猫模型：用 origin 字段区分，而不是做两套系统，因为现实中流浪猫被领养后就变成家猫
3. Demo 体验地址
在线体验：[https://meowhouse.cc.cd]
体验方式：
- 打开链接
- 点击「 体验演示账号」按钮
- 等待 2-3 秒（系统在自动灌入演示数据）
- 开始体验，数据会在登出后自动清除
3 分钟快速体验路径（评审优先看这条路线）：
- 登录后看到首页 Dashboard → 注意顶部提醒横幅、猫咪卡片墙、库存预警
- 点击左侧「猫咪」→ 点进任意一只猫 → 看体重趋势图和健康时间线
- 点击「库存」→ 看到物资列表、可用天数、喂养匹配状态（绿/黄/红标记）
- 点击「健康记录」→ 看时间线分类
- 点击右上角
切换暗色模式 - 点击「报表」看费用统计
- 登出，看到"演示数据已清除"提示
技术栈：Next.js 16 / React 19 / TypeScript / Tailwind CSS v4 / Prisma 7 / SQLite / Recharts / Zod / Sharp / Vitest
4. TRAE 实践过程
整个项目完全由 TRAE Work 辅助开发，我一个人从零开始，前后大约两周多的业余时间。项目有 29 个页面路由、18 个数据模型、21 个 Server Action、25+ 个自定义 UI 组件、10 个测试文件，所有代码都是 TRAE 写的，我负责描述需求、测试验收、提出改进意见。
阶段一：项目初始化
一开始我只会说"我不会编程"，TRAE 帮我把需求整理成了我能看懂思路的技术文档，当然技术依然不太懂，哈哈哈。
Session ID：
[4109345084700180:5c3eb0825a12133ccd45194371b690cc_6a37d47bee8b3097efe17755.6a37f2f94dd55977c30a3336.6a37f2f94dd55977c30a3334:TRAE Work CN.0.1.25.no_sid.no_ppe.T(2026/6/21 22:19:37)]
阶段二：信息架构重组
在让他干了一段时间之后，我感觉功能虽然不少，但是有点乱，TRAE 帮我重新设计了首页，优化了架构，在前面我发现他可以多agent运行，那肯定黑心老板当到底，都给我狠狠干活。
Session ID：
[4109345084700180:54d9cde14e8cf2c24a859e4b8f02d341_6a380d049717c32b293ce8ff.6a399709ecd0216dffbf9894.6a399709ecd0216dffbf9892:TRAE Work CN.0.1.25.no_sid.no_ppe.T(2026/6/23 04:11:53)]
阶段三：账号系统更新
这个阶段逐个模块推进。我突然发现用户没法修改密码，可能是我最开始是打算自己用，没做账号系统，有问题就问，问了TARE自然能解决。
Session ID：
[4109345084700180:c6b254fb69c012f7bf77b2948965f057_6a380d049717c32b293ce8ff.6a412cdafbad3d5b1e974bb6.6a412cdafbad3d5b1e974bb4:TRAE Work CN.0.1.25.no_sid.no_ppe.T(2026/6/28 22:16:58)]
阶段四：出了问题tare可以自己迭代
目前来说ai写出来的复杂系统的代码不可能完全没问题，但是tare可以自己修bug。
Session ID：
[4109345084700180:331a28d7e8d79bdfb601ade43d3a3cad_6a380d049717c32b293ce8ff.6a3acd780e3a74babd09299b.6a3acd770e3a74babd092999:TRAE Work CN.0.1.25.no_sid.no_ppe.T(2026/6/24 02:16:24)]
5. 踩坑与复盘
坑一：没有 home 目录的 NAS 用户
SSH 登录飞牛 NAS 后发现我的用户没有 home 目录，cloudflared 默认往 ~/.cloudflared 写认证文件时报错。TRAE 排查后发现是权限问题，帮我用 sudo 创建目录解决了。
坑二：Cloudflare 添加站点时没有 DNS 记录无法下一步
免费域名刚注册时 DNS 记录为空，Cloudflare 的"下一步"按钮是灰色的。TRAE 告诉我先手动加一条虚拟 A 记录（192.0.2.1）让流程能继续，后续 Tunnel 的 CNAME 记录会自动覆盖。
坑三：better-sqlite3 在 Docker 里编译失败
SQLite 的 native 模块在 Docker Alpine 镜像里编译失败，TRAE 帮我换成 node:20-slim 基础镜像，加上 python3/make/g++ 编译工具链，用多阶段构建解决。
最大的感悟
编程的本质是 “把想法描述清楚” 。 以前我觉得写代码是程序员的专利，但用 TRAE 做这个项目的过程中，我发现最难的不是写代码，而是想清楚"我到底要什么"。只要你能把需求描述清楚、把不满意的地方截图给 AI 看、把报错信息贴回去，TRAE 就能帮你实现。它不只是一个代码补全工具，更像一个耐心的全栈搭档。
6. 后续规划
如果能晋级复赛，我打算继续完善：
- AI 拍照识别猫粮配料表：拍包装照片，OCR + VLM 自动录入配方并分析是否适合当前猫咪
- 智能健康预警：基于体重趋势和历史记录，AI 提示异常
- 微信推送提醒：接入 Server 酱或企业微信，疫苗到期推送提醒
- 配方管理系统：制作可用的猫粮配方管理系统，扫码即可识别猫粮配方，并关联猫咪
项目数据
| 指标 | 数值 |
|---|---|
| 页面路由 | 29 个 |
| Prisma 数据模型 | 18 个 + 6 个枚举 |
| Server Actions | 21 个 |
| 自定义 UI 组件 | 25+ 个 |
| 单元测试 | 10 个 |
| 部署方式 | Docker（飞牛 NAS）+ Cloudflare Tunnel（免费内网穿透） |
| 域名成本 | 0 元（DNSHE 免费域名） |
| 服务器成本 | 0 元（家庭 NAS） |
| 公网带宽 | Cloudflare CDN 加速，免费不限量 |
| 开发时间 | 约 2 周业余时间 |
| 开发者编程经验 | 0 |
报名审核通过帖链接：https://forum.trae.cn/t/topic/37537
谢谢评审！愿每一只小猫都被温柔地照顾 