> ## Documentation Index
> Fetch the complete documentation index at: https://docs.coze.cn/llms.txt
> Use this file to discover all available pages before exploring further.

你可以使用扣子编程开发插件把想法做成可运行的应用，比如个人网站、报名小程序、记账工具等。

## 编程开发插件是什么 {#hyRGGFFql}

[编程开发插件](https://www.coze.cn/skills?tab=space&capability=plugin&plugin_share_pid=7676005249643053066)适用于更完整的工程化开发场景，支持开发网站、App 和小程序。

扣子编程开发插件基于扣子编程（[code.coze.cn](https://code.coze.cn/home)）提供。扣子编程是一个 AI 编程开发环境，提供代码编写、项目运行、预览调试等基础能力，带来开箱即用的开发体验。编程开发插件则为 Agent 提供预置编程技能，包括应用开发、小程序开发、素材生成、音频处理、网页内容读取、数据存储、模型调用等能力。Agent 会根据技能指引，完成从需求理解、功能开发、运行预览到持续迭代的流程。

当你需要做的是较为完整的应用项目，例如包含多页面结构、复杂交互、数据管理、登录权限、文件上传、接口调用等功能，建议使用**编程开发插件**。该类项目支持通过部署运维插件发布上线。

如果只是想快速生成个人主页、活动介绍页、产品介绍页、简单落地页等内容展示型页面，可以使用扣子内置的 **Pages 插件**。

## 能帮你做什么 {#hq24F8rup}

添加编程开发插件后，你可以用自然语言描述想做的网站、小程序或 App。Agent 会帮你规划页面、功能和数据逻辑，编写代码，运行项目并自检结果，完成后返回预览链接。后续你也可以继续让 Agent 修改页面、修复问题，并在确认后部署上线。

* **从一句想法开始开发**：比如“做一个旅行攻略网站”或“做一个报名小程序”。Agent 会把想法拆成页面、交互和基础功能，并开始开发。
* **参考图片或资料开发**：你可以上传参考页面、设计截图、产品文案、表格数据等资料。Agent 会参考这些内容，处理页面结构、视觉风格和功能细节。
* **边预览边迭代**：开发完成后，Agent 会发送预览链接。你可以打开查看效果，再继续提出修改，比如调整样式、补功能、优化交互或修复问题。
* **接入集成服务**：如果应用需要保存数据、上传文件、账号登录、联网搜索、内容处理或调用 AI 能力，可以让 Agent 接入对应的内置集成服务。当前支持的内置集成包括大语言模型、生图大模型、视频生成大模型、语音大模型、向量大模型、联网搜索、内容处理、数据库、对象存储和 Auth 登录认证等。缺少必要配置时，Agent 会提示你补齐。

## 支持的项目类型 {#hsJFB9gaV}

目前，编程开发插件主要支持以下类型：

* 网页项目
* App 项目
* 小程序项目

## 开发一个网页应用 {#ht54PE3fl}

第一次制作网页应用时，不需要先准备技术方案。你只要说清楚使用场景和核心功能，Agent 就可以先做出一个可预览的版本。

1. 下载并安装[扣子桌面端](https://docs.coze.cn/what_is_coze#1ad3c90d)，或访问[扣子网页端](https://www.coze.cn/?surl_token=FJvCs&zlink_code=FFKdE&utm_medium=docs&utm_source=docs&utm_content=landingpage&utm_id=&utm_campaign=&utm_term=docs&utm_source_platform=)。
2. 添加编程开发插件。
   在某个 Agent 中首次使用编程开发插件时，需要先添加。
3. 打开你要使用的 Agent，在对话框中单击➕，选择**插件** > **添加插件**。
4. 找到**编程开发插件**，单击**添加**。
5. 在 Agent 对话框中，输入 **@** ，选择**编程开发插件**。
6. 在对话框输入你的开发需求。
   你需要尽可能清晰且详细地描述应用的功能、界面设计、业务逻辑等方面的要求。你也可以酌情上传一些图片或文件，作为附加信息提供给扣子 AI，以便扣子 AI 能更理解你的需求。例如上传一张你想参考的网站截图、想要的风格示例图片等，这些都能帮助扣子 AI 更精准地把握细节要求。
   例如，你可以输入以下提示：
   ```Plain Text
   @编程开发插件 帮我开发一个旅行攻略网站。用户可以输入旅行目的地、出发日期、旅行天数和预算，点击生成后，网站展示每日行程安排、推荐景点及图片、预计费用、交通建议和行李清单，页面风格清爽。
   ```
7. 澄清你的需求。
   如果 Agent 判断当前需求还不够明确，会在对话中继续追问。你可以根据提示补充关键信息，比如页面风格、用户角色、核心流程、数据来源或参考资料。例如，你只说“开发一个公司官网”，Agent 可能会继续询问公司名称、所属行业、核心业务、品牌材料或参考风格等信息。
8. 等待开发和测试。
   Agent 收到你的需求之后，将立即启动需求分析，并规划开发流程和步骤，逐步生成应用的前后端代码。代码生成完毕后，自动构建并启动服务，以提供一个可视化的界面供你预览。
   如果 Agent 判断你的应用需要数据库、存储、身份认证、AI 等能力，则会自动添加和配置对应的集成，为你的应用设计数据库表、配置存储系统，实现相关功能。更多信息，请参考[集成服务概述](https://docs.coze.cn/guides/integrations_overview)。
9. 预览开发结果。
   开发完成后，Agent 会在对话中发送开发结果和预览链接。你可以打开链接查看效果。如果页面或功能还需要调整，可以继续在对话中说明修改意见。
   预览链接有效期为 20 分钟。链接失效后访问会提示 `Service Unavailable`。你可以在会话中让 Agent 重启服务后重新生效预览链接。
   ![Image=444x362](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/e24988fe40804615b56624c839437678~tplv-goo7wpa0wc-topic.webp)   


## 迭代编程产物 {#hwBbgis6G}

应用雏形完成后，你可以选择继续修改，也可以在确认后部署上线。真实使用时，建议先通过预览确认主流程是否跑通，再逐步优化细节和接入更多能力。

你可以和 Agent 一起持续优化应用，直到实现预期的效果。你可以在对话区中通过自然语言描述你的修改建议，和Agent 一起优化你的应用。例如输入以下提示词：

```Plain Text
banner 的底图改成蓝色渐变。
首页增加一个用户评价模块。
报名表单增加手机号校验。
移动端按钮太小了，帮我调大一点。
生成结果页增加导出 PDF 功能。
列表页增加搜索和筛选。
提交成功后显示确认页。
```

每次修改完成后，Agent 会更新应用并重新提供预览。你可以继续查看效果，再决定是否继续调整。

## 集成能力 {#hAi74acSO}

扣子编程开发插件内置了一批常用集成能力，方便你为应用接入数据保存、文件上传、账号登录、联网搜索、内容处理和大模型等功能。当前支持的内置集成包括大语言模型、生图大模型、视频生成大模型、语音大模型、向量大模型、联网搜索、内容处理、数据库、对象存储和 Auth 登录认证等。

建议先完成应用的核心流程，再根据实际需要逐步添加集成能力。缺少必要配置时，Agent 会在对话中提示你补齐。更多信息，请参考[内置集成服务](https://docs.coze.cn/guides_internal_integrations)。

例如，你可以 `@编程开发插件`，添加数据库能力，用来保存用户提交的报名信息。

```Plain Text
@编程开发插件，添加数据库能力
```

![Image=256x348](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/86c3df0493bf4c71ab33c1d4d2554e02~tplv-goo7wpa0wc-topic.webp)

## 查看代码文件 {#hPt3Xzktr}

开发完成后，你可以在 Agent 的工作文件中找到对应的编程项目，并查看其中的代码文件。你也可以引用具体文件，让 Agent 帮你解释代码、定位问题或继续修改。

![Image=241x400](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/6bdf8436a73a4712b52308e45c200e08~tplv-goo7wpa0wc-topic.webp)