27
7

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

[小ネタ] AWS Amplify 本のサンプルのデプロイについて

Last updated at Posted at 2022-09-24

はじめに

書籍「AWS Amplify Studioではじめるフロントエンド+バックエンド統合開発」を購入しました。

p.30にサンプルアプリを作成する手順が記載されています。
2022年9月時点で私のAWSアカウントでは書籍どおりに行かなかったので、同じような状況の方向けのメモとして残しておきます。

p.30下部の図には AWSのコンソールで「フルスタックのサンプルから」という項目が表示されていますが、私の環境では表示されていませんでした。(下図)

image.png

GitHubからの操作で同じサンプルをデプロイすることができますので、手順を残しておきます。

まず、ブラウザ上でAWSのマネジメントコンソールにログインしておきます。
同じブラウザで作成済みのGitHubにもログインしておきます。

GitHubでの操作

以下のサイトにブラウザからアクセスしてください。

下にスクロールし、[DEPLOY TO AMPLIFY CONSOLE]をクリックします。

image.png

ご自身のGitHubアカウントにログインします。

image.png

GitHubに対するAWS Amplifyからの認可設定を行っていきます。
(このへんは書籍のp.35あたりと同じです)
image.png

書籍と同様に全てのリポジトリへの読み書き権限を許可します。

image.png

AWS Amplify コンソール

AWS Amplifyの画面に遷移します。「新しいロールを作成」を選択します。

image.png

AWS マネジメントコンソール(IAM)

IAMロールの画面では、ウィザードに沿って進めていくだけでOKです。

ロールの信頼関係は自動でAmplifyが選択されています。

image.png

付与するポリシーも最初から選択されています。

image.png

ロール名も自動で設定されています。
image.png

ロールが作成されました。

image.png

AWS Amplify コンソール

Amplifyコンソールに戻り、サービスロール横のくるくるマークを押して更新すると、先程作ったロールが選択できるようになります。
選択し、「保存してデプロイ」を選択します。

image.png

デプロイの進行状況が確認できます。
数分待ち、「続行」を押します。

image.png

サンプルアプリができました。あとは書籍のp.36あたりから読み進めれば良いと思います。

image.png

以上です。

27
7
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
27
7

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?