ECS (Fargate) + ACM + Route53 入門

# はじめに
[前回の記事](https://qiita.com/sychocola1/items/12680b19d118a550b8a9)を書いていくと、今の流行はどうやら**EC2**ではなく**ECS**であるそうなので、今回はそちらを勉強してみました。
備忘録として書いていますが、自分と同じく**AWS**初心者の方の手助けとなれば幸いです。

# 対象読者
* **AWS**アカウント登録済み
* **EC2**や**VPC**などの基礎的な**AWS**の知識は持っている
* 自分

# 全体構造

![201201 ECS-Page-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/0f611a59-4280-9bab-e562-8716943763e6.png)


# ECSとは
**Amazon Elastic Container Service**の略称で、**EC2インスタンス**(もしくは**Fargate**)コンテナを複数操作することができるサービスです。また、他の**AWS**サービスとも連携することが容易です。
簡単に**ECS**の全体構造を表してみました。
![201201 ECS.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/8fc74e82-29b2-99eb-d78a-1f733a35325d.png)

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

一応こちらが[公式](https://aws.amazon.com/jp/ecs/?whats-new-cards.sort-by=item.additionalFields.postDateTime&whats-new-cards.sort-order=desc&ecs-blogs.sort-by=item.additionalFields.createdDate&ecs-blogs.sort-order=desc)です。

# ECSを含めた構築の流れ
## Docker イメージの作成
環境を揃えるため、今回使用する**Docker イメージ**を作成します。
「自分の環境で試したいぜ」って方はこの章は無視してもらって構いません。
一応コードは、[ここ](https://github.com/Shiba-You/shiba-aws-example) に公開しています。

`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イメージ**を**ECR**に `push`していきます。

**AWSコンソール**のサービスから『**ECR**』を選択。
![スクリーンショット 2020-12-01 17.20.50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/a3e66582-3a90-2714-1bd9-36ca5863cf20.png)

『**リポジトリを作成**』を押下。
![スクリーンショット 2020-12-01 17.21.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/6c45a069-afc3-343e-cce9-c0df048ede87.png)

**ECR**上のリポジトリ名を記入。
『**リポジトリを作成**』を押下。
![スクリーンショット 2020-12-01 17.21.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/63dffa7c-2237-c091-731a-aaa8886b7def.png)

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

『**プッシュコマンドの表示**』を押下。
![スクリーンショット 2020-12-01 17.24.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/f957e97a-aa00-9d0e-44eb-ea9332213f70.png)

以下に表示されるコマンドを順に実行。
![スクリーンショット 2020-12-01 17.42.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/8b32c18a-b642-6972-eff9-d3eeeabbbb72.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**がコンテナ上で起動するようになります。

****

ブラウザをリロードして、以下のように表示されていれば**ECR**に `push`することができています。
あとで必要なので、ついでに URI もコピーしておきます。
![スクリーンショット 2020-12-02 13.11.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/52660d75-26f1-654d-85d3-9e0b957cfc0e.png)


## クラスターの作成
**ECS**メニューの『**クラスター**』から『**今すぐ始める**』を押下。
![スクリーンショット 2020-12-02 13.09.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/c44a1592-6cd6-1922-a4b6-449d45c5f1d7.png)

**custom**の『**設定**』を押下。
![スクリーンショット 2020-12-02 14.12.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/33799bbb-ca90-b84c-42e5-0d78a8bede6d.png)

今回のコンテナ名を決定。
『**イメージ**』に先ほどコピーした**ECR**の URI をペーストする。
『**ポートマッピング**』に今回開放している 3000番を記入。
『**更新**』を押下。
![スクリーンショット 2020-12-02 14.16.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/dd609997-8bb3-0aef-af44-66b6e6732425.png)

元の画面に戻ったら、『**次**』を押下。
![スクリーンショット 2020-12-02 14.16.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/0a696bad-9871-8fc4-09a5-2b9667137ca7.png)

『**ロードバランサーの種類**』は『**Application Load Balancer**』を選択。
『**次**』を押下。
![スクリーンショット 2020-12-02 14.22.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/ef829521-857a-5828-8957-c4b32dab60a0.png)

『**クラスター名**』で、今回のクラスターの名前を決定。
『**次**』を押下。
![スクリーンショット 2020-12-02 14.24.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/0c2f8424-e989-00bc-b145-1d75524651a9.png)

確認して問題なければ、『**作成**』を押下。
![スクリーンショット 2020-12-02 14.26.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/1c51bed0-8f90-43c7-235a-ff6cc1a5e947.png)

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

『**サービスの表示**』を押下。
![スクリーンショット 2020-12-02 14.33.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/5156e483-a3df-590c-66e3-8b1860a5a8f0.png)

『**タスク**』を選択。
作成されているタスクを押下。
![スクリーンショット 2020-12-02 14.34.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/bf8088a4-7e27-552f-90e3-bebe4d3b67e6.png)

パブリックIPをコピー。
![スクリーンショット 2020-12-02 14.34.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/7e5566f5-2c45-be52-ebcc-85b7dff7a244.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](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/838bb52c-86b1-0e17-f0bf-7d2b17d1c0f1.png)

『**証明書のリクエスト**』を押下。
![スクリーンショット 2020-12-02 15.42.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/cbdd374a-87cb-99ab-b03c-a66fccda1299.png)

自分で作成している**ホストゾーン**に紐づいているドメイン名を記入。
この際サブドメインを設定しても良い。（`www.ecs-example.site`みたいにしても良い）
『**次へ**』を押下。
![スクリーンショット 2020-12-02 15.42.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/a2413f17-4302-7c57-73ef-398add34247c.png)

『**DNSの検証**』を選択。
『**次へ**』を押下。
![スクリーンショット 2020-12-02 15.42.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/5d3e1e53-2c19-1261-1a22-2f72c77db40e.png)

『**確認**』を押下。
![スクリーンショット 2020-12-02 15.42.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/a4838ebc-be6d-a8b6-848c-3455720cabfe.png)

『**確定とリクエスト**』
![スクリーンショット 2020-12-02 15.42.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/c065d276-b6cf-055f-8618-9c79c553a706.png)

『**▼**』を押下。
『**Route 53でレコードの作成**』を押下。
出てくるポップアップの内容を確認し、『**作成**』を押下。
『**続行**』を押下。
![スクリーンショット 2020-12-02 15.43.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/03cc4a41-5c8b-c14e-55b1-2a4a5a220365.png)

5分ほど待ち『**発行済み**』になればOK。
![スクリーンショット 2020-12-02 17.43.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/59f2cc79-3a67-ce39-2f44-1df4a80b6823.png)



## ドメイン設定
『**クラスター**』の『**詳細**』から、『**ターゲットグループ名**』にあるターゲットグループを押下。
![スクリーンショット 2020-12-02 14.55.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/8615e3e9-923f-0b31-8e10-2a2990a84b7a.png)

『**ロードバランサー**』を押下。
![スクリーンショット 2020-12-03 14.06.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/33068886-99d8-6bdc-ccee-80a8ea4e6693.png)

『**説明**』タグが選択されていることを確認。
下にスクロールして自分の『**セキュリティグループ**』を押下。
![スクリーンショット 2020-12-03 14.07.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/59ec6f1e-19cf-0278-eb26-6edabc4aac28.png)

『**ELB Allowed Ports**』と記された**セキュリティグループ**を選択。
『**インバウンド**』を選択。
『**編集**』を押下。
![スクリーンショット 2020-12-03 14.08.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/0993fbbb-9a7e-7d2b-6a70-2fc8520fd4c6.png)

『**ルールの追加**』を押下。
『**タイプ**』に『**HTTP**』『**HTTPS**』を選択。（基本的に自動で『**ポート番号**』『**ソース**』が記入されますが、もしそうでない場合手動で記入してください。）
『**保存**』を押下。
![スクリーンショット 2020-12-03 14.08.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/dfe7a9f6-2bcf-0e86-0821-68c282cda19b.png)

左側のメニューから『**ロードバランサー**』を選択。
今回使用する**VPC**を選択。
『**リスナーの追加**』を押下。
![スクリーンショット 2020-12-03 14.30.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/8b2c2366-c116-231c-cb7d-d2206e24467f.png)

『**プロコトル：ポート**』を『**HTTPS**』『**443**』に選択。
『**アクションの追加**』を押下。
『**転送先...**』を選択。
今回使用する**ターゲットグループ**を選択。
『**デフォルトのSSl証明書**』は『**ACMから（推奨）**』を選択して、先ほど**ACM**で発行した**SSL証明書**を選択。
![スクリーンショット 2020-12-03 14.32.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/dd32bfd4-7070-f769-4049-a74145527b63.png)

上と同様に**ロードバランサー**のメニュー画面から『**リスナーの追加**』を押下。
『**プロコトル：ポート**』を『**HTTPS**』『**80**』に選択。
『**アクションの追加**』を押下。
『**リダイレクト先...**』を選択。
![スクリーンショット 2020-12-03 14.32.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412378/d9abf35a-ea5b-322c-0f04-5e39dc489f5a.png)



# 参考記事
[Nuxt.jsでアプリ作成→Dockerfileを使ってイメージ作成→fargateでデプロイ→ドメイン設定・SSL化まで](https://qiita.com/yujiro0102/items/0a4672d7f8ea64fe1d6d)