字节出品！全自动生成前端页面、Controller、Service、Dao、Mapper、VO！强的可怕！

大家好，我是R哥。

在 AI 编程工具层出不穷的今天，大家都希望借助 AI 工具快速提升自己的开发效率，但市场上的 AI 编程工具通常要么费用高昂，要么功能鸡肋。

市面上也有不少 AI 编程插件，虽然号称能辅助开发，但真正上手后，你会发现，它们只会帮你写写函数、补补代码片段什么的，要完成复杂点的项目需求，根本难做到。

最近，字节跳动出手了，全新升级一个重量级的 AI 编程插件——Trae，听名字可能感觉还挺低调，但功能绝对让人眼前一亮。

首先，Trae 插件本身是完全免费的，不用订阅，大模型也是免费使用的，支持国内的 Doubao、Deepseek 大模型，同时支持市面上主流的 VS Code 和 JetBrains 插件。

Trae 背靠字节强大的 AI 能力和插件生态（特别是 Builder 功能支持），你只需要中文描述需求，Trae 就能一步步帮你生成项目结构、代码逻辑，甚至连 API 接口调用、页面 UI 都能帮你搞定。

所以说，在如今这个 AI 编程工具 “死贵” 的大环境下，Trae 插件就像一股清流，居然能完全免费使用，真是难得，既有大厂背书，真正一款国民级的 AI 编程插件。

Trae 插件官网地址：

https://sourl.cn/6Cj8fi

Trae 插件的安装和使用

插件安装

Trae 插件的前身是 豆包MarsCode 编程助手，现在品牌升级叫 Trae 了。Trae 插件提供以智能代码补全为代表的核心能力，支持主流编程语言及 IDE，能在编码过程中提供单行或整个函数的建议。

上面说了，Trae 支持市面上主流的 VS Code 和 JetBrains 插件，这里我介绍下如何安装 Trae 插件，以及基本操作使用。

Trae 插件下载地址：

https://sourl.cn/6Cj8fi

在 VS Code 中可以在扩展中快速搜索安装，首先在 VS Code 左侧导航栏上点击扩展面板，然后搜索 Trae，找到插件后点击 Install 安装即可。

我已经安装好了，如图所示：

JetBrains 也是一样，以 IntelliJ IDEA 为例，进入 Settings -> Plugins，然后搜索 Trae，找到插件后点击 Install 安装即可，如图所示：

安装插件后，重启 VS Code 或者 IntelliJ IDEA，然后再根据提示登录帐号，即可体验 Trae AI 编程插件。

基本使用

插件安装好了，我们就可以来体验下它的强大了：

如图所示，Trae 支持 Chat 和 Builder 两种工作模式。

Trae 和传统 AI 编程助手不同的是，就是它最近出的 Builder 模式，可以实现用自然语言从 0 到 1 搭建一个完整项目，这也是本文要介绍的重点。

Trae AI 编程助手和传统的 AI 编程助手一样，不仅支持代码生成，还支持以下几个快捷辅助功能：

• 代码解释：/explain
• 问题修复：/fix
• 注释代码：/doc
• 单测生成：/test

除了这些，像其他的技术问答什么的都是小儿科，你只要输入 "/" 符号就会弹出快捷用法，如图所示：

另外，还可以使用 "#" 符号来添加要引用的上下文：

我们可以添加代码符号、文件、文件夹、工作区代码作为上下文，比如，我们有时候想要引用某个文件，让 AI 针对这个文件中的代码进行解读、修改等操作，让 AI 更精准的理解我们的意图。

点击插件右下角可以切换模型，目前支持以下几种模型：

主要是国内的豆包和 Deepseek 模型，非常意外的是，这些模型居然都是免费使用的，不用自己去官方申请 API Key，也不用充值，字节这波操作真的太良心了。

学会这些基操，就能助我们快速提升编码效率与质量，当然，这不是本文要介绍的重点，本文重点介绍下最近出的 Builder 模式，使用自然语言全自动完成任务，这才是 AI 编程工具的灵魂所在。

开发实战

本文我会站在小白的角度，重点介绍一下如何通过 Builder 模式，使用自然语言来开发前端页面、后端接口，适合对前端能力欠缺的后端人员，或者想快速实现后端功能的后端开发人员。

首先我会以 VS Code 来开发登录、退出功能，然后再以 IntelliJ IDEA 导入并解读项目，在此基础上再加一个美化首页功能。

Builder 功能介绍

Builder 模式相当于一个 Agent，除了 Chat 中的已有功能，它还会自主完成任务，只需要使用自然语言，它便可以从 0 到 1 开发一个完整的项目/功能，包括项目结构、代码文件什么的，一步创建到位。

