1. 安装腾讯AICodeIDE
前言
CodeBuddy IDE 构建一个产品、设计、研发无缝协作的共生环境。通过将 AI 深度融入从需求规划、产品设计到代码开发的全流程，实现从一个从想法到产品发布的一站式高效交付平台。
1. 产品阶段：从想法到需求
- 只需用自然语言描述产品构思，AI 即可自主进行深度需求理解和分析，自动生成结构化需求文档（PRD）。
2. 设计阶段：从需求到设计稿
- 产品原型/设计生成
- 自然语言生成：通过需求描述快速将抽象文字转化为可交互产品原型。
- 图像化生成：支持上传手绘草图或参考图，智能识别图像并生成高保真设计稿。
- 组件化生成：基于组件库（已内置 TDesign、MUI、Shadcn，持续更新中），快速拼装生成符合规范的设计稿。
- AI 视觉优化
- 通过自然语言指令（例如”让风格更具科技感“、”将按钮转成蓝色“）对产品原型/设计稿进行实时优化。
3. 研发与部署阶段：从设计稿到代码
- 设计稿一键转代码
- 内置了 Figma，直接将设计稿快速转化为前后端可维护代码，打通从设计到研发的”最后一公里“。
安装好后，在左侧的工具栏中，可以看到 CodeBuddy 的工具，包括需求分析、设计稿生成、代码生成等。
2. 在CodeBuddy中使用MCP
前言
codebuddy 是一个AI的IDE，和Cursor/VSCode/Trea 等工具一样，可以通过LLM进行代码的生成和编辑。
接下来，我们讲解在codebuddy中使用MCP的步骤。
1. 打开左侧的设置，在设置中找到MCP的设置，点击进入MCP的设置页面。
2. 可以使用MCP仓库中下载MCP服务，也可以自己添加对应的服务，本节我们手动添加MCP服务。
思考：如果没有MCP服务，我们问大模型：我从湖南女子学院南院到湖南大学有哪些充电站
这时候，大模型大概会检索网络（因为可能大模型训练的时候，并没有最新的数据），可能借助网络检索的方式，返回结果。 如下：👇
起点附近充电站（湖南女子学院南院）
地址： 长沙市雨花区中意一路160号
湖南女子学院校内充电站
学校正在进行充电桩建设与运营项目招标
包含新能源汽车和电动单车充电桩
建成后师生可在校内充电
雨花区周边充电站
特来电充电站（长沙兴威名座大厦）
地址：雨花区韶山北路460号
月雅苑小区充电站
地址：雨花区月雅苑小区
18台有序充电桩，功率1.3-7千瓦可调
沿途充电站推荐路线
从雨花区中意一路到岳麓区湖南大学，主要沿以下路线行驶会有充电站：
枫林三路沿线
极氪能源汽车充电站（长沙麓云广场轻充站）
地址：湘江新区天顶街道枫林三路COFOLAND海梦岛社区
岳麓区核心区域
平高易电湖南平高园区充电站
地址：岳麓区谷虹路平高开关科技园
小桔充电充电站（长沙市岳麓区麓谷新世界站）
地址：岳麓区麓谷新世界停车场
国家电网充电站（东方红路公交首末站）
地址：岳麓区东方红中路
终点附近充电站（湖南大学）
地址： 长沙市岳麓区麓山南路
极氪超级充电桩群
地址：岳麓区观沙路24号品生活汇B2停车场
距离湖南大学约2公里
驱动源24品生活中心充电站
地址：岳麓区24品生活中心B1停车场
依威能源充电站（谷山商业街）
地址：岳麓区银杉路619号谷山商业街
充电站品牌推荐
特来电：覆盖面广，APP操作便捷
国家电网：可靠性高，充电功率稳定
极氪能源：快充技术好，充电效率高
小桔充电：价格相对优惠
建议您使用特来电、星星充电等APP提前查看充电站实时状态，确保有可用充电桩。大部分充电站支持扫码充电，建议提前下载相关APP注册。你很容易发现，大模型返回的结果，是基于网络检索的，整理好的，可能不是最新数据。
- 在MCP的设置页面中,添加MCP服务。 在弹出的settings.json中，添加如下内容：
{
"mcpServers": {
"xdt-charge-station": {
"command": "npx",
"args": [
"-y",
"@longshine-ai/xdt"
],
"disabled": true
}
}
}上面这个服务其实就是查询附近充电桩的工具，这个服务能够和大模型进行通讯，返回结果。
配置如下：👇
配置成功后，在codebuddy中，可以使用xdt-charge-station这个服务了。
- 在codebuddy中，使用xdt-charge-station这个服务。
📍 起点附近充电站（湖南女子学院南院）
位置： 长沙市雨花区中意一路160号
1. 长沙高升金典轻充站 ⭐推荐
距离： 637米
地址： 雨花区湘府中路99号高升金典小区东门地下停车场
运营商： 极氪能源
充电桩： 6个交流充电桩
停车优惠： 充电满10分钟减免停车2小时
营业时间： 24小时
2. 小鹏S4超快充 长沙融程花园酒店站 ⚡超充
距离： 862米
地址： 雨花区井湾子街道融程花园酒店
运营商： 小鹏超充
停车优惠： 充电满10度免停2小时
营业时间： 24小时
3. 天心区大润发充电站 🏬商场充电
距离： 1.3公里
地址： 天心区大润发
运营商： 爱速
充电桩： 24个直流充电桩（快充）
营业时间： 24小时
📍 终点附近充电站（湖南大学）
位置： 长沙市岳麓区麓山南路
1. 桔子洲街道办事处充电站 🏛️政府站点
距离： 1.3公里
地址： 岳麓区桔子洲街道办事处
运营商： 蔚景云
充电桩： 5个交流充电桩
营业时间： 24小时
2. 理想5C超充站 长沙岳麓东麟阁酒店 ⚡超充推荐
距离： 2.5公里
地址： 岳麓区东麟阁大酒店
运营商： 北京车和家能源科技
停车优惠： 充电减免2小时停车，之后每小时10元
营业时间： 24小时
3. 长沙海信广场 蔚来充电站 🛍️购物中心
距离： 2.9公里
地址： 海信广场长沙店
运营商： 蔚来能源
充电桩： 7个交流充电桩
停车政策： 30分钟免费，超过10元/小时
营业时间： 24小时
🚗 推荐路线充电策略
方案一：起点充电出发
在长沙高升金典轻充站或小鹏S4超充站充满后出发，到湖南大学后使用桔子洲街道办事处充电站。
方案二：终点充电
直接到湖南大学后在理想5C超充站或长沙海信广场蔚来充电站充电。
💡 充电建议
快速充电： 选择小鹏超充站或理想5C超充站
经济实惠： 选择极氪能源或蔚景云充电站
购物充电： 选择大润发或海信广场，充电同时可以购物
停车优惠： 大部分站点都有充电减免停车费的政策
建议出发前通过相应运营商的APP查看实时充电桩状态，避免排队等待。对比之前的结果，可以发现，这次的结果准确性和可行性更强！！！
3. 开发一个静态网页并且部署到公共服务器
前言
开发一个静态页面并且部署到公共服务器，可以通过url进行访问。
完成这个功能，需要以下资源：
- 静态页面
- 公共服务器
- 部署技能
大概要花费半天的时间。
但是有了MCP服务，一切非常简单。 👇
在settings.json中，添加如下内容, 注意层级和逗号 ：
"edgeone-pages-mcp": {
"command": "npx",
"args": [
"edgeone-pages-mcp"
],
"disabled": true
}
你会发现，只需要输入需求，MCP就会自动帮你生成代码，部署到服务器上，然后返回一个url，你只需要把这个url复制到浏览器中，就可以访问了。
4. 开发一个充电站的网页展示
前言
将 湖南女子学院到长沙汽车西站的充电站，并且绘制成路线图 返回一个url，并且在浏览器中打开。如下：👇
怎么做尼？ 请看老师演示！！！！
完成后，是不是非常简单？，那就开发一个移动端的游戏吧！！！
5. 大模型直接操作数据库
前言
如果你有想让大模型操控数据库的需求，那 MySQL MCP 绝对不能错过。
在 Cursor 中直接操作本地或者远程数据库，只需要简单配置如下：
1. 首先使用Anaconda安装mysql-mcp-server
pip install mysql-mcp-server -i https://pypi.tuna.tsinghua.edu.cn/simple使用清华源安装，国内速度更快
2. 然后在COdeBuddy中，使用MCP服务，配置如下：
"MySQL": {
"disabled": false,
"timeout": 60,
"command": "npx",
"args": [
"mcprunner",
"MYSQL_HOST=127.0.0.1",
"MYSQL_PORT=3306",
"MYSQL_USER=root",
"MYSQL_PASS=1234",
"MYSQL_DB=tlias",
"ALLOW_INSERT_OPERATION=true",
"ALLOW_UPDATE_OPERATION=true",
"ALLOW_DELETE_OPERATION=false",
"--",
"npx",
"-y",
"@benborla29/mcp-server-mysql"
]
}MYSQL_HOST 是数据库的地址
MYSQL_PORT 是数据库的端口
MYSQL_USER 是数据库的用户名
MYSQL_PASS 是数据库的密码
MYSQL_DB 是数据库的名称
ALLOW_INSERT_OPERATION 是是否允许插入操作
ALLOW_UPDATE_OPERATION 是是否允许更新操作
ALLOW_DELETE_OPERATION 是是否允许删除操作
3. 开启此MCP服务后，点击刷新按钮，如果显示绿点，表示可以正常使用。
4. 接下来，就既可以在CodeBuddy的对话框中，直接操作数据库了。
6. 开发一个基于充电站，高德地图，在线部署的自驾旅游网页
前言
接下来我们开发一个基于充电站，高德地图，在线部署的自驾旅游网页。
1. 充电站的mcp上面已经配置好了，直接使用。接下来，我们需要配置高德地图的mcp。
"amap-amap-sse": {
"url": "https://mcp.amap.com/sse?key=你在高德地图申请的key",
"disabled": true
}2. 从上述的配置中，我们需要在高德开发平台中，申请一个key，然后在settings.json中配置。
高德开发平台：https://console.amap.com/dev/key/app
3. 点击刷新按钮测试，如果显示绿点，表示可以正常使用。
4.点击上面的+号，新建一个窗口，开始和大模型对话，开发一个基于充电站，高德地图，在线部署的自驾旅游网页。
我在长沙，要自驾电车，12.15日去惠州双月湾海边游玩，帮我筛选附近的酒店。要求如下：
1.帮我找到符合要求的5个酒店作为参考，要求，距离最近的海滩打车20分钟以内范围，价格在400-500之间
2.帮我整理前往目的地的最佳的路线和充电站，以防高速没电
2.帮制作各个酒店到到最近海滩的路线图（自定义绘制路线和位置，不是之间嵌入PC地图，以打车后的路线为标记），用不同颜色的绘制在一个网页地图中，行程规划结果在实际高德地图app展示，并集成到h5页面中。。
3.网页使用简约美观页面风格，5个酒店的图片以卡片展示。
4.调用高德MCP工具，获取并打开专属地图链接
5.我的高德key为：9aec这里使用你自己的高德KEy
6.生成网页后，上传到 edgeone-pages-mcp 返回一个url，并且在浏览器中打开。
## 基本要求
** 尺寸与基础结构 **
- 打印友好的配色方案，避免过深的背景色和过小的字体
** 技术实现 **
- 使用打印友好的CSS设计
- 提供专用的打印按钮，优化打印样式
- 使用高对比度的配色方案，确保打印后清晰可读
- 使用Google Fonts或其他CDN加载适合的现代字体
- 引用Font Awesome提供图标支持
** 专业设计技巧 **
- 使用简明的图示代替冗长文字描述
- 为重要信息添加视觉强调（如框线、加粗、不同颜色等）
- 在设计中融入城市地标元素作为装饰，增强辨识度
## 设计风格
- ** 实用为主的工具风格 ** ：以清晰的信息呈现为首要目标
- ** 专业旅行指南风格 ** ：参考Lonely Planet等专业旅游指南的排版和布局
- ** 信息图表风格 ** ：将复杂行程转化为直观的图表和时间轴
- ** 简约现代设计 ** ：干净的线条、充分的留白和清晰的层次结构
- ** 整洁的表格布局 ** ：使用表格组织景点、活动和时间信息
- ** 地图元素整合 ** ：在合适位置添加简化的路线或位置示意图将上面的提示词，上传到CodeBuddy中，点击运行，等待大模型生成结果... 👇
