36
27

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 3 years have passed since last update.

ECS (Fargate) + ACM + Route53 入門

Last updated at Posted at 2020-12-03

はじめに

前回の記事を書いていくと、今の流行はどうやらEC2ではなくECSであるそうなので、今回はそちらを勉強してみました。
備忘録として書いていますが、自分と同じくAWS初心者の方の手助けとなれば幸いです。

対象読者

  • AWSアカウント登録済み
  • EC2VPCなどの基礎的なAWSの知識は持っている
  • 自分

全体構造

201201 ECS-Page-2.png

ECSとは

Amazon Elastic Container Serviceの略称で、EC2インスタンス(もしくはFargate)コンテナを複数操作することができるサービスです。また、他のAWSサービスとも連携することが容易です。
簡単にECSの全体構造を表してみました。
201201 ECS.png

詳しくはまた作成するときに説明します。

一応こちらが公式です。

ECSを含めた構築の流れ

Docker イメージの作成

環境を揃えるため、今回使用するDocker イメージを作成します。
「自分の環境で試したいぜ」って方はこの章は無視してもらって構いません。
一応コードは、ここ に公開しています。

pullしてきたら、READMEにしたがって

docker build --tag 『今回のDockerイメージ名(任意)』 .

を実行。

docker images

REPOSITORY     TAG          IMAGE ID            CREATED              SIZE
aws-example    latest       05ad15c1ad82        About a minute ago   527MB

で、イメージが作成できているか確認できます。

ちなみに、

docker ps

CONTAINER ID        IMAGE           COMMAND                  CREATED              STATUS                      PORTS                    NAMES
817ed89f61b7        aws-example     "docker-entrypoint.s…"   32 seconds ago       Exited (0) 25 seconds ago                            gracious_galois

docker start 『上の CONTAINER ID』
docker exec -it 『上の CONTAINER ID』 sh 

でコンテナの中に入ることができます。

ECRにpush

ECRとは、Amazon Elastic Container Registryの略称で、Dockerイメージを保管できるレジストリです。
AWS版Docker Hubみたいな認識でいいです。

では早速、DockerイメージECRpushしていきます。

AWSコンソールのサービスから『ECR』を選択。
スクリーンショット 2020-12-01 17.20.50.png

リポジトリを作成』を押下。
スクリーンショット 2020-12-01 17.21.13.png

ECR上のリポジトリ名を記入。
リポジトリを作成』を押下。
スクリーンショット 2020-12-01 17.21.43.png

作成したリポジトリを押下。

プッシュコマンドの表示』を押下。
スクリーンショット 2020-12-01 17.24.55.png

以下に表示されるコマンドを順に実行。
スクリーンショット 2020-12-01 17.42.18.png


※ AWS CLIをインストールしていない方は...

AWS公式のdockerイメージをインストール

docker run --rm -it amazon/aws-cli --version

長いコマンドを aws ~~~~みたいに打てるようにエイリアスする。

alias aws='docker run --rm -ti -v ~/.aws:/root/.aws -v $(pwd):/aws amazon/aws-cli'

以上でAWS CLIがコンテナ上で起動するようになります。


ブラウザをリロードして、以下のように表示されていればECRpushすることができています。
あとで必要なので、ついでに URI もコピーしておきます。
スクリーンショット 2020-12-02 13.11.19.png

クラスターの作成

ECSメニューの『クラスター』から『今すぐ始める』を押下。
スクリーンショット 2020-12-02 13.09.56.png

customの『設定』を押下。
スクリーンショット 2020-12-02 14.12.20.png

今回のコンテナ名を決定。
イメージ』に先ほどコピーしたECRの URI をペーストする。
ポートマッピング』に今回開放している 3000番を記入。
更新』を押下。
スクリーンショット 2020-12-02 14.16.29.png

元の画面に戻ったら、『』を押下。
スクリーンショット 2020-12-02 14.16.49.png

ロードバランサーの種類』は『Application Load Balancer』を選択。
』を押下。
スクリーンショット 2020-12-02 14.22.52.png

