教程：使用 AI 生成应用程序 - AWS 应用程序工作室
先决条件第 1 步：创建 应用程序第 2 步：探索您的新应用程序第 3 步：预览您的应用程序后续步骤

本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

教程：使用 AI 生成应用程序

AWS App Studio 在整个服务中都包含生成式 AI 功能，可帮助加快应用程序构建。在本教程中，您将通过使用自然语言描述您的应用程序，学习如何使用 AI 生成应用程序。

使用 AI 生成应用程序是开始构建的好方法，因为应用程序的许多资源都是为您创建的。使用现有资源从生成的应用程序开始构建通常比从空应用程序开始构建要容易得多。

注意

您可以查看博客文章使用 AWS App Studio（预览版）使用自然语言构建企业级应用程序，以查看包含图像的类似演练。博客文章还包含有关设置和配置管理员相关资源的信息，但如果需要，您可以跳到有关构建应用程序的部分。

当 App Studio 生成带有 AI 的应用程序时，它会使用以下资源来创建应用程序，这些资源是针对您所描述的应用程序量身定制的：

  • 页面和组件：组件是应用程序用户界面的基块。它们代表表格、表单和按钮等视觉元素。每个组件都有自己的一组属性，您可以根据自己的特定要求自定义组件。页面是组件的容器。

  • 自动化：您可以使用自动化来定义控制应用程序行为的逻辑和工作流程。例如，您可以使用自动化来创建、更新、读取或删除数据表中的行，或者与 Amazon S3 存储桶中的对象进行交互。您还可以使用它们来处理诸如数据验证、通知或与其他系统的集成之类的任务。

  • 实体：数据是为您的应用程序提供动力的信息。生成的应用程序会创建类似于表格的实体。实体代表您需要存储和处理的不同类型的数据，例如客户、产品或订单。您可以使用 App Studio 连接器将这些数据模型连接到各种数据源 APIs，包括 AWS 服务和外部数据源。

先决条件

在开始之前，请查看并完成以下先决条件：

第 1 步：创建 应用程序

生成应用程序的第一步是在 App Studio 中向 AI 助手描述要创建的应用程序。您可以查看将生成的应用程序，并在生成应用程序之前根据需要进行迭代。

使用 AI 生成应用程序

  1. 登录 App Studio。

  2. 在左侧导航栏中，选择 Builder Hub，然后选择 + 创建应用程序。

  3. 选择 “使用 AI 生成应用程序”。

  4. 在应用程序名称字段中，为您的应用程序提供一个名称。

  5. 在 “选择数据源” 对话框中，选择 “跳过”。

  6. 您可以开始定义要生成的应用程序，方法是在文本框中对其进行描述，或者在示例提示上选择 “自定义”。描述您的应用程序后，App Studio 会生成应用程序要求和详细信息供您查看。这包括用例、用户流和数据模型。

  7. 使用文本框根据需要对应用程序进行迭代，直到您对要求和细节感到满意。

  8. 准备好生成应用程序并开始构建时，请选择生成应用程序。

  9. 或者，您可以观看一段简短的视频，详细介绍如何在您的新应用程序中导航。

  10. 选择 “编辑应用程序” 以进入应用程序的开发环境。

第 2 步：探索您的新应用程序

在开发环境中，您将找到以下资源：

  • 用于查看或编辑应用程序的画布。画布会根据所选资源而变化。

  • 画布顶部的导航选项卡。以下列表对这些选项卡进行了描述：

    • 页面：使用页面和组件来设计应用程序界面的位置。

    • 自动化：在自动化中使用操作来定义应用程序的业务逻辑。

    • 数据：在其中定义实体、其字段、示例数据和数据操作，以定义应用程序的数据模型。

    • 应用程序设置：用于定义应用程序设置，包括应用程序角色，用于为最终用户定义基于角色的页面可见性。

  • 左侧导航菜单，其中包含基于您正在查看的选项卡的资源。

  • 右侧菜单，列出 “页面” 和 “自动化” 选项卡中选定资源的资源和属性。

  • 在生成器底部显示警告和错误的调试控制台。您生成的应用程序中可能存在错误。这可能是由于自动化需要配置的连接器才能执行操作，例如使用 Amazon Simple Email Service 发送电子邮件。

  • “询问 AI” 聊天窗口，可从 AI 生成器助手那里获取情境帮助。

让我们仔细看看 “页面”、“自动化” 和 “数据” 选项卡。

浏览页面和组件

“页面” 选项卡显示为您生成的页面及其组件。

每个页面都代表您的应用程序的用户界面 (UI) 屏幕，您的用户将与之交互。在这些页面上，您可以找到各种组件（例如表格、表单和按钮）来创建所需的布局和功能。

请花点时间使用左侧导航菜单查看页面及其组件。选择页面或组件时，可以在右侧菜单中选择 “属性”。

探索自动化和操作

“自动化” 选项卡显示为您生成的自动化及其操作。

自动化定义应用程序的业务逻辑，例如创建、查看、更新或删除数据条目、发送电子邮件，甚至调用或 APIs Lambda 函数。

花点时间使用左侧导航菜单查看自动化。选择自动化后，可以在右侧的 “属性” 菜单上查看其属性。自动化包含以下资源：

  • 自动化由单个操作组成，这些操作是应用程序业务逻辑的基石。您可以在左侧导航菜单上或所选自动化的画布中查看自动化的操作。选择操作后，可以在右侧的 “属性” 菜单上查看其属性。

  • 自动化参数是将数据传递到自动化的方式。参数充当占位符，当自动化运行时，这些占位符会被实际值替换。这允许您每次使用相同的自动化，输入也不同。

  • 自动化输出是您配置自动化结果的地方。默认情况下，自动化没有输出，因此要在组件或其他自动化中使用自动化的结果，必须在此处定义它们。

有关更多信息，请参阅 自动化概念。

使用实体浏览数据

“数据” 选项卡显示为您生成的实体。

实体表示保存应用程序数据的表，类似于数据库中的表。它们不是将应用程序的用户界面 (UI) 和自动化直接连接到数据源，而是先连接到实体。实体充当您的实际数据源和 App Studio 应用程序之间的中介。这为管理和访问您的数据提供了一个单一的地方。

花点时间查看通过从左侧导航菜单中选择生成的实体。您可以查看以下详细信息：

  • “配置” 选项卡显示实体名称及其字段，这些字段代表您的实体的列。

  • 数据操作选项卡显示您的实体生成的数据操作。组件和自动化可以使用数据操作从您的实体中获取数据。

  • 示例数据选项卡显示了示例数据，您可以使用这些数据在开发环境（不与外部服务通信）中测试您的应用程序。有关环境的更多信息，请参阅应用程序环境。

  • “连接” 选项卡显示有关实体所连接的外部数据源的信息。App Studio 提供了一种使用 DynamoDB 表的托管数据存储解决方案。有关更多信息，请参阅 AWS App Studio 中的管理数据实体。

第 3 步：预览您的应用程序

您可以在 App Studio 中预览应用程序，以查看其对用户的显示效果。您还可以通过使用它并在调试面板中查看日志来测试其功能。

应用程序预览环境不支持显示实时数据或使用连接器与外部资源（例如数据源）的连接。相反，您可以使用样本数据和模拟输出来测试功能。

预览您的应用程序以进行测试

  1. 在应用程序构建器的右上角，选择预览。

  2. 与您的应用程序的页面互动。

后续步骤

现在，您已经创建了第一个应用程序，接下来是一些后续步骤：