AWS 콘솔창 IAM 검색 후 들어가기

사용자 없을 시 추가

권한 추가 클릭 -> 직접 정책 연결 체크

policy name 3가지 추가

• AdministratorAccess
• AmazonS3FullAccess
• CloudFrontFullAccess
• 참고 사진

밑에 내리면 Access keys 에 create Access key 버튼 클릭

• Command Line Interface (CLI) —> 첫번째 체크창 선택!
• Confirmation 체크!
• 참고 사진

생성 후 csv 파일을 꼭 저장해야합니다 !!!

이제 깃허브로 이동해서 레퍼지토리로 이동

settings 페이지 왼쪽 메뉴에 secrets and variables > Actions 클릭

new repository secret 클릭 —> 총 4개 등록

• AWS_ACCESS_KEY_ID => 6번의 csv 파일에 “Access key ID” 값 입력
• AWS_SECRET_ACCESS_KEY_ID => 6번의 csv 파일에 “Secret access key” 값 입력
• AWS_S3_BUCKET => AWS에서 생성한 S3 버킷 이름 입력
• DISTRIBUTION_ID => AWS에서 생성한 cloud front 아이디 입력
• 슬랙 알람은 나중에! 일단 4가지만 입력한다

vscode로 이동

.gitbub 폴더를 생성 후 그 폴더 안에 workflows 폴더 생성

workflows 폴더 안에 main.yml 파일 생성 후 코드 추가

# .github > workflows > main.yml

name: my-front
on:
  push:
    branches:
      - main

jobs:
  build:
    runs-on: ubuntu-latest
    env:
      AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
      AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY_ID }}
      AWS_REGION: 'ap-northeast-2'

    steps:
      - name: Checkout source code.
        uses: actions/checkout@master

      - name: Upload binary to S3 bucket
        uses: jakejarvis/s3-sync-action@master
        with:
          args: --include '*' --exclude '.git*/*' --exclude '.git*'
        env:
          AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}

      - name: Invalidate cache CloudFront
        uses: chetan/invalidate-cloudfront-action@master
        env:
          DISTRIBUTION: ${{ secrets.DISTRIBUTION_ID }}
          PATHS: '/*'
        continue-on-error: true

폴더 구조

커밋 후 메인 브랜치로 push

레포지토리 Action 탭으로 이동하면 내가 커밋한 내용들이 올라온 것을 볼 수 있습니다

끝!