AWS 入門

建立基本 Web 應用程式

部署 Web 應用程式,以 API 和資料庫新增互動性

簡介:建立基本 Web 應用程式

遵循逐步指示,建立您的第一個 Web 應用程式。

概觀

在本教學中,您將建立簡單的 Web 應用程式。首先,您會建立呈現 "Hello World" 的靜態網站。 接著您會學習如何對網站新增互動性,成為根據您提供的自訂輸入顯示文字。

您將學到的內容

本教學將帶您逐步建立上述的範例 Web 應用程式。您將學會:

  • 建立靜態網站
  • 將網站連線至無伺服器後端
  • 以 API 和資料庫新增互動性至您的 Web 應用程式

 AWS 經驗

初階

 完成時間

35 分鐘

 完成教學的成本

符合免費方案資格

 教學準備

  • 有管理員等級存取權限的 AWS 帳戶**
  • 建議的瀏覽器:最新版的 Chrome 或 Firefox

[**]過去 24 小時內建立的帳戶可能尚未有權存取本教學課程所需的服務。

應用程式架構

下圖提供本教學中所使用的服務以及如何連線的視覺呈現。此應用程式使用 Amazon Simple Storage Service (S3)、Amazon API Gateway、AWS Lambda 和 Amazon DynamoDB,如下圖所示。

在本教學進行過程中,我們將會詳細討論這些服務,並指出可協助您快速掌握它們的資源。

Full Stack tutorial app arch diagram

單元

本教學分為五個簡短的單元。您必需依序完成每個單元,方能移至下一單元。

  1. 建立靜態網站 (10 分鐘):使用 Amazon Simple Storage Service (S3) 建立一個靜態網站。
  2. 建置無伺服器功能 (5 分鐘):使用 AWS Lambda 建置無伺服器功能。
  3. 連結無伺服器功能至網站 (5 分鐘):以 API Gateway 部署您的無伺服器功能。
  4. 建立資料表 (10 分鐘):在 Amazon DynamoDB 資料表中保留資料。
  5. 新增互動性至網站 (5 分鐘):修改您的靜態網站以呼叫您的 API。

您會使用從瀏覽器內可直接存取的 AWS Web 主控台建立這個 Web 應用程式。

建立靜態網站