恒美微站
首页
关于我们
建站服务
主题模板
案例展示
资讯中心
联系我们
Claude Code实战:用AI从零搭建宠物生命周期管理App
首页
资讯中心
/
Claude Code实战:用AI从零搭建宠物生命周期管理App
Claude Code实战:用AI从零搭建宠物生命周期管理App
发布时间:2026/10/16 18:23:38
上周我把压箱底的宠物生命周期管理App想法用Claude Code从零做了出来。说从零是真的零一个空目录、一张需求清单、一台普通电脑没有现成代码可以抄。最终跑起来的App能管理宠物档案、疫苗记录、驱虫提醒、体重趋势还能自动判断宠物处于哪个生命周期阶段。这个过程中Claude Code负责了绝大部分编码工作我做的是定方向、拆需求、验收代码、补边界情况。这篇文章把整套流程原原本本写下来包括提示词写法、表结构设计、我在AI编程过程中踩到的典型坑以及我对用AI从零搭项目这件事的边界认识。如果你只是想看AI写几个函数那网上教程一抓一大把如果你想真让AI帮你把一个完整项目从无到有做出来这篇应该能帮你少走不少弯路。1. 先想清楚再动手宠物生命周期管理App的需求边界是怎么收敛的决定做这个App之前我对生命周期管理这个概念其实是模糊的。一开始我脑补的是宠物版社交网络各种花里胡哨的功能往里塞宠物圈、萌照墙、附近猫友……但真坐下来梳理时发现这些功能跟生命周期四个字根本不搭。我重新拆解了一遍宠物主人的真实痛点把生命周期管理收敛成三个问题第一我家宠物现在处于哪个阶段第二这个阶段它必须做哪些健康事项第三这些事项到时间了我怎么不会忘。1.1 这个App到底要管住宠物的哪些生命周期围绕上面三个问题我按年龄段把宠物生命周期切成四个阶段幼年期、成年期、中年期、老年期。每个阶段对应的健康任务和提醒强度完全不同下面是猫的版本这也是我第一版里最核心的业务规则。阶段年龄范围猫核心任务提醒强度幼年期0-1岁多针疫苗密集接种、驱虫频率高、体重增长快强提醒按月成年期1-7岁年度体检、常规驱虫、保持体重稳定中提醒按季中年期7-11岁体重控制、牙齿检查、肾脏早期筛查中高提醒老年期11岁以上慢性病筛查、用药记录、行动能力观察高提醒甚至按周狗的阶段要再做一次体型校正大型犬衰老速度明显比小型犬快同样叫7岁小型犬还在成年期尾巴上大型犬已经算中年了。这个规则我要求后端必须支持按物种和体型动态判定不能写死。1.2 用AI之前先把自己的需求文档写成人话既然AI那么强需求文档是不是可以直接口述我的答案是可以但代价是你得陪它一起混沌。Claude Code不会主动问你要不要去掉宠物社交功能它只会老老实实把你口头提到的功能全部加上哪怕这些功能彼此矛盾。所以我的第一版需求文档写得很朴素就叫需求单格式如下。需求单 v0.1 功能范围 1. 添加/编辑/删除宠物档案 2. 宠物列表展示头像、名字、品种、年龄 3. 添加疫苗记录显示下次接种日期 4. 疫苗到期前7天在提醒中心展示 5. 记录体重展示体重变化趋势 6. 自动计算生命周期阶段猫/狗 不做 - 不做宠物社交 - 不做社区问答 - 不做多用户家庭共享 - 不做微信推送 - 不做移动端第一版桌面浏览器优先这份需求单里最关键的其实是不做部分。AI编程和人工带新人很像你说清楚不做什么它才不会发挥过度。我见过太多AI项目翻车翻车原因往往不是AI能力不够而是需求描述里给了AI太多自由发挥的空间。1.3 MVP版本的功能清单与砍需求原则在此基础上我把MVP功能砍到只剩四件事宠物档案、疫苗记录、提醒中心、体重记录。为什么砍得这么狠因为四件事背后其实是数据管理时间提醒两条主线所有功能都围绕这两条主线展开验收范围清晰。算下来MVP大概是20个后端接口、10个前端页面组件这个量级Claude Code几天内能完成我也能一个人完成代码评审。砍需求的原则我只用了一条这个功能如果上线第一周没人用就先砍掉。宠物社交听起来有价值但第一周一定没人用疫苗到期提醒则是第一天就会用到的功能。剩下的功能优先级完全是拿这个标尺量出来的。2. 环境准备与项目骨架让Claude Code真正理解从零搭建需求明确之后我开始准备开发环境。Claude Code是在终端里运行的AI编程工具它能读取项目里已有的文件、执行终端命令、在文件之间跳转更像一个驻场实习生而不是那种只能聊天的AI窗口。它的工作方式决定了从零搭建一个新项目的流程和普通聊天式AI完全不同。2.1 Claude Code的工作机制和高效启动方式Claude Code启动方式很简单先创建一个空目录进入这个目录然后在终端里启动claude命令。首次启动后它会扫描当前目录结构发现是空目录就会直接问你想做什么。如果你从一个已经有代码的项目里启动它则会优先读取现有文件把整个代码结构加载进上下文。mkdir ~/projects/petcare cd ~/projects/petcare claude我试过两种启动姿势。第一种是进去之后直接说帮我写一个宠物管理App第二种是把需求单原封不动丢给它然后说先读需求单确认目录结构和技术方案再开始搭骨架。第二种方式效果好得多因为它在一开始就建立了完整的问题上下文。这就像你给新同事派活糊里糊涂说做个App和清楚告诉他背景、范围、边界后者一定更靠谱。2.2 技术栈选型为什么选React FastAPI SQLite技术栈我选的是前端Vite React TypeScript后端FastAPI SQLite。选这套组合不是因为它们最流行而是因为它们最符合AI辅助开发的场景。React TypeScript的组件代码在训练语料里样本量巨大Claude Code生成这类代码的质量最稳定类型推导也相对可靠。FastAPI的接口定义和参数校验几乎零成本AI生成这类代码时很少遗漏Pydantic校验天生适合快速搭建REST API。SQLite单文件、零配置省掉数据库服务的运维成本。宠物App的并发量很小SQLite完全撑得住没必要第一版就上独立数据库服务。我不建议用特别冷门的新框架来做AI辅助开发。Claude Code见过越多的项目模式生成的代码越靠谱这是我在项目中期差点换技术栈时得出的教训。2.3 用一次对话完成项目初始化项目骨架的初始化我要求Claude Code一次性完成。使用的提示词大概长这样。请在这个空目录下搭建项目骨架 - 后端FastAPI SQLite提供REST API统一返回JSON - 前端Vite React TypeScript使用react-router-dom做页面路由 - 目录结构需要区分 src/components、src/pages、src/api、app/models、app/routers - 初始化git并创建.gitignore 创建完成后在README.md中写明启动方式不要开始写任何业务功能。注意最后那句不要开始写任何业务功能。不加这句它很可能会顺手生成一个宠物类加一个建议接口把骨架阶段和业务阶段混在一起。加了之后它就老老实实只搭骨架。初始化完成后跑了一遍npm run dev和uvicorn看到两个服务都能启动我才放心进入下一阶段。3. 数据模型与后端接口AI生成代码前必须钉死的三张表后端是整个App的底盘底盘的核心是表结构。表结构一旦定错后面所有AI生成的接口和前端页面都会跟着跑偏。这个阶段我花了大量时间跟Claude Code对齐数据模型因为我知道后期改表代价很大。3.1 核心表结构的设计细节我跟Claude Code把项目核心表锁定为三张pets、vaccines、reminders。设计表结构时有一个细节我后来很庆幸疫苗记录统一用due_date表示下次接种日期而不是next_vaccine_date这类字段名。字段命名风格统一能显著降低AI生成前后端代码时混用字段的概率。CREATE TABLE pets ( id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL, species TEXT NOT NULL CHECK (species IN (cat, dog)), breed TEXT, birthday DATE NOT NULL, weight REAL NOT NULL DEFAULT 0, neutered BOOLEAN NOT NULL DEFAULT 0, chip_id TEXT, created_at DATETIME DEFAULT CURRENT_TIMESTAMP ); CREATE TABLE vaccines ( id INTEGER PRIMARY KEY AUTOINCREMENT, pet_id INTEGER NOT NULL REFERENCES pets(id), vaccine_name TEXT NOT NULL, given_date DATE NOT NULL, due_date DATE NOT NULL, clinic TEXT, created_at DATETIME DEFAULT CURRENT_TIMESTAMP ); CREATE TABLE reminders ( id INTEGER PRIMARY KEY AUTOINCREMENT, pet_id INTEGER NOT NULL REFERENCES pets(id), type TEXT NOT NULL CHECK (type IN (vaccine, deworm, birthday, weight)), title TEXT NOT NULL, scheduled_date DATE NOT NULL, status TEXT NOT NULL DEFAULT pending, created_at DATETIME DEFAULT CURRENT_TIMESTAMP );注意pets表里我把species字段限制成cat和dog两种取值这是给AI的硬约束。如果不加CHECK约束它会生成任意字符串前端下拉框、后端校验、统计报表全都对不上。这种约束看起来不起眼却是AI协作里最重要的护栏之一。3.2 让Claude Code生成FastAPI接口的提示词模板表结构定死后再让Claude Code写接口。我用的提示词会同时包含三块内容需求描述、数据模型、验收标准。下面的提示词是我在整个项目里最常用的一套模板。请基于现有的模型代码生成以下API 1. POST /pets 创建宠物 2. GET /pets 列表 3. GET /pets/{id} 详情 4. PUT /pets/{id} 更新 5. DELETE /pets/{id} 删除 6. GET /pets/{id}/vaccines 7. GET /reminders?start_date...end_date... 要求 - 使用FastAPI的Pydantic做参数校验 - 所有接口返回 { data: ... } 或 { error: { code: ..., message: ... } } - created_at由数据库生成不接受前端传入 生成后请用pytest风格写最小测试用例加了验收标准以后AI和我的协作效率翻倍。它会自己写测试我只需要跑一遍pytest看到全绿再去看几个边界用例有没有覆盖。如果不加写测试的要求AI会默认只生成接口代码然后你得自己补测试这就把主动权又交回到了你手里。3.3 数据库迁移与字段约束的验收方式Claude Code对数据库迁移的处理不像专业后端那样严谨。最常见的问题是改模型后它直接重建数据库测试数据全部丢失。我的做法是干脆不用迁移工具明确要求它维护一个migrations/schema.sql文件每次改表都在文件末尾追加新版本而不是替换旧文件。这样数据库结构变更就留痕了回滚也方便。另外我让它生成一个seed.py脚本用来填充演示数据。这个脚本会在测试环境里创建三只宠物、五条疫苗记录、八条提醒涵盖已过期、今日到期、未来7天到期、未来30天到期四种状态。这个脚本在后端和前端联调时帮了大忙几乎每个提醒场景都能靠它复现。4. 前端页面的AI实现从宠物档案表单到疫苗日历后端接口稳定之后进入前端页面开发。这是Claude Code发挥最亮眼的环节因为React组件的写法高度模式化训练样本多生成质量稳定。但前端也不是无脑生成就能用我有一套自己的拆分和验收方法。4.1 组件拆分思路与提示词写法前端我要求Claude Code按页面和组件的粒度分批生成而不是一次性生成整个前端。一次生成20个组件AI会顾此失彼经常出现A页面引用了B页面还没创建的组件、路由路径对不上等问题。我拆解后依次生成了宠物列表页、宠物详情页、疫苗表单、体重趋势组件、提醒中心页。每个页面生成时都给一句职责声明。举一个例子这是生成宠物详情页的提示词。在现有项目里创建宠物详情页路由 /pets/:id 页面职责 - 展示宠物基础信息 - 展示疫苗时间线 - 展示体重趋势图 - 进入页面时调用 GET /pets/{id} 和 GET /pets/{id}/vaccines 用 react-router-dom 的 useParams 读取 id 接口返回格式是 { data: ... }注意解包 组件文件放在 src/pages/PetDetail.tsx写完后跑 tsc 检查类型我会刻意把接口返回格式是 { data: ... }写进提示词因为这是最容易漂移的约定。如果不写AI有时会解包data有时会直接用整个response对象前后端联调时就会出现一堆难排查的undefined。4.2 AI生成页面后我改得最多的三处AI生成页面后我改得最多的是三处。第一TypeScript类型定义不一致接口字段叫birthday组件里却写成了birthDate。这类问题tsc检查能拦住一部分但有些场景里AI会用as any绕过类型检查。第二日期格式化问题后端返回2025-06-01这种字符串前端有的地方直接显示有的地方new Date()之后又转成了带时间的字符串同一个日期在页面上出现两种格式。第三表单校验缺失前端保存宠物时没有做必填校验空名字也能提交。这些问题不会让页面完全崩溃但在实际使用体感上非常差。我处理的方式是给Claude Code提新需求时附上一句约定所有表单提交前做必填校验日期统一用date-fns格式化。后续生成的代码就慢慢把这套约定补上了。4.3 疫苗提醒的本地推送逻辑与测试疫苗提醒的交互MVP版我做两件事首页红点提醒加三个预置状态标签待接种、即将到期、已过期。提醒逻辑很简单后端按照due_date和当前日期计算出状态前端拿到状态后把对应标签渲染出来。由于没有短信通道我让Claude Code实现了一个浏览器Notification推送页面打开时请求权限到期的宠物会弹系统通知。这里有个容易踩的坑浏览器Notification不能作为唯一提醒方式因为用户每次打开页面时才会触发。我让后端在reminders表里同时维护一个last_notified_at字段避免用户在同一个页面停留时重复弹通知。测试时专门用seed数据放了一条昨天到期的疫苗和一条9天后到期的疫苗验证状态计算和红点展示确认无误后提醒功能才算真正验收通过。5. 踩坑实录Claude Code生成代码时最容易翻车的三类问题用了Claude Code将近一周整体体验是效率惊人但翻车方式也很有规律。如果只看前面的顺利流程你可能会误以为它是全能助手。实际上有三类问题在我的项目里反复出现我把完整排查链路写出来纯手工整理全是实操经验。5.1 幻觉依赖它把不存在的库写得像真的一样第一次遇到Claude Code编造依赖是在后端加缓存时。它建议用某个缓存库还说这是官方推荐方案。跑起来以后直接ModuleNotFoundError查requirements才发现这个库名根本不存在。排查链路其实就是三层跑测试看到红色报错grep一下import来源定位到一行不存在的库引用打开requirements.txt确认没有这个依赖再回看对话记录发现是AI凭印象生成的库名。解决办法是立了一条硬规矩Claude Code只能使用requirements.txt里已有依赖如果需要新增依赖必须先把包名和用途列出来让我确认。从那以后我再也不让它自由发挥引入新库这个习惯帮我避开了很多隐蔽问题。5.2 改一处功能破坏另一处的回归问题第二个高频坑是回归。Claude Code在修一个功能时经常顺手把另一个文件里的代码改掉。这就像实习生想在A文件里加注释结果把B文件的函数签名改了。最典型的一次我让它修宠物详情页的日期格式它顺手把疫苗表单的提交流程也改了导致提交后刷新页面数据丢失。我为此建立了一套硬性纪律每次让Claude Code开始新任务前先把当前所有改动用git提交。任务完成后先跑测试和tsc再验收。如果验收时发现问题我会要求它只描述改动点不直接给修复方案由我自己判断应该怎么改。这套流程让项目在持续被AI修改的过程中始终处于可用状态即使某次它改坏了也能快速回滚到上一个可用版本。5.3 上下文窗口的遗忘边界全局约定如何强制对齐第三个问题是上下文遗忘。Claude Code虽然能读文件但跨文件的全局约定很容易忘。比如项目约定统一用{data: ...}返回格式到第7次对话时它写了个新接口直接返回数组。这类问题不是AI能力差而是它每次对话都会重新评估上下文早期对话里的约定在长对话后期逐渐被稀释。我的解法是建一个docs/project-rules.md文件把所有约定写进去返回格式、命名规范、日期处理方式、禁止擅自新增依赖。每次启动新任务时第一句话固定是请先读docs/project-rules.md然后完成以下任务。这样做的效果非常明显后续生成的代码风格漂移少了很多验收通过率直线上升。6. 部署上线与后续维护AI生成项目的长期运营边界功能开发完接下来就是把项目送到真实环境里跑。Claude Code在开发和维护阶段帮了大忙但部署环节仍然需要我自己操作因为它对服务器状态、进程管理、网络配置这些环境的感知是有限的。6.1 部署过程本地跑通到Linux服务器的完整路径部署方案我选了一台普通的Linux服务器。前端构建成静态文件由开源Web服务器托管后端用systemd作为常驻服务SQLite数据库放在专门目录每天凌晨用计划任务做一次备份。核心命令大致如下。cd frontend npm run build sudo cp -r frontend/dist /var/www/petcare # 后端的 systemd 服务负责启动 uvicorn监听 127.0.0.1:8000在上面加一个反向代理配置把/api路径转发到本地8000端口。这样前端页面和后端API共用80端口省掉跨域配置的麻烦。如果你有公网证书建议把HTTP跳HTTPS一起配上。部署完第一件事是打开提醒中心确认没有跨域问题然后跑一遍完整业务流程添加宠物、添加疫苗记录、触发提醒。6.2 让AI继续维护代码的正确姿势项目上线后后续维护也得继续让Claude Code干活。我的维护请求模板长这样。上下文项目地址 /projects/petcare规则文件在 docs/project-rules.md 需求描述疫苗到期时间从固定日期改成 接种日期有效期自动计算允许手动覆盖 涉及文件app/routers/vaccines.py, src/pages/VaccineForm.tsx, src/api/pets.ts 验收方式新增单测覆盖有效期自动计算场景前端表单显示自动计算结果但允许编辑把需求描述、涉及文件、验收方式三件事写全Claude Code的维护效率接近一个熟悉项目的兼职开发。如果它改坏了git diff能帮你快速定位是哪一步引入的问题。维护阶段我感触最深的一点是不要用聊天式对话让它瞎改每一条维护请求都要像给正式开发提工单一样写清楚。6.3 做完这个项目后我对AI编程的真实感受最后聊聊边界。这个项目从空目录到MVP前后大概用了一周时间其中我真正纯手写代码的时间不超过三小时但思考和验收的时间占了绝大部分。Claude Code最擅长的不是替你做决定而是把你已经想清楚的方案用代码快速落一遍。它不擅长的是替你发现产品逻辑漏洞、决定UI审美偏好以及判断这个功能到底该不该做。换句话说长期做AI辅助开发的人架构能力和需求拆解能力反而更重要编码能力只是被放大了。对我来说这次用Claude Code从零搭建宠物生命周期管理App最大的收获不是省下多少编码时间而是逼着我把一个模糊想法拆成了可执行、可验收、可维护的工程方案。如果你也想用AI从零做完整项目我的建议只有一条把它当成一个行动特别快的实习生而不是全知全能的架构师你定方向它执行项目才能真正跑得起来。