使用 AWS Amplify 主控台
部署和託管 ReactJS 應用程式
AWS Amplify 主控台提供使用無伺服器後端開發、部署和託管單一頁面 Web 應用程式或靜態網站的 Git 型 CI/CD 工作流程。連線至 Git 儲存庫後，Amplify 會確定前端框架，以及利用 Amplify CLI 設定的任何無伺服器後端資源兩者的建置設定，並在每次提交程式碼時自動部署更新。
在本教學中，我們首先建立新 React 應用程式，並將其推送至 GitHub 儲存庫。 然後，我們將儲存庫連線至 Amplify 主控台，並將其部署到 mplifyapp.com 網域上託管的全球可用內容交付網路 (CDN)。。下一步，我們將透過對 React 應用程式做出變更來示範連續部署功能，並將新版本推送至將自動開始新部署的主要分支。
此教學中的所有操作都可用免費方案資格來進行。
| 關於本教學 | |
|---|---|
| 時間 | 10 分鐘 |
| 費用 | 符合免費方案資格 |
| 使用案例 | 網站和 Web 應用程式 |
| 產品 | AWS Amplify 主控台 |
| 對象 | 開發人員 |
| 等級 | 初階 |
| 上次更新日期 | 2018 年 3 月 4 日 |
1.註冊 AWS
您需要一個 AWS 帳戶，才能在 AWS Amplify 主控台上進行本教學。在本教學中使用 AWS Amplify 無需額外付費。您在本教學建立的資源符合免費方案資格。
已經有帳戶了嗎？ 登入 Amplify 主控台
2.確認環境設定
開啟命令行界面，然後輸入以下命令：
node -v;若該命令返回的版本低於 v8.0，則將節點升級至版本 8 以上的版本。若找不到該命令，請透過 nodejs.org/download 安裝該節點。
3.建立新的 React 應用程式
建立 React 應用程式最簡單的方法是使用命令 create-react-app。使用以下命令安裝此套件：
npx create-react-app amplifyapp
cd amplifyapp
npm start4.初始化 GitHub 儲存庫
在此步驟中，您將建立一個 GitHub 儲存庫，並將程式碼提交至該儲存庫。您將需要一個 GitHub 帳戶來完成此步驟，若您沒有帳戶，請在這裡註冊。
a.為您的應用程式建立新的 GitHub 儲存庫 (連結)。
b.初始化 git 並將應用程式推送至新的 GitHub 儲存庫，在命令行界面中執行以下命令：
git init
git remote add origin git@github.com:username/reponame.git
git add .
git commit -m ‘initial commit’
git push origin master
5.登入 AWS Amplify 主控台
在新的瀏覽器視窗中，開啟 AWS 管理主控台，讓此逐步指南保持開啟狀態。當畫面載入時，請輸入您的使用者名稱和密碼以開始使用。然後在搜尋列中輸入 Amplify，再選取 AWS Amplify 以開啟服務主控台。
6.將您的應用程式部署至 AWS Amplify
在此步驟中，您會將剛剛建立的 GitHub 儲存庫連線至 AWS Amplify 服務。這讓您能夠在 AWS 上建置、部署和託管應用程式。
g.建置完成後，選取縮略圖以查看您的 Web 應用程式是否啟動並即時執行。
恭喜
您已經通過整合 GitHub 並使用 Amplify 主控台，在雲端部署 React 應用程式。
藉助 AWS Amplify 主控台，您可以在雲端連續部署應用程式，並將其託管在全球可用的 CDN 上。
