共计 5863 个字符,预计需要花费 15 分钟才能阅读完成。
字节跳动推出了其 AI 编程助手 Trae 的 2.0 版本,并逐步开放给用户使用。此次更新引入了 SOLO 模式,这是一个具有上下文工程能力的系统,能够依据全面的信息进行任务规划与执行,支持从代码编写到功能交付的全流程开发。
SOLO 是 Context Engineer 的缩写,作为一名独立的软件生成 AI 工程师,它可以替代人类处理开发流程中那些琐碎、重复的环节。
SOLO 模式被视为从“AI 辅助”向“AI 主导”的重要范式转变。与传统依赖人工驱动的智能工具和代码补全工具相比,SOLO 在理解需求后,能够主动调动资源来完成复杂的开发任务。目前,该系统已支持 Web 应用的完整交付流程,未来还将扩展更多的应用场景。
我注意到许多开发者已经获得了内测资格,大家对 SOLO 模式的实际使用体验如何呢?
大家好,我是程序员鱼皮。你们是否也有过这样的经历:想学习新技术时,面对文档感到无从下手,观看视频又容易走神,报了很多课程却始终无法坚持下去。。。
反正我常常有这种情况,简直是学习焦虑的重度患者。

作为一名程序员,我一直想开发一个程序来克服我的学习焦虑,却因为觉得麻烦而拖延。直到现在 AI 编程技术大幅提升,我才终于动手!借助 TRAE,我在一天内完成了《学习英雄》小程序,让学习变得如同玩游戏般轻松与有趣~

接下来,我将带大家体验这个小程序,同时分享整个开发过程中使用的工具与技巧,仍然是 AI 项目开发的保姆级教程。
快来收藏,我们开始吧!
推荐观看视频版:https://bilibili.com/video/BV1yMn3zuE7L
项目体验
打开小程序,界面简洁且充满活力。点击开始学习,输入你希望学习的主题,比如 Java 基础。

AI 将根据主题自动生成相关知识问答卡片。

接着,你只需选择答案,无需担心出错,因为每道题都会附有解释,即使你对该主题一无所知,也能轻松学习。

除了技术知识外,你还可以探索更多主题,例如某个词汇、一部电影,甚至是某个人。

通过问答的形式,原本乏味的概念变得生动有趣,学习焦虑瞬间消失!
你还能查看自己的学习记录,复习或查看题解。

闲暇时随便刷一刷,你就能成为学习英雄!
开发实现
如果是以前,这种小程序可能需要几天才能完成。
但现在借助 TRAE IDE 的 AI 编程,我将带大家 无需编写一行代码 就能实现这个小程序。
开发步骤如下:
- 准备开发工具
- 需求分析
- 方案设计
- 服务集成
- 后端开发
- 前端开发
- 测试验证
- 持续优化
1、准备开发工具
既然采用 AI 开发,工具的选择至关重要。这次我使用的 AI 编程工具是 TRAE,因为最近它的 SOLO 模式非常火爆,我也想尝试一下。
SOLO 模式不同于传统的人为主导加 AI 辅助的编程方式,它允许 AI 主导任务并自动执行开发,只需提出一个想法,结合 AI 就能将其落到实处。

此外,进行前端项目开发时,必然需要 Node.js 环境;若要开发微信小程序,微信开发者工具 也是必不可少的,直接前往官方网站下载安装即可。

2、需求分析
工具准备就绪后,进入 Trae 的 SOLO 模式,打开一个比我的脸还干净的项目文件夹。

首先要进行需求分析。
无需想得太复杂,只需将自己的想法用自然语言表达给 AI 即可。
例如,我给 AI 提出了这样的需求:
你是一位专业的程序员,请帮我开发《学习英雄 - AI 问答引导式学习》微信小程序。用户可以自主设置一个想学习(或测验)的主题,由 AI 围绕主题生成若干个有趣的知识问答卡片,通过闯关答题的形式引导用户更轻松愉快地掌握知识。

