dayjournal memo

Total 992 articles!!

AWS Amplify #015 - Amplify ConsoleでGitHubを利用した公開(Amplify CLI)

Yasunori Kirimoto's avatar

img



Amplify ConsoleでGitHubを利用した公開(Amplify CLI)をするメモ。



事前準備

事前準備として、AWS Amplifyの環境構築。
AWS Amplify #002 - 環境構築 [Vue.jsバージョン]


実行環境

  • node v16.10.0
  • npm v7.24.0

ホスティング環境を設定します。実行時に「Hosting with Amplify Console」と「Continuous deployment (Git-based deployments)」を選択します。

amplify add hosting

画像


AWSコンソールが自動で表示されるので「GitHub」をクリック。

画像


GitHubの認証画面が表示されるので「Authorize」をクリック。

img


事前準備していた対象リポジトリとブランチを選択 → 「次へ」をクリック。

画像


対象アプリケーションと環境を選択。既存のロールが無い場合は「新しいロールを作成」をクリック。

画像


エンティティタイプは「AWSのサービスを」選択。ユースケースは「Amplify」を選択 → 「次へ」をクリック。

画像


「次へ」をクリック。

画像


任意のロール名を設定 → 「ロールを作成」をクリック。

画像


作成したロールを選択 → 「次へ」をクリック。

画像


「保存してデプロイ」をクリック。

画像


AWSコンソールの設定が完了したらコマンドに戻りでEnterを実行。

画像


自動デプロイが終わるとAWSコンソールでURLが発行されるのでアクセスします。

画像


デプロイしたWebSiteが表示されます。

画像


GitHubを更新すると自動で毎回ビルドとデプロイされます。 このホスティング環境は、「AWS Amplify #014 - Amplify ConsoleでGitHubを利用した公開」と同じ環境になります。




book

Q&A