🙌
[FE構築2] github ActionsでS3にデプロイ
前の記事
概要
githubのhtml, js, cssをgithub actionsでS3にデプロイする方法を説明します。
AWS IAM
AWSでS3へのアクセス権を持ったユーザを作成する。
AWS IAMで以下を作成する。
- ポリシー
- ロール
- ユーザー
ポリシー
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "VisualEditor0",
"Effect": "Allow",
"Action": "s3:*",
"Resource": "arn:aws:s3:::<S3バケット名>"
}
]
}
github actions登録
Settings＞Secrets＞ActionsでActions secretsを追加。
| secretsキー | 役割 |
|---|---|
| AWS_ACCESS_KEY_ID | アクセスキーID |
| AWS_SECRET_ACCESS_KEY | シークレットアクセスキー |
ワークフローを作成する .github/workflows/deploy.yml
on:
push:
branches:
- main
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@main # リポジトリをチェックアウト
- name: Install Dependencies
run: npm install
- name: Build
run: npm run build
- name: Deploy # S3にデプロイ
env:
AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
run: aws s3 cp --recursive --region ap-northeast-1 dist/ s3://<S3バケット名>
上記をPRにする。
github actions実行
RPをマージするとdeployが走る。
デプロイが完了するとS3にpushした内容が反映されている。
参考
次の記事
Discussion