记得 23 年刚接触 AI 编程类产品的时候,还仅仅只有代码补全、代码片段生成等一些简单的功能。
而现在,很多 AI IDE 已经能一句话完成一个产品从设计、开发、测试到部署上线的整个流程了。
IDE 的形式也是多种多样。
有图形用户界面形式的 AI IDE,比如 Cursor、字节的 Trae、腾讯的 CodeBuddy IDE、还有阿里不久前推出的 Qoder 等。
也有命令行形式的 AI IDE,比如 Claude Code、Qwen Code、Codex 等等。
之前被问到:编程小白想用 AI 编程开发应用,推荐用什么 IDE?
虽然身边一群人都在说 Claude Code 厉害,但对于之前没接触过编程的人来说,Trae、CodeBuddy IDE、Qoder 这些有图形界面的 IDE 更容易上手一些。
今天就分享一个用 Trae SOLO 从 0 开发到部署上线的案例。
一、Trae 下载

Trae 国内版:www.trae.cn/
Trae 国际版:www.trae.ai/
Trae 分国内版和国际版,两者在功能使用上并没有什么太大区别,主要就是模式使用上不同。
国内版的 Trae 主要集成了豆包、Kimi、Qwen、GLM、DeepSeek 等国内主流的大模型,而国际版 Trae 主要集成了 Claude、Gemini、GPT 等国际主流的一些大模型。

选择适合的版本下载安装就可以了。
打开 Trae 后,在左上角可以看到 Trae 有两种模式:IDE 模式 和 SOLO 模式。(点击可以切换)

Trae SOLO 模式,是 Trae 在 7 月新推出的一项功能。
Trae SOLO,是行业首个 Context Engineer。用户只需要描述任务需求,Trae SOLO 就能智能获取到上下游的各类上下文,并自动规划、调用各种工具来实现从需求设计、开发、测试、部署上线的全流程。
下面的案例,就是在 Trae SOLO 模型下完成的。
二、项目背景
这个案例是从零开发、上线一个 AI 工具站(含用户端和管理端),涉及前端、后端、数据库操作等。
用户端:
用来展示工具、根据分类和关键字快速检索工具;
管理端:
用来添加、删除工具和更改工具的信息。
数据来源:
为了简单,就直接用我之前维护的一份飞书文档来填充数据,里面有 200 多个 AI 工具及工具教程。
下面是这份文档的部分内容:

这个案例之前用 CodeBuddy IDE 实现过,同样的案例,来看看 Trae SOLO 的表现如何。
三、输入需求
我们只需要在对话框中简单描述下任务需求,点发送,就可以看 Trae 帮我们干活了。
你也可以通过上传图片或 Figma,来规定具体的样式。比如这里就简单上传了张草图,来描述每个 item 的大概样式。
点「优化」按钮,可以对现有提示词进行优化。

下图是优化后的提示词:

比自己写的一坨提示词看着舒服一些,也丰富了一些要求。
四、设计
Trae SOLO 在接到需求后,就开始干活了。
它先是创建了「产品需求文档」和「技术架构文档」,用于指导后续的开发。
产品需求文档:
包含了产品概述和核心功能定义、用户角色设计(普通用户和管理员)、详细的页面功能模块规划、用户界面设计规范和响应式设计策略、完整的用户流程设计等。

技术架构文档:
包含了架构设计、完整的路由定义和 API 接口设计、详细的数据库模型设计、完整的 SQL 建表语句和安全策略配置等。



如果有需要调整的,可以在对话框中继续输入或者在文档中修改。
点「查看变更」,可以看到修改前后的对比。
五、开发
如果没有问题, Trae 就可以开始开发了。

Trae 先是根据技术架构文档,创建了项目的脚手架,并自动安装了所需的依赖包。
然后创建了一份待办事项列表:

Trae SOLO 会根据待办事项列表来逐步完成开发步骤。
每完成一项,都会更新状态。让我们清楚它的进度。

所有任务开发完后,点「预览」,就可以在右侧的「浏览器」中,查看效果了:

对于不满意的地方,可以继续在对话框中提需求。
比如,在它一开始展示工具的时候,并没有用到飞书文档中提供的数据,而是自己随便拟了 5 个 AI 工具来展示。
那么就可以继续追问。

Trae 分析了可能的原因,并给出了解决方案,最后还是决定,直接从飞书文档中导出一份 CSV 文件给它。

之后它自己写了「数据清洗」的脚本和「批量导入数据库」的脚本,将清洗后的数据成功导入了数据库。


小技巧
分享一些小技巧。
比如程序报错了,在控制台里点「添加到对话」,就可以一次性将多个报错信息告诉 Trae,让它修复。

再比如,想对画面中的某个元素进行修改,可以直接选择这个元素,「添加到对话」进行针对性的修改。

集成 Supabase
因为项目涉及后端服务和数据库操作,比如数据库的存储和操作、图片的存储、以及登录管理端的身份验证,这些都是需要用到 Supabase 的。
Supabase 数据库存储:

Supabase 图片存储:

Trae SOLO 直接将 Supabase 服务集成了进来,不需要我们了解太多数据库和后端技术了,大大简化了上手难度。

第一次连接需要授权。

在 Supabase 里新建一个项目:

授权连接 Supabase、选择项目后,Trae 就可以自动帮我们完成数据库建表、增删改查及用户认证等操作。
比如,下面这些,建表、插入数据、添加策略、写批量插入数据的脚本啥的,完全不需要自己动手,Trae 全部帮我们做了。

也可以在「集成」里管理 Supabase 服务:

六、部署上线
以往部署上线一个项目,需要自己在服务器上安装、配置各种服务,还需要开放端口、绑定域名等各种操作。
对于非程序员来说,有一定难度。
而 Trae SOLO 支持将开发好的项目一键部署上线。
点对话中的「部署卡片」、或浏览器右上角的「部署按钮」:


第一次部署需要授权:


部署好好后,就可以直接把链接分享给朋友了。
如果后续有新的修改,修改后可以点「部署新版本」。

七、项目结果展示
最后来看下用 Trae SOLO 实现的效果吧~
用户端:
完整的视频演示:见原文

管理端:
完整的视频演示:见原文


八、写在最后
以上就是今天的分享,用一个小案例,来演示了 Trae SOLO 的主要功能和玩法。
从需求提出,到编写产品需求文档和技术架构文档,再到前后端开发,及最后的部署上线,整个过程都非常顺畅。
不需要懂太多的编程技术、数据库操作和服务器操作,直接用大白话沟通需求、描述问题就行了。
记得几个月前,用 AI 编程工具改一个需求时,还经常修改好几遍都改不好。
而现在,明显提升,只要表述清楚,基本一两遍就能改好。
以为「AI 提效」只是个遥远的口号,而现在,它用实实在在的生产力作出了有力的回答。
感兴趣的可以试试~
推荐阅读
2024年终AI工具汇总:9大AI领域,70+精选AI工具,全都在这了!(建议收藏)
更多 AI 工具见【AI工具】专栏,持续更新中。
我是程序员X小鹿,前互联网大厂程序员,自由职业3年+,也是一名 AIGC 爱好者,欢迎一起交流~