【AWSハンズオン-02】CDK（Typescript）の開発環境のセットアップ

本記事は、前回作成したDockerfileをカスタマイズしてCDKの開発環境をセットアップしていきます。

本記事の使い方

記事は、問題と解答で構成されています。

問題は、上から順に進めてください。
分からない問題があった場合は、先に解答を確認してください。
できれば、1つの問題も3回ぐらい手を動かして解いて、理解度を深めてください。

前提
問題
解答
おわりに

前提

前回の記事が完了していること。

【AWSハンズオン-01】Dockerを使った、CDK（Typescript）プロジェクトの作成

作業端末のプロジェクトディレクトリ配下が、以下のような構成になっていること。

.
├── Dockerfile
├── aurora-cdk
│   ├── README.md
│   ├── bin
│   ├── cdk.json
│   ├── jest.config.js
│   ├── lib
│   ├── node_modules
│   ├── package-lock.json
│   ├── package.json
│   ├── test
│   └── tsconfig.json
└── docker-compose.yml　※このファイルは、本記事を通して作成してくため、現時点で無くて大丈夫です。

6 directories, 10 files

問題

前回作成したDockerfileを修正してください。

要件

docker-compose.yml（次の問題で作成予定）から「APP_DIR」という変数を受け取れるようにしてください。
curl／unzipをインストールしてください。
curl／unzipも利用して、AWS CLI v2をインストールしてください。
AWS CLI v2のインストールが完了したら、不要になったcurl／unzipを削除してください。
apt-getのキャッシュを削除してください。
WORKDIRに「APP_DIR」変数を利用してください。
package.json、package-lock.jsonをコンテナ内にコピーしてください。
package-lock.jsonから各種パッケージをインストールしてください。
ローカルの各種資材をコンテナ内にコピーしてください。

docker-compose.yml を作成してください。

要件

ビルドオプションに引数として「APP_DIR=aurora-cdk」を設定してください。
仮想端末を有効にしてコンテナに接続できるようにしてください。
ローカルディレクトリとコンテナ内の/aurora-cdkディレクトリを同期させてください。

docker composeコマンドを利用して、コンテナをビルド／起動／接続まで行ってください。

要件

コンテナをビルドして、接続してください。
TypescriptとCDKのバージョンを確認してください。

解答

（解答）前回作成したDockerfileを修正してください。

作成するDockerfileは以下になります。

FROM node:20.15.1-slim

# ビルドオプションからAPP_DIR変数を受け取る。
ARG APP_DIR

RUN apt-get update && \\
    # curlとunzipのインストール。
    apt-get install -y curl unzip && \\
    # AWS CLI v2のセットアップ
    curl "<https://awscli.amazonaws.com/awscli-exe-linux-aarch64.zip>" -o "awscliv2.zip" && \\
    unzip awscliv2.zip && \\
    ./aws/install && \\
    # 不要になったzipファイル、インストールパッケージを削除する。
    rm -rf awscliv2.zip aws && \\
    # 不要になったcurlとunzipを削除する
    apt-get purge -y curl unzip && \\
    # ダウンロードされた.debパッケージなどのキャッシュを削除する。同じパッケージを再度インストールする際に使用されたりするが、コンテナ内には不要なので削除する。
    apt-get clean && \\
    # apt-get upadate を実行した際にキャッシュされるキャッシュの削除。
    rm -rf /var/lib/apt/lists/*

# CDK実行環境のセットアップ
WORKDIR ${APP_DIR}
COPY ./${APP_DIR}/package*.json .
RUN npm ci

COPY ./${APP_DIR} .

「CDK実行環境のセットアップ」を少し解説します。

Dockerでは、命令（RUNやCOPYなど）ごとにキャッシュを作成することで、2回目以降のビルド時間を短縮することができます。
このキャッシュは、Dockerfileの上から順に作成されていきます。例えば、以下のような命令があった場合、

RUN　変更なし
COPY　変更あり
RUN　変更なし
COPY　変更なし

変更があった命令は2番目のCOPYだけなのですが、変更が無い3番目のRUN、4番目のCOPYも再度実行されてしまいます。
これは非常にもったいないです。

そのため、以下のような構成にすることでキャッシュを有効活用することができます。

# CDK実行環境のセットアップ
WORKDIR ${APP_DIR}
# パッケージ追加は頻繁に変更が入らないため、先にpackage.json、package-lock.jsonをコピーして、インストールまで行う。
COPY ./${APP_DIR}/package*.json .
RUN npm ci

# 変更の頻度が高いソースを最後にコピーする。こうすることで、ソースへの変更だけだった場合に、この命令だけ再実行しビルド時間を短縮することが可能になる。
COPY ./${APP_DIR} .

（解答）docker-compose.yml を作成してください。

作成するdocker-compose.ymlは以下のようになります。

services:
  cdk-ts:
    build:
      context: .
      dockerfile: Dockerfile
      # ビルド変数としてCDKディレクトリ名を定義する。
      args:
        - APP_DIR=aurora-cdk
    # 仮想端末を有効化し、コンテナを継続起動させます。
    tty: true
    # auorora-cdkディレクトリをローカルとコンテナ内で同期させる。
    volumes:
      - ./aurora-cdk:/aurora-cdk

（解答）docker composeコマンドを利用して、コンテナをビルド／起動／接続まで行ってください。

ここまでに用意したDockerfile、docker-compose.ymlファイルを利用して、コンテナのビルド／起動／接続まで行います。

$ docker compose build

$ docker compose up -d

$ docker compose exec cdk-ts bash

接続したコンテナ上でTypescriptとCDKのバージョンを確認します。

# Typescriptのバージョン確認
$ npx tsc -v
Version 5.5.4

# CDKのバージョン確認
$ npx cdk --version
2.150.0 (build 3f93027)

npxを利用することで、ローカルにインストールした各種パッケージを実行することができます。

おわりに

お疲れ様でした。以上で、本記事は終了となります。
他にも問題を用意していくので是非ご覧ください。