AI 很快生成了详细的产品需求文档及技术架构文档,符合企业标准的开发流程。

显然 AI 迫不及待想要开始编码,但千万别急,务必先 仔细确认需求文档。
AI 的写作质量不错,但不一定完全符合我们的期望。因此,我们需要人工重点审视核心功能,去除不必要的附加功能,确保核心业务流程(P0 级需求)能够正常运行。

不要觉得这一环节麻烦,现在多花 1 分钟,以后能节省 1 小时!
必须明确需求,以防 AI 完成不该做的功能。
这里有一个小技巧,可以利用 TRAE 集成的 Figma 设计工具,获取一些免费的产品 UI 原型图。

你可以点击查看某个原型的具体设计,只要选中你喜欢的原型图,点击添加到对话中,TRAE 就会自动将原型图关联到发给 AI 的对话中,这种跨产品的互动我觉得还是蛮酷的(不过跟我学做项目的同学应该知道实现原理嘿嘿)。

不过生活总需要一些惊喜,因此我就让 AI 自由发挥,看看会有什么创意~
3、方案设计
接下来,我们要进行方案设计。这项工作原本是几万月薪架构师的职责,而现在我们让小 AI 来完成。
在撰写这段提示时,有几个细节必须特别关注,遵循简化开发原则,以避免 AI 将简单的任务复杂化。
我已经人工调整了产品需求文档,移除了很多不必要的功能。请你根据我人工修改过的需求,重新生成技术架构文档。要求:1. 禁止增加需求文档中没有提到的功能
2. 遵循最小化开发原则,以实现功能为主,禁止提供实现功能之外的扩展,比如部署、监控、限流等
3. 遵循前后端分离原则
不久,AI 就生成了完整的技术架构文档,涵盖了前后端技术选择、接口设计以及数据表结构等内容。

我建议能理解文档的朋友们多展现专业性,明确具体的技术选型,以确保 AI 生成的代码在可控范围内。例如,我清晰地指定项目将使用 Supabase 数据库,并通过 OpenRouter 接入 Gemini 大模型来提供 AI 服务。

这些到底是什么呢?
别担心,我们稍后会详细讲解。

即使你不太理解文档的内容,也无需担心。你可以设想自己是一个老板或产品经理,当程序员同事辛苦准备了技术方案呈现给你时,你就可以说:“实现的细节我不关心,这个需求明天必须上线!”这样就可以让他尽情去执行了。
要相信 AI,相信信念的力量!~
4、服务集成
在方案设计完成后,正式进入开发之前,我们还需要准备项目所依赖的服务。
用户数据应该存储在哪里?如何让程序与 AI 大模型进行对接?
这些都是需要我们解决的问题。
相较于手动安装服务,直接利用 TRAE 提供的集成功能,可以省去查阅官方文档的麻烦,傻瓜式安装即可。
我们将重点集成两项服务。

集成 Supabase
Supabase 是一个开源的后端即服务(BaaS)平台,提供数据库存储、用户认证、即时 API 等多项功能,能够帮助开发者快速构建和管理后端。

点击连接按钮,在弹出的页面中创建 Supabase 账号、组织,以及进行认证授权。

随后进入 TRAE,看到组织显示成功后,点击创建一个新项目,填写项目配置信息,然后点击创建。

项目创建完成后,回到 TRAE 刷新页面,点击连接即可,简单明了!~

之前的 AI Vibe Coding 让后端开发者倍感轻松,而这次可以说是前端开发者的福音,简单项目无需自己搭建后端了!~
集成 OpenRouter AI 服务
TRAE 支持多种 AI 服务的集成,我选择了 OpenRouter,它的优势在于可以通过统一的 API 接入多家大模型,如 Gemini、GPT、Claude 等等。

首先访问官网注册并登录账号,接着进入 API Keys 页面生成一个调用 AI 的密钥,在 TRAE 中进行配置并填写该密钥,AI 服务的集成就完成了。

