GatsbyCLIのインストール/プロジェクト作成/ローカルWebサーバーで公開しましたので、AWS Amplifyでサイトをデプロイしてみます。
■PC環境
・Windows10、Administrator（管理者）アカウント
・Gatsby.js の CLI をインストール
・node version 14.15.0
・npm version 6.14.8
・git version 2.29.2.windows.1
■AWS Amplifyでデプロイ
AWS Amplifyでデプロイする前に、GitHubにログインし、空のリポジトリを作成しておきます。
C:\Users\Administrator>cd blog C:\Users\Administrator\blog>git remote add origin https://github.com/○○/○○.git C:\Users\Administrator\blog>git push -u origin master
cdコマンドで作成したプロジェクトに移動し、gitのコマンドを入力し、Enterキーを押します。
Enterキーを押すと、「Connect toGitHub」ウインドウが表示されます。「Sign in with your browser」をクリックします。
クリックすると、Webブラウザが起動し、Githubの「Authorize application」ウインドウが表示されます。「Authorize Git Credential Manager（Gitクレデンシャルマネージャーを承認する）」と書かれていますので、「Authorize Git Credential Manager（Gitクレデンシャルマネージャーを承認する）」ボタンをクリックします。
クリックすると、「Confirm password」ウインドウが表示されます。「Confirm password to continue（続行するにはパスワードを確認してください）」と書かれていますので、パスワードを入力し、「Confirm password（パスワードを認証する）」ボタンをクリックします。
クリックすると、「Authentication Succeeded（認証に成功しました）」と表示されます。Webブラウザを閉じます。
info: please complete authentication in your browser…
Enumerating objects: 28, done.
Counting objects: 100% (28/28), done.
Delta compression using up to 4 threads
Compressing objects: 100% (26/26), done.
Writing objects: 100% (28/28), 389.37 KiB | 9.73 MiB/s, done.
Total 28 (delta 3), reused 0 (delta 0), pack-reused 0
remote: Resolving deltas: 100% (3/3), done.
To https://github.com/○○/○○.git
* [new branch] master -> master
Branch ‘master’ set up to track remote branch ‘master’ from ‘origin’.
これでPush が完了となります。
■Amplify Console にアクセスする
完了後、Amplify Console（https://aws.amazon.com/jp/amplify/console/）にアクセスします。
アクセスすると、「アプリケーションの接続」ボタンがあるので、クリックします。
クリックすると、ログイン画面になるので、ルートユーザーでログインします。
ログインすると、「Get started with the Amplify Console（Amplifyコンソールの使用を開始する）」とページに表示されます。リポジトリのサービスプロバイダーで「Github」を選択します。
選択後、「Continue」ボタンをクリックします。
クリックすると、Githubの「Authorize AWS Amplify (ap-northeast-1)（AWS Amplifyを承認する（ap-northeast-1））」とページに表示されます。「Authorize aws-amplify-console（aws-amplify-consoleを承認）」ボタンをクリックします。
クリックすると、「Confirm password」ウインドウが表示されます。「Confirm password to continue（続行するにはパスワードを確認してください）」と書かれていますので、パスワードを入力し、「Confirm password（パスワードを認証する）」ボタンをクリックします。
クリックすると、AWS Amplify Consoleの「リポジトリブランチの追加」と表示されたページが現れます。「GitHub 認証が成功しました。」と書かれていますので、先程の承認は完了となります。
完了後、「リポジトリの選択」でGitHubにログインし、作成しておいた空のリポジトリを選択します。ブランチは「master」で選択します。選択後、「次へ」ボタンをクリックします。
クリックすると、「アプリの名前」の入力欄にアプリの名前を入力します。入力後、ビルドの設定の項目がありますが、編集はしないので、「次へ」ボタンをクリックします。
クリックすると「確認」画面が表示されます。「リポジトリの詳細」と「アプリの設定」を確認し、「保存してデプロイ」ボタンをクリックします。
クリックすると、デプロイが行われます。画面上でデプロイの進行状況が確認できます。デプロイの完了まではしばらく時間がかかります。
デプロイが成功すると、進行状況が全て緑色になり、過程の全てにチェックが入ります。
デプロイが成功し、サイトが公開されているかを確認する場合は、「master」「 Continuous deploys set up」と表示されている下にURLが記載されているので、こちらをクリックします。
クリックすると、Webブラウザ上にサイトが表示されます。
コメント