静的Webサイト（S3 + CloudFront）の CI/CD を構築し、GitHub にプッシュした変更が自動で S3 にデプロイされるようにします。
[ 学習フェーズ ]
1. なぜ CI/CD が必要なのか？
- 手動デプロイの手間を削減
- S3 に手動でファイルをアップロードすると、ミスや工数が増える。
- GitHub にプッシュするだけでデプロイされる仕組みを作ることで、運用を自動化できる。
- 本番環境への反映を高速化
- CodePipeline を使うことで、開発 → テスト → 本番適用 の流れを確立できる。
2. CI/CD の構成
- GitHub：静的Webサイトのソースコードを管理（HTML, CSS, JavaScript）
- CodePipeline：GitHub の変更を検知し、自動で S3 にデプロイ
- S3：静的Webサイトのホスティング
[ 実践フェーズ ]
- 以下の教材を参考に、静的Webサイトの準備をしてください。
【D-2】 静的Webサイト
2. 構築した静的Webサイトに対して、GitHub + CodePipeline を使ったCI/CDを作成してください。
①ソースステージ（GitHub）
- GitHub を選択（認証を許可）
- リポジトリとブランチを指定（例: main）
②デプロイステージ（S3）
- デプロイプロバイダーを「Amazon S3」 に設定
- 対象の S3 バケットを選択
③パイプラインの作成
3. CI/CDの確認
- GitHubへのpushをトリガーにCI/CDができるか確認する
+α
CI/CDの際に、CloudFront のキャッシュクリアも自動で行ってみましょう。
CloudFront はキャッシュを利用してコンテンツを高速に配信するため、CI/CDでデプロイした直後でも、変更が反映されないことがあります。
キャッシュは CloudFront の管理画面から手動で削除することも可能 ですが、毎回手作業で削除するのは非常に手間がかかります。
そこで、デプロイ完了後に自動でキャッシュを削除（Invalidation）し、新しいコンテンツを即時反映できるように設定 しましょう。
この処理を CI/CD に組み込むことで、GitHub に変更をプッシュするだけで、デプロイとキャッシュクリアが自動で実行されるようになります。
CloudFront のキャッシュを削除するには、aws cloudfront create-invalidation コマンドを使用します。
CodePipeline にはキャッシュクリアの機能がないため、CodeBuild を利用してキャッシュをクリア します。
既存のCodePipelineにCodeBuildを追加してみましょう。
また、IAM Roleの設定やbuildspec.ymlの作成も必要です。調べながら構築してみましょう。
+α②
CodePipeline の起動や失敗、デプロイ完了時に通知できるようにしましょう。
パターン①：SNSを使ってメール通知
パターン②：SNS + AWS Chatbotを使ってSlack通知