クラスター名』で、今回のクラスターの名前を決定。
』を押下。
スクリーンショット 2020-12-02 14.24.56.png

確認して問題なければ、『作成』を押下。
スクリーンショット 2020-12-02 14.26.29.png

以下の画面が表示されれば、ECSの作成は完了です。
念のため、デプロイできているか確認します。

サービスの表示』を押下。
スクリーンショット 2020-12-02 14.33.31.png

タスク』を選択。
作成されているタスクを押下。
スクリーンショット 2020-12-02 14.34.54.png

パブリックIPをコピー。
スクリーンショット 2020-12-02 14.34.57.png

http://『パブリックIP』:3000/ でアクセスするとNuxtアプリが表示されます。

ACMでSSL証明

ACMとは、AWS Certificate Managerの略称で SSL証明書などを無料で発行できるサービスです。
こちらを用いて、今回デプロイしたアプリを SSL証明していきます。

また今回は、Route53で独自ドメインが紐づいたホストゾーンを既に作成しているものとします。
また本稿の前準備として、ロードバランサーAレコードをホストゾーンに紐づけておいてください。

AWSコンソールから、ACMもしくはCertificate Managerを選択。
スクリーンショット 2020-12-02 15.34.09.png

証明書のリクエスト』を押下。
スクリーンショット 2020-12-02 15.42.26.png

自分で作成しているホストゾーンに紐づいているドメイン名を記入。
この際サブドメインを設定しても良い。(www.ecs-example.siteみたいにしても良い)
次へ』を押下。
スクリーンショット 2020-12-02 15.42.45.png

DNSの検証』を選択。
次へ』を押下。
スクリーンショット 2020-12-02 15.42.48.png

確認』を押下。
スクリーンショット 2020-12-02 15.42.51.png

確定とリクエスト
スクリーンショット 2020-12-02 15.42.53.png

』を押下。
Route 53でレコードの作成』を押下。
出てくるポップアップの内容を確認し、『作成』を押下。
続行』を押下。
スクリーンショット 2020-12-02 15.43.01.png

5分ほど待ち『発行済み』になればOK。
スクリーンショット 2020-12-02 17.43.44.png

ドメイン設定

クラスター』の『詳細』から、『ターゲットグループ名』にあるターゲットグループを押下。
スクリーンショット 2020-12-02 14.55.08.png

ロードバランサー』を押下。
スクリーンショット 2020-12-03 14.06.56.png

説明』タグが選択されていることを確認。
下にスクロールして自分の『セキュリティグループ』を押下。
スクリーンショット 2020-12-03 14.07.46.png

ELB Allowed Ports』と記されたセキュリティグループを選択。
インバウンド』を選択。
編集』を押下。
スクリーンショット 2020-12-03 14.08.31.png

ルールの追加』を押下。
タイプ』に『HTTP』『HTTPS』を選択。(基本的に自動で『ポート番号』『ソース』が記入されますが、もしそうでない場合手動で記入してください。)
保存』を押下。
スクリーンショット 2020-12-03 14.08.51.png

左側のメニューから『ロードバランサー』を選択。
今回使用するVPCを選択。
リスナーの追加』を押下。
スクリーンショット 2020-12-03 14.30.36.png

プロコトル:ポート』を『HTTPS』『443』に選択。
アクションの追加』を押下。
転送先...』を選択。
今回使用するターゲットグループを選択。
デフォルトのSSl証明書』は『ACMから(推奨)』を選択して、先ほどACMで発行したSSL証明書を選択。
スクリーンショット 2020-12-03 14.32.11.png

上と同様にロードバランサーのメニュー画面から『リスナーの追加』を押下。
プロコトル:ポート』を『HTTPS』『80』に選択。
アクションの追加』を押下。
リダイレクト先...』を選択。
スクリーンショット 2020-12-03 14.32.36.png

参考記事

Nuxt.jsでアプリ作成→Dockerfileを使ってイメージ作成→fargateでデプロイ→ドメイン設定・SSL化まで

36
27
0

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
36
27

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?