Feat/comment page design (#18) #22
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Front Deployment | |
| # trigger가 되길 바라는 action을 입력합니다. push / pull_request가 있습니다. | |
| # 저는 develop 브랜치에 push가 되면 actions을 실행하도록 설정했습니다. | |
| on: | |
| push: | |
| branches: | |
| - main | |
| # 위의 이벤트가 트리거되면 실행할 목록입니다. | |
| jobs: | |
| build: | |
| name: react build & deploy | |
| # runner가 실행될 환경을 지정합니다. | |
| runs-on: ubuntu-latest | |
| # name은 단계별로 실행되는 액션들의 설명을 담은 것으로, 나중에 github action에서 workflow에 표시됩니다. | |
| # uses 키워드로 Action을 불러올 수 있습니다. | |
| steps: | |
| # 레포지토리에 접근하여 CI서버로 코드를 내려받는 과정입니다. | |
| - name: checkout Github Action | |
| uses: actions/checkout@v3 | |
| # workflow가 실행될 때 필요한 파일 중에서 거의 바뀌지 않는 파일들을 GitHub의 캐시에 올려놓고 CI 서버로 내려받습니다. | |
| # 프로젝트에서 자주 바뀌지 않는 수많은 패키지를 매번 다운받아 올리면 시간도 오래걸리고 네트워크 대역폭을 많이 사용하게됩니다. | |
| - name: Get npm cache directory | |
| id: npm-cache-dir | |
| run: | | |
| echo "::set-output name=dir::$(npm config get cache)" | |
| - uses: actions/cache@v3 | |
| id: npm-cache | |
| with: | |
| path: ${{ steps.npm-cache-dir.outputs.dir }} | |
| key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }} | |
| restore-keys: | | |
| ${{ runner.os }}-node- | |
| - name: install npm dependencies | |
| run: npm install | |
| - name: react build | |
| run: npm run build | |
| # aws에 접근하기 위한 권한을 받아옵니다. | |
| - name: Configure AWS credentials | |
| uses: aws-actions/configure-aws-credentials@v1 | |
| with: | |
| aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} | |
| aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} | |
| aws-region: ap-northeast-2 | |
| # S3에 dist 파일을 올립니다. | |
| - name: Upload to S3 | |
| env: | |
| BUCKET_NAME: ${{ secrets.AWS_S3_BUCKET_NAME}} | |
| run: | | |
| aws s3 sync \ | |
| ./dist s3://$BUCKET_NAME |