aws環境でSPAデプロイを自動化する
概要
awsのマネージドなサービスを使ってSPAのデプロイ自動化の一例を紹介します。
ちょっとやってみようと思ってもらえたら幸いです。
今回の登場人物はGitHub, AWSサービス(s3, CodePipeline, CodeBuild, CodeDeploy)。
デプロイ部分にしかフォーカスしませんが、途中にテスト実行などを挟むといいかもしれません。
準備
実際にパイプラインを作成する前にいくつか準備があるので忘れないようにしましょう。
１、ビルド後のファイルをアップロードするバケット
こちらは当たり前ですが、 デプロイ先のバケット準備は必須です。
忘れないようにお願いします。。。
２、ビルド用の設定ファイル作成
今回ソースファイルのビルドにCodeBuildを使用します。
どこの環境でも同じですが、ビルドは手順を準備しておかないといけないです。
その設定ファイル(buildspec.ynl)をビルドする対象プロジェクトのルートに配置します。
以下に単純にビルドするだけの設定ファイルサンプル置いておきます。
手順
基本的に手順に沿っていれば簡単です。
- デプロイに使用するGitHub、またはCodeCommitリポジトリを作成
- CodePiplineのコンソールを開き、パイプラインの作成を行う
- ”Source”の選択で作成したリポジトリを選択、どのブランチの更新をフックし取得するかを選択
- ”Build”の選択で取得したソースを何でビルドするか選択する。今回はcodeBuildを選択”
- “Deploy”でビルドしたファイルの配置先S3を指定する
- (Ex)デプロイ完了後、もう一つ手順を追加し、Lambdaを動かしてCloudFrontキャッシュの削除を行うようにする
手順6のキャッシュ削除は以下の記事を参考にしてください。
対象のキャッシュが１つなら特に難しい引数指定をしなくても関数を追加するだけでキャッシュクリアができます
完了するとこんな感じの画面になります。
まとめ
シンプルな手順を紹介しました。
あとはSourceの指定したブランチに変更を加えるか、パイプラインを開いて”変更をリリースする”というボタンを押すだけでその時点のGithubのソースを取得し、ビルド、デプロイまでやってくれます。
ほかにも承認というフローを挟むことなどもできるので、本番前のテスト環境へデプロイ→承認→同一のファイルを本番環境用のバケットへデプロイといったことも簡単にできます。
開発者的にはこのあたりの作業非常にめんどくさいと思う方が多いかと思いますので、おためしあれ！
