老乡鸡也开源？我用 TRAE SOLO 做了个像老乡鸡那样做饭小程序！

本文作者：不如摸鱼去，TRAE 开发者用户

去年，「老乡鸡不装了，直接开源」的消息引发了广泛关注。我也很好奇，老乡鸡不是做菜的吗，开的哪门子源？仔细了解后发现，原来是把他们的菜品、溯源报告等资料开源了。随后，GitHub 上这个叫「像老乡鸡那样做饭」的项目迅速走红，如今 Star 数量已经达到了 19k+，项目地址：github.com/Gar-b-age/C... 。

作为一名热爱烹饪的程序员，面对如此优质的开源资源，怎能错过？我决定用 TRAE SOLO 快速构建一个「像老乡鸡那样做饭」小程序！本文将分享如何利用 TRAE SOLO 的高效开发能力，将这份"开源美味"封装成便捷的小程序。

实现效果

技术栈

开发前选择合适的技术栈，让 AI 在规划好的路线上进行开发，能够达到事半功倍的效果。

前端技术栈

因为我本身就是一个前端程序员，所以前端技术栈比较熟，直接选择常用的技术栈：

• 小程序的开发框架： uni-app

• 开发模板项目： wot-starter 地址： starter.wot-ui.cn/

• 组件库： wot-ui 地址 ： wot-ui.cn/

后端技术栈

为了实现免开发的服务端，我选择了 TRAE SOLO 集成的 Supabase 作为云端服务。

Supabase 是一个开源的 Firebase 替代品，旨在帮助开发者快速构建后端功能。它基于 PostgreSQL 数据库，并提供实时订阅、身份验证、存储、边缘函数等功能，支持 REST 和 GraphQL API。Supabase 强调开源、可自托管，并提供免费起步的云端服务，适合构建现代 Web 和移动应用。

菜谱数据来源

菜谱数据来自开源项目「像老乡鸡那样做饭」，GitHub 地址：github.com/Gar-b-age/C...

开始开发

选定技术栈后即可开始开发。由于使用 Supabase 作为服务，后端开发无需操心，只需要让 TRAE SOLO 来建表、处理数据即可。

数据处理

将菜谱的 Markdown 文件和相关图片放到 cook-book 目录下，然后让 TRAE SOLO 开始处理。

TRAE SOLO 开始处理需求，生成 tasks 列表并执行：

不过并非一步到位，我发现导入的数据有些配料字段为空，有些步骤缺失，于是让它重新检查（后来我发现是部分菜谱的 Markdown 文件标题格式不统一，这部分我手动处理了）。

最终，TRAE SOLO 成功将全部菜谱数据处理完毕，并插入到 Supabase 数据库中，接近 200 道菜，足够每天尝试一道新菜了。

技巧小结

"干净"的数据能达到事半功倍的效果，上述纠错过程充分印证了这一点。在让 AI 处理前，花时间进行基础的数据清洗（统一文件命名规范、检查必要字段完整性、清理异常字符）是非常值得的投入。

小程序开发

开发前需要做一些准备工作。由于 wot-starter 包含暗黑模式等配置，而我们暂时不需要这些功能，需要先移除，避免干扰 AI 对项目的理解。

小技巧： 应尽量为 AI 提供有用的信息，因为过大的上下文会导致它偏离主题。

向 TRAE SOLO 提出以下需求，先实现简易版：

开发一个像老乡鸡那样做饭小程序，基于现有表结构实现以下核心功能：

1. 分类浏览功能：按照菜品分类展示菜谱列表

2. 首页推荐功能：在首页展示精选推荐的3-5个菜谱

3. 菜谱详情页：点击可查看完整菜谱信息

要求：

- 保持现有表结构不变

- 界面设计简洁直观

- 确保数据加载流畅

- 适配移动端显示

- 使用unocss编写样式，使用rpx做单位

经过一轮开发后，项目结构如下：

此时项目还无法正常运行，控制台出现报错，我们直接将控制台报错信息发送给 TRAE SOLO。

解决问题后，小程序成功启动，效果已经基本达到了文章开头展示的样子。

当然还有一些小问题，都可以让 TRAE SOLO 来处理：

后续完善

初版完成后，群里的朋友 FliPPeDround 提醒我，「像老乡鸡那样做饭」项目的 GitHub 上有 PR 提供了做菜的手绘流程图。这太棒了，我们立即添加这个功能。

首先让 TRAE SOLO 将新增的手绘流程图上传到 Supabase，并将其地址插入到对应的菜谱中：

然后在菜谱详情中展示手绘流程图：

效果如图，配上流程图，既清晰又美观：

总结

今天我们几乎零代码地用 TRAE SOLO 实现了「像老乡鸡那样做饭」小程序，过程中这三个原则让开发事半功倍：

• 保持数据干净： "干净"的数据能达到事半功倍的效果，上面处理数据时纠错的过程可以印证这一点，在让 AI 处理前，花点时间做基础的数据清洗（统一文件命名规范、检查必要字段是否存在、清理异常字符）是非常值得的投入。

• 纯净上下文： 为 AI 提供一个相对"纯净"的、与当前任务高度相关的上下文环境，这样可以让 AI 在我们规划好的路线上进行开发，避免"天马行空"。

• 增量式沟通： 尽量做到增量式沟通，不要一次性把所有需求都丢给 AI。先实现核心功能，跑通后再提新需求，比如我们添加手绘流程图的功能。每次交互都基于当前已完成的代码状态，让 AI 能"看到"它之前的成果，更容易理解下一步要做什么。

实现这个小程序后，我再也不愁没菜做了！后续还可以添加一些有趣的功能，例如：今天吃什么、每周必吃、大家都在吃等功能。当然这些功能也会由 TRAE 来开发，大家可以期待。同时也期待未来 AI 编程能为我们带来更多、更强的能力，让我们能专注于更重要的「业务逻辑」。

参考资料

• 小程序的开发框架： uni-app

• 开发模板项目 ： wot-starter 地址： starter.wot-ui.cn/

• 组件库： wot-ui 地址： wot-ui.cn/

• 像老乡鸡那样做饭： github.com/Gar-b-age/C...