但请注意,确保你的使用量充足,否则可能会导致调用失败,或是出现调用频率过高的错误。

集成 Stripe 支付服务
此外,你还可以集成 Stripe 支付服务,该服务能以最少的代码为产品增加支付和订阅功能。

只需先访问官网注册账号,系统会自动为你提供沙盒测试环境和相应的 API 密钥,你可以创建自己的产品并设置价格。

然后将这些信息填写到 TRAE 的配置中,后续在 AI 编程时就会生成与支付相关的代码。

不过由于微信小程序存在一些限制,这里暂时不进行接入,大家了解一下即可,网页端和 APP 接入依然非常方便。
5、后端开发
一切准备就绪后,我们终于进入紧张而刺激的开发阶段。
需要注意的是,由于 AI 的上下文是有限的,为了更好地生成完整项目、减少 Bug,建议分步进行:先生成后端代码,经过人工审核后,再着手生成前端代码。
好的,给 AI 输入提示词,开始后端开发,确保项目能够顺利运行:
请你基于最新的产品需求文档和技术架构文档进行开发,优先开发后端,确保项目可以正常运行
我们可以利用 TRAE 的提示词优化功能来一键优化输入。

确实比之前更加严谨。
点击执行,请开始你的 SOLO~ AI 将首先提供任务计划:

然后它会自动操作终端,执行命令、编写后端配置文件与业务逻辑代码、创建数据库表等,重要的步骤还会主动向我们确认,十分严谨。

不懂的也没关系,尽管让它去做吧~
在等待的同时,你可以查看一下编程导航,了解 免费的编程学习路线。TRAE 自带的消息通知功能会在 AI 完成任务后提醒我们。
我觉得 TRAE 对 AI 的调教还是相当有效的,它能自我验证程序的正常性。然而,由于我们尚未填写微信登录所需的信息,接口无法完整调用是正常现象。

经过一段时间,AI 完成了生成工作,不仅提供了代码,还贴心地生成了后端接口文档。

哎,这个东西真是很实用哦。
6、前端开发
接下来我们将进入前端开发的阶段。
在这一过程中,务必注意不要继续使用之前对话中的提示词。
原因是什么呢?
因为 AI 模型的上下文是有限的,之前的操作已经消耗了一部分上下文。为了避免 AI 在理解上下文时出现不足或混乱,建议在进行前端开发时重新开启一个新的对话,以便清晰地编写提示词。

在提示词中应包含产品需求文档、技术架构文档以及后端接口文档,这样可以帮助 AI 专注于生成前端代码。
你是一位专业的程序员,请帮我开发《学习英雄 - AI 问答引导式学习》微信小程序。用户可以自主设置一个想学习(或测验)的主题,由 AI 围绕主题生成若干个有趣的知识问答卡片,通过闯关答题的形式引导用户更轻松愉快地掌握知识。请你根据 @产品需求文档 @技术架构文档 @后端接口文档,帮我生成完整可运行的微信小程序前端代码。注意:1. 遵循最小功能原则,不要额外开发需求文档没提到的任何功能
2. 如果需要显示图片,请使用占位图片 picsum.photos 代替(比如 picsum.photos/200/300)
好了,开始执行吧!
在等待的同时,可以访问 面试鸭,看看免费的面试题和刷题路线。
经过一段时间,AI 成功生成了 20 多个文件,效果相当惊人!

虽然这种结果很让人兴奋,但说实话,我还是有些担心它是否能够正常运行。
7、测试验证
接下来我们进入令人期待的测试验证环节。
首先需要打开微信开发者工具,并导入已经准备好的项目文件夹,选择使用测试号进行开发和调试。

项目打开后,点击右上角的“测试号”,根据 文档 的指导获得测试号的 AppID 和 AppSecret 密钥:

随后需要手动将这些信息填入到后端配置文件中,否则微信登录将无法正常进行。

