qidao123.com技术社区-IT企服评测·应用市场

标题: 字节出品！全自动天生前端页面、Controller、Service、Dao、Mapper、VO！强的可怕！ [打印本页]
作者: 火影    时间: 5 天前
标题: 字节出品！全自动天生前端页面、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 编程助手一样，不但支持代码天生，还支持以下几个快捷辅助功能：
除了这些，像其他的技能问答什么的都是小儿科，你只要输入 "/" 符号就会弹出快捷用法，如图所示：

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

我们可以添加代码符号、文件、文件夹、工作区代码作为上下文，好比，我们有时间想要引用某个文件，让 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 插件实现以下需求：
挑战利用 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 创建的项目：

我来问下它：
现有的项目都有哪些功能？

这是它的解读：
通过查看项目代码结构、关键文件、依赖配置和前端模板文件，总结出项目现有功能如下：
没弊端，就是首页有点太简洁了，我让它再继续美化一下首页吧，发送以下指令：
# index.html 美化一下首页，在居中位置添加一个“网站正在维护”的字样及图标，雅观大气。

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

Builder 模式的体验就到这了，虽然前端页面还是丑了点，但这并不是问题，因为我给的信息太少了，我完全有信心通过接下来的对话来丰富成我想要的样子。
利用 Builder 模式，最好把大任务拆解成小任务、步调化、细节化，好比：1、2、3、4，...，然后再分步去完成任务，如许完成的任务会更靠近我们想要的效果。
回退历史版本

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

首先确认本次回退的影响范围，若本次回退符合预期，点击「确认」按钮后，Builder 便开始回退项目。
需要注意的是：
管理历史会话

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

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

虽然 Trae 的 Chat 和 Builder 模式看上去都醒目活，但通过本文的实战先容，可以看出它俩其实是两个完全不同的物种，有着显着的区别和适用场景。
Chat 模式是传统的对话式 AI 助手，你问一句，它答一句。你可以让它补全代码，解释代码，或者帮你找 bug，总之就是问什么答什么，每次都是一次性服务，需要你自己把握节奏和细节。
Builder 模式它是全自动型的 AI 助手，你只需要告诉它想要的功能，Builder 会自己规划、自己动手，不但能写代码，还能自己创建目录、编辑文件、执行命令，甚至根据上下文自主调整步调。
好比前面我们开发登录功能，如果用 Chat，你得自己一步步问它怎么写 Controller、Service、Dao、Entity 类，还得自己手动建文件。而用 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 官网和插件地址送上：
更多文章推荐：
1.Spring Boot 3.x 教程，太全了！
2.3,000+ 道 Java面试题及答案整理(最新版)
3.免费获取 IDEA 激活码的 7 种方式（最新版）
4.Java & DeepSeek & AI 学习资料分享
5.步伐员精美简历模板分享
觉得不错，别忘了随手点赞+转发哦！

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。



欢迎光临 qidao123.com技术社区-IT企服评测·应用市场 (https://dis.qidao123.com/) Powered by Discuz! X3.4