开始使用 AWS

构建 React 应用程序

使用 AWS Amplify 创建简单的 Web 应用程序

介绍:构建基本 React 应用程序

按照分步说明构建您的首个 React 应用程序。

概览

在本教程中,您将使用 AWS Amplify 创建一个简单的 Web 应用程序,AWS Amplify 是一组工具和服务,包括 Web 托管服务。在第一个模块中,您将在 AWS 上构建和托管 React 应用程序。在其余 4 个模块中,您将使用 CLI 初始化本地应用程序、添加身份验证、添加 GraphQL API 和数据库,并更新您的应用程序以存储图像。

您将学到的内容

本教程将引导您完成创建上面讨论的简单 Web 应用程序所需的步骤。您将学到以下内容:

  • 托管:在 AWS 全球内容分发网络 (CDN) 上构建和托管 React 应用程序
  • 身份验证:添加身份验证到您的应用程序中,以启用登录和注销
  • 数据库和存储:添加 GraphQL API、数据库和存储解决方案

 AWS 使用经验

新手

 完成时间

50 分钟

 所需费用

免费套餐资格

 教程先决条件

  • 有管理员级访问权限的 AWS 账户*
  • Node.js:Node.js v10.x 或更高版本
  • GitHub 账户
  • Git**:Windows 用户将需要安装 Git
  • 文本编辑器。下面是我们喜欢的几个免费文本编辑器(按字母顺序):AtomNotepad++SublimeVimVisual Studio Code

[*] 过去 24 小时内创建的账户可能尚不具有访问此教程所需服务的权限。
[**] 不适用于 iOS 用户,因为 Git 是标准的

模块

此教程分为五个简短模块。您必须按照顺序完成每个模块才能进入下一个。

  1. 部署和托管 React 应用程序(10 分钟):创建 React 应用程序,并通过 AWS Amplify 部署和托管。
  2. 初始化本地应用程序(5 分钟):使用 AWS Amplify 初始化本地应用程序。
  3. 添加身份验证(10 分钟):添加身份验证到您的应用程序中。
  4. 添加 GraphQL API 和数据库(15 分钟):创建 GraphQL API。
  5. 添加存储映像的能力(10 分钟):添加存储到您的应用程序中。

您将使用命令提示符/终端、测试编辑器和 AWS Web 控制台构建此 React 应用程序。

部署 React 应用程序