codeBuddy IDE 使用教程
AI编程工具codeBuddy喂饭级教程来了
一、常用的AI编程工具简介
名称 | 特点 | 使用场景 |
cursor | 独立IDE，内置GPT-4，可自然语言修改代码，收费 | 新项目开发，重构 |
Trace | 字节出品，免费使用 | 新项目开发，重构 |
CodeBuddy | 腾讯云出品，目前有免费版 | 工程级代码生成，支持MCP协议，适合复杂项目 |
Gemimi Cli | Google Gemini 模型的终端接口，轻量快速 | 快速原型验证 |
CopilotCodePro | 公司的AI编程助手，可集成在vscode中 | 支持思维连和工程级别修改 |
Claude code | 集成在终端的AI编程助手 | 可以完成需求->代码->测试->重构->发布的完整链路 |
codeBuddy IDE是腾讯最近刚出的全球首个产研一体AI全栈高级工程师，相当于从设计 –>实现->部署一站式开发
一、codeBuddy详解
（1）支持Claude/GPT/混元/DeepSeek等国内外主流模型
（2）支持将想法生成规范严格的需求文档和执行计划
（3）支持将创意转成组件化、规范化、可交互的设计稿
（4）深度集成Figma设计工具，一键生成高保真页面
（5）内置腾讯云开发和Subpabase后端服务，自动配置
（6）一键部署到远端Cloud Studio 沙箱环境，即刻分享
三、下载
打开官网:https://www.codebuddy.ai，点击中间的 Download the lDE 进行下载。
四、注册账号
1、点击首页右上角，个人图标，注册账号
2、填写表单
3、注册成功，ide登录账号，登录成功，跳出输入邀请码的界面
五、语言设置
第一步:点击右上角的设置按钮
第二步:点击 Features
第三部:切换 English 切换为 中文
设置完语言后，在桌面创建一个文件夹，把文件夹拖入，codeBuddy，整体界面的风格如下：
六、页面功能
1、Figma 选择
点击 Figma 会打开左侧的预览区域，并打开 Figma 网站,这直接省去了，我们再去浏览器打开网站的步骤
选择谷歌账号登录
可以选择其他方式，使用密码登录
导入 Figma 就可以进行根据 UI 开发
2、选择组件
鼠标悬浮选择组件图标，可以看到有三种组件
1）TDesign Components
官网:https://tdesign.tencent.com/
腾讯家自己的 UI组件库，有 PC 端、移动端、小程序组件，整体感觉现代、简约风格,支持 vue、React、小程序、QQ 小程序。
2) MUl Components
官网:https://mui.com/
Material-UI(现在更名为 MUI)是一个基于 Google Material Design 设计规范构建的 React UI 组件库，主要是一个 React UI 组件库，专为 React 应用构建的组件库。
3)Shadcn Components
颜色没有那么的丰富，看起来比较简洁和极简，使用自定义和扩展比较方便
4、配置集成
可以直接数据库进行配置，存储数据，不用自己再去做后端那一套。
鼠标浮上去，会显示当前连接了什么数据看，点击右上角的设置按钮
可以选择 Supabase 和 Tencent CloudBase 两个数据库。
5、配置 MCP
6、上传图片
7、预览
直接会运行，你当前打开的这个项目，在编译器里进行运行，不用在打开浏览器查看效果
8、部署
9、两种对话模式切换
Design Mode 和 Plan Mode
这两个模式，只有在Craft模式下才有
- 设计模式(Design Mode):专注于 UI 界面实现
主要功能:创建可视化的用户界面
技术栈:固定使用 React+ Shadcn UI+ TypeScript输出结果:可运行的前端页面和组件。
工作流程
理解UI需求 →2.设计界面布局 →3.创建React项目→4，实现具体组件 →5.预览效果
适用场景:
快速原型制作
UI 组件开发
页面布局设计
前端界面实现
- 规划模式(Plan Mode):专注于项目规划和架构设计
主要功能:分析需求、制定计划、跟踪进度技术栈:不限制，根据需求选择最适合的技术输出结果:项目规划、技术方案、开发计划’工作流程
1、 需求分析→ 2.技术选型 →3.架构设计 →4.制定计划 →5.跟踪执行
适用场景:
复杂项目规划
技术架构设计
开发进度管理
多技术栈项目
10、Boost Prompt
AI 提示增强技术，这个功能可以帮你进行优化提示词
核心功能
提示优化-自动改进和优化输入的提示词，使其更加精确和有效上下文增强-为提示添加相关背景信息和上下文，提高 AI 理解准确性结构化处理-将模糊的需求转换为结构化、逻辑清晰的指令多轮对话优化-在对话过程中持续优化提示效果
主要作用
提高响应质量-通过优化提示获得更准确、更相关的 AI 回答减少误解-明确表达意图，降低 AI 理解偏差节省时间-避免反复修改提示词的时间成本增强专业性-针对特定领域自动添加专业术语和背景