0. 先和大家打个招呼吧 
我是谁： 一名对AI工具充满好奇的产品设计爱好者，平时喜欢折腾各种新工具，看到好玩的idea就手痒想试试。
我是怎么用TRAE把这个Demo做出来的： 说实话，我代码基础一般，之前做东西主要靠拖拽和低代码平台。这次用TRAE，最大的感受是"原来我可以不用写代码就把一个完整的产品逻辑跑通"。我的做法很简单，就是把脑子里想的用户流程一句句讲给它听，比如"用户要先登录，然后录入食材，系统算保质期，快过期的时候提醒一下"。TRAE最牛的地方是，我不需要一次性想得很清楚，可以边聊边改，它会把前面的代码自动衔接上。最让我惊喜的是接入Supabase数据库和DeepSeek API那一步，我本来以为这种后端操作我肯定搞不定，结果TRAE直接帮我生成了Vercel Serverless Function,感觉像有个技术搭档在旁边把难啃的骨头都啃了。
1. Demo 简介
是什么： 一个能减少家庭食物浪费的趣味网站，本质上是你家冰箱的"AI管家"。
面向谁： 经常买菜但忘记吃、打开冰箱发现东西已经过期了的都市年轻人，以及想减少食物浪费但又懒得手动记的家庭。
主要功能：
-
食材录入 + 保质期倒计时：手动输入食材名称、购买日期和保质期天数，系统自动算到期日和剩余天数，按紧急程度排序。
-
AI抢救菜谱生成：优先挑快过期的食材，调用DeepSeek生成一份能做、能吃的抢救菜谱，菜名可以很离谱但步骤必须正经。（需登录后使用）
-
搞笑提醒：根据最紧急的食材生成毒舌提醒，比如"黄瓜正在冰箱里倒计时，还剩2天。再不安排，它就要开始写自传了。"
2. Demo 创作思路
灵感来源： 我自己就是目标用户。每次买菜都想着"这次一定吃完"，结果两周后打开冰箱，一半的食材都在默默过期。我试过记账App、日历提醒，但都坚持不下来，因为手动记录太麻烦了。后来我想，能不能做一个工具，把"记保质期"这件事变得简单甚至有点好玩？
想解决的问题：
-
痛点1：买了食材忘了什么时候买的，也懒得算过期日。
-
痛点2：快过期了才想起来，不知道怎么快速消耗掉。
-
痛点3：现有的食物管理App太正经，用两天就放弃了。
为什么做这个方向： 我觉得"减少浪费"这件事不需要做得很重。用户不需要一个功能齐全的厨房管理系统，只需要一个轻量的提醒 + 一个能帮你把临期食材凑成一顿饭的方案。加上AI生成菜谱，把原本枯燥的"清理冰箱"变成了一件有点期待感的事。
3. Demo 体验地址
**
在线体验：**https://www.zhaoyang.uno/
支持三种登录方式：邮箱注册/登录、游客模式（无需注册，数据保存到云端）。
4. TRAE 实践过程
整个Demo的开发完全在TRAE中完成，核心流程如下：
Step 1：从0到1搭建前端页面 最开始我只给了TRAE一个大概的想法：“做一个录入食材的网站，要有表单和列表”。TRAE帮我生成了完整的HTML/CSS/JS结构，包括响应式布局、食材卡片、倒计时样式。我后续逐步增加了统计面板、AI提醒区块、抢救菜谱区域。
Session ID：3735472833047827:8990f19e0f300992302eb69660b98c08_6a4b5ba3fbd74bdc01892b62.6a4b64effbd74bdc01892c9d.6a4b64effbd74bdc01892c9b:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/6 16:18:55)
Step 2：接入DeepSeek AI生成菜谱 本地菜谱太死板，我想让DeepSeek来生成。TRAE帮我创建了一个Vercel Serverless Function，调用DeepSeek API的deepseek-v4-flash模型，根据当前最紧急的5个食材生成JSON格式的菜谱。API不可用时有本地兜底方案。
Session ID：_3735472833047827:0acdf3ed988f0578a08f0e990fe6f6b4_6a4b5ba3fbd74bdc01892b62.6a4ca152d028b5d70ed6d13a.6a4ca152d028b5d70ed6d138:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/7 14:48:50)
Step 3：接入Supabase用户系统和数据库 这是技术难度最大的一步。我需要用户注册/登录/游客模式，还要把食材数据存到数据库。TRAE帮我设计了完整的架构：
-
前端不直接连接Supabase，所有操作通过
/api/auth和/api/foods接口完成 -
后端用pgcrypto在PostgreSQL里做密码bcrypt哈希
-
创建了register_user、login_user、create_guest_user三个RPC函数
-
环境变量存在Vercel里，前端完全看不到密钥
Session ID：__3735472833047827:535905220cb07a5514a38c49524ab64d_6a4b5ba3fbd74bdc01892b62.6a4cb74bd028b5d70ed6d244.6a4cb74bd028b5d70ed6d242:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/7 16:22:35)
Step 4：调试和迭代 部署后遇到了不少坑：API返回非JSON、环境变量缺失导致Function崩溃、并发save/load导致数据覆盖等。每次出问题我就把错误信息丢给TRAE，它帮我定位原因并修复。印象最深的是"登录后添加食材不保存到数据库"那个bug，最后发现是currentUser没设置导致isLoggedIn一直为false，这种细节我自己根本排查不出来。
Session ID：3735472833047827:b50fce2e85877a02629742945ab71858_6a4b5ba3fbd74bdc01892b62.6a4f4dcdd7d2b9b5bdcb02a6.6a4f4dcdd7d2b9b5bdcb02a4:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/9 15:29:17)
5. 对应的报名审核通过的帖子链接
https://forum.trae.cn/t/topic/22548
补充说明：
-
当前版本为MVP，核心跑通了"录入→倒计时→AI菜谱→用户系统"这条主线。
-
技术栈：纯前端HTML/CSS/JS + Vercel Serverless Functions + Supabase PostgreSQL + DeepSeek API。