完成以上步骤后,我们便可以开始编译并运行项目了。
然而,果然出现了错误!

这在预料之中,小程序的开发相较于网页开发确实更具挑战性,毕竟微信开发者工具和相关文档都在不断更新。

但别担心,开发过程中总会遇到问题,解决方法其实很简单:无论报什么错,直接把错误信息反馈给 AI,让它来修复!
我遇到的几个典型问题包括:
1)图片路径错误:利用 TRAE 的提示优化功能,可以更有效地指导 AI 按照步骤修复 Bug。

2)登录失败:在开发者工具右上角点击“详情”,进入本地设置,勾选“不校验合法域名”。

3)接口路径问题:这通常是由于上下文过长造成的,只需让 AI 整体修复前端调用后端接口的路径和参数即可。

4)环境配置问题:代码中读取的环境变量名称与配置文件不一致,这个问题相对简单,可以手动调整。
当我输入一个字符后,编辑器会自动提示需要修改的代码,并支持跨行修改功能。

这就是 TRAE 提供的 CUE 功能,不仅能自动补全代码,还支持多行修改和预测未来可能的修改点,特别适合代码重构的场景,效率显著提高。

经过一段时间的修复,我们的小程序终于能够正常运行了。尽管现在的页面设计还有些粗糙,但只要核心业务流程能够顺利进行,用户就能正常使用,后续的优化将变得相对简单。

8、持续优化
最后,如果你准备将小程序上线,仍需花费一些时间进行优化。
记得在优化之前,先将现有代码利用 Git 版本控制工具进行托管,并提交一个基础版本,这样在后续的优化中如出现问题,可以轻松回滚到之前的版本。

例如,我就让 AI 帮助优化了整个小程序的样式风格,只需输入一段简单的提示词:
你是一位程序员,请你帮我优化整个小程序中每个前端页面和元素的样式风格,使各个页面保持一致。参考风格:主色调采用活力橙色,清新治愈的卡通风格、简约雅致、让人感到放松愉快。
然后借助 TRAE 的提示优化功能,就能够得到更详细的优化方案。

你可以根据需求进行调整,也可以让 AI 自行处理。
建议每次进行优化或添加新功能后,都提交一次代码,并适当开启新的 AI 对话框,以避免上下文过多影响生成的准确性。
最终,你看到的小程序就是我优化后的成品,效果还不错吧~

不过,由于目前在认证备案的过程中(已经在备案中),大家需要等一段时间才能体验到这个小程序。

总结
最后,谈谈我使用 TRAE SOLO 进行项目开发的体验。
首先,我感受到了 AI 编程工具的巨大进步,SOLO 已经从 将 AI 集成到开发工具中,发展为将开发工具融入到 AI 中。

开发工具似乎只是 AI 的一个工具,它可以自由操作编辑器、终端、浏览器、文档及集成服务等,独立完成任务,效率明显提升。此外,AI 还遵循企业的开发标准流程,能够自动修复大部分问题并检查项目的运行状态,而不像以前那样生成的代码常常无法正常运行。
不过,在开发过程中需要注意的是,AI 有时会将简单的问题复杂化,因此最好在确认需求文档和方案文档时由人工进行仔细审核,并像搭积木一样,一步一步地推进开发。
未来我会继续分享更多关于 AI 编程的技巧,毕竟 AI 只是一个工具,只有正确使用才能发挥其最大价值。
对 AI 感兴趣的朋友,可以在我们的 AI 导航 上找到丰富的学习资源、工具大全、提示词和最新资讯等。

更多资源
编程学习平台:编程导航:编程导航 – 为程序员提供一站式学习与交流的社区,成为您编程学习的向导
快速生成简历:老鱼简历:https://laoyujianli.com
✏️ 面试题库工具:面试鸭:https://mianshiya.com
AI 学习资源:AI 知识库:鱼皮 AI 导航|收录各类 AI 工具与提示词的专业学习资源