切换为 Builder 模式：

在 Builder 模式下，AI 助手在回答时会根据需求调用不同的工具，包括分析代码文件的工具、编辑代码文件的工具、运行命令的工具等等，从而让回答更精确、更有效。

如下图所示，Builder 模式可以快速从 0 到 1，自主拆解需求并自动完成多轮编码任务：

Builder 的工作流程包括以下几步：

• 拆解步骤执行；
• 自动提取仓库级上下文；
• 自动创建/修改代码文件
• 自动生成并运行终端命令；
• 自动分析命令运行状态。

说白了，AI 助手会主动读取当前项目中的文件内容，拆解任务并逐步执行，从自动创建文件到最后生成并执行命令、预览等，强的可怕，这相当于一个有独立思考能力的程序员了。

从 0 开发一个登录功能

说了这么多，你如果还不知道 Builder 模式的强大，那我就来用它实现一个登录需求吧，让大家对对 Builder 模式有更深刻的理解。

我来用 Trae 插件实现以下需求：

• 登录页面：适合前端小白或者 0 编程基础的人。
• 登录接口：适合专业后端人员，实现快速编程。

挑战使用 Trae 插件，全程使用自然语言来完成这个需求。

开发详细过程

向 Builder 窗口发送以下指令：

实现一个登录功能，包括前端登录页面（login.html），页面上面有用户名、密码、验证码，这些都是必填项，还有登录、重置按钮，当点击登录时需要后端接口支持，后端使用java spring boot 项目，并使用thymeleaf模板来渲染，登录成功后跳到首页（index.html），首页上面显示登录的用户名。

输入指令后，它就会自己工作，自己创建目录和文件，过程中我们只需要点「全部采纳」或者「全部拒绝」按钮即可。

如图所示，它已经创建了一些文件，但没有生成后端相关的类，因为我给的指令不是很全，所以我还得继续向它发送指令，这次我把数据库信息都给它了：

\# LoginController.java 登录接口请使用spring data jpa来实现，请生成对应的service、dao、entity类，查询mysql javastack库t_user表中的信息来验证登录信息是否正确，数据库信息为localhost,root,12345678；

注意，我这里使用 # 号来引用了 LoginController.java 文件：

篇幅有限，更多对话略...

大概在经过 10 几个回合的沟通后，轻松搞定了一个包含前后端的完整登录功能。

这是一个标准的 Spring Boot + Maven 项目，也采用了标准的三层架构，工程层次结构清晰、合理，命名也非常规范，能实现这个水平，我已经非常满意了。

当检查项目准备就绪后，它会自己弹出运行项目，也可以向它发送「运行这个项目」的指令来运行项目，运行完后，还会弹出是否预览项目，点「预览」按钮即可预览项目：

当然，我们也可以通过访问 localhost:8080 来访问项目：

没想到，虽然页面是粗陋了点，但项目运行还挺顺利，页面上的控件有完整性和正确性检测，这个出乎我的意料。

开发退出功能

登录功能可以正常使用，但是没有退出功能，现在我继续让它添加退出功能，发送以下指令：

在首页顶部右侧添加一个退出功能，后端接口也要实现会话退出，退出后跳到登录接口。

点击「全部采纳」按钮后，再重新运行项目并登录：

如图所示，已经按我的要求添加了退出功能了，测试也成功跳转到了登录页面。

下面是完整的登录、退出流程效果演示：

测试了成功登录并退出，也测试了用户名、密码、验证码错误的场景。

还想添加什么功能，直接向 Builder 模式发送指令就好了。

美化首页 UI

上面的功能都是用 VS Code 的 Trae 插件开发的，下在我再来用 IntelliJ IDEA 的 Trae 插件来美化一下首页功能，索引并解读现有的项目也是 Trae 插件 Builder 模式的主要亮点之一。

首先打开 IntelliJ IDEA 并导入 VS Code 创建的项目：

我来问下它：

现有的项目都有哪些功能？

这是它的解读：

通过查看项目代码结构、关键文件、依赖配置和前端模板文件，总结出项目现有功能如下：

1. 定义了用户实体类 User，包含用户名、密码等属性；
2. 提供用户仓库接口 UserRepository，支持根据用户名和密码查询用户；
3. 配置了 MySQL 数据库连接；
4. 实现了用户登录和退出功能，登录页面包含验证码验证；
5. 提供登录后的首页，显示当前用户信息。

没毛病，就是首页有点太简洁了，我让它再继续美化一下首页吧，发送以下指令：

\# index.html 美化一下首页，在居中位置添加一个“网站正在维护”的字样及图标，美观大气。

再在 IntelliJ IDEA 中启动项目，最终效果如下：

Builder 模式的体验就到这了，虽然前端页面还是丑了点，但这并不是问题，因为我给的信息太少了，我完全有信心通过接下来的对话来丰富成我想要的样子。

使用 Builder 模式，最好把大任务拆解成小任务、步骤化、细节化，比如：1、2、3、4，...，然后再分步去完成任务，这样完成的任务会更接近我们想要的效果。

回退历史版本

除了正常的操作，你可以将项目回退到指定会话轮次发起前的版本，如图所示：

首先确认本次回退的影响范围，若本次回退符合预期，点击「确认」按钮后，Builder 便开始回退项目。

需要注意的是：

• 回退操作不可撤销；
• 仅支持在最近活跃的 Builder 窗口中回退版本；
• 仅支持回退至最近 10 轮会话内的版本。

管理历史会话

如果开启了多个会话，点击右上角的「历史会话」按钮，打开「历史会话」面板，该面板展示 Chat 模式和 Builder 模式的所有对话记录，如图所示：

点击对应的对话条目，可以查看某轮具体的历史对话详情，将鼠标悬浮至某条对话，然后点击右侧的「删除」图标可以删除对话，

Builder 与 Chat 的差异

虽然 Trae 的 Chat 和 Builder 模式看上去都能干活，但通过本文的实战介绍，可以看出它俩其实是两个完全不同的物种，有着明显的区别和适用场景。

Chat 模式是传统的对话式 AI 助手，你问一句，它答一句。你可以让它补全代码，解释代码，或者帮你找 bug，总之就是问什么答什么，每次都是一次性服务，需要你自己掌握节奏和细节。

Builder 模式它是全自动型的 AI 助手，你只需要告诉它想要的功能，Builder 会自己规划、自己动手，不仅能写代码，还能自己创建目录、编辑文件、执行命令，甚至根据上下文自主调整步骤。

比如前面我们开发登录功能，如果用 Chat，你得自己一步步问它怎么写 Controller、Service、Dao、Entity 类，还得自己手动建文件。而用 Builder，直接一句话搞定大部分工作，效率起飞！

所以，一般情况下可以这样区分使用场景：

• 日常编程、小功能修改 → 用 Chat；
• 需要系统搭建、复杂功能实现 → 用 Builder。

说白了，Chat 如果是秘书，Builder 就是助理工程师！

总结

聊了这么多，相信大家对 Trae 及 Builder 模式有了深刻的理解了吧？

下面我再来总结一下 Trae 插件它到底牛在哪！

1、大厂出品！插件免费！模型免费！

不像那些国外插件，突然封号了、限流了，Trae 是正儿八经国产大厂字节背书，实力强悍，服务器稳定，体验更好更流畅，长远来看更靠谱。

在一众又贵又复杂的 AI 编程工具里，Trae 作为字节出品，竟然提供了完全免费的工具，连大模型调用都免费，支持主流 Doubao 和 Deepseek，而且不用自己搞什么 API Key，开箱即用，非常友好。

2、双模式切换，自然语言开发全自动化！

小修小补时用 Chat，大项目从 0 到 1，用 Builder，一键切换，场景适配灵活，极大提升开发效率。

有了强大的 Builder 功能，就算你是前端小白、后端新手，只要能打字，会说人话，就能用 Trae 搞出一个网页、小程序、系统等等。不需要懂前端、不需要深度研究项目结构，AI 全程陪跑。

Trae 真正实现了从自然语言到代码落地的全流程自动化！

3、不再恐惧新项目，快速上手一个新项目！

很多人一换新工作，一入职新公司，面对陌生项目，代码又多又乱，光是理解业务逻辑就要半条命，别说动手敲代码了，这也是这么多人恐惧入职新公司的原因，怕跟不节奏被开。

而 Trae 提供了 Builder 模式，可以直接帮你梳理项目结构，理解模块职责，生成标准样板代码，这对新人来说，简直是救命稻草。

还有更多非常实用的功能，篇幅有限，就不多介绍了，用了就知道 Trae 有多香了，赶紧去试试吧！

相信我，用上 Trae AI 编程插件，你会体验到一种程序员效率起飞的新感觉！

最后，我再把 Trae 官网和插件地址送上：

• 官网：https://sourl.cn/tBfeEK
• 插件下载：https://sourl.cn/6Cj8fi

更多文章推荐：

1.Spring Boot 3.x 教程，太全了！

2.3,000+ 道 Java面试题及答案整理(最新版)

3.免费获取 IDEA 激活码的 7 种方式（最新版）

4.Java & DeepSeek & AI 学习资料分享

5.程序员精美简历模板分享

觉得不错，别忘了随手点赞+转发哦！