이번주에 배포를 처음해본 프론트엔드 쌉 주니어입니다.
이번 편은 저의 첫 배포에서의 시행착오와 발생했던 에러들에 대해서 담아볼까 합니다.
목차
1. IAM 유저 생성
2. S3 버킷 생성
3. Github-actions 연결
1. IAM 유저 생성
1 - 1. S3, AWS Cloud 사용을 위한 Access 추가
2. S3 버킷 생성
** 가비아에서 도메인 구매 후 연결할 예정이시라면,
꼭 도메인 이름과 버킷 이름을 통일하시길 바랍니다..
( EX. 버킷이름 - domain.com )
2 - 1. 버킷 생성
- ACL활성화 > 버킷 소유자 선호
- 퍼블릭 액세스 차단 해제
2 - 2. 정적 호스팅 설정
생성된 버킷 속성 탭(properties)에서 정적 호스팅(Static website hosting)을 찾는다.
정적 호스팅(Static website hosting) - 속성(properties)탭 맨 밑에 있었다 (2024.05 기준)
2 - 3. 권한 편집
권한 탭에서 버킷 정책(Bucket policy)으로 들어와줍니다.
** 정책 붙여넣을 때, /* 를 꼭 붙여줄 것
그리고 index.html을 넣어서 꼭꼭 확인해보자
3. Github-Actions 워크플로우 설정
github-actions에 워크플로우를 추가해줄 차례다
3 - 1. Github Secret 생성하기
Repository secrets에
AWS_ACCESS_KEY_ID,
AWS_SECRET_ACCESS_KEY,
AWS_DEFAULT_REGION,
AWS_BUCKET_NAME(actions.yml 파일과 통일만 하면 됨 ! )
을 필수적으로 생성한다.
▼ AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY 인증키 받는 방법
만들어두었던 IAM계정에서 Access Key에 있는 Create access key 발급받기 !!
CLI를 선택하고 만들어주었다.
처음 만들 때만 id와 key를 발급받을 수 있으니, Id와 key가 담긴 csv파일을 다운로드하고 저장해두기
3 - 2. Github Actions 작성하기
1) 깃허브 actions 탭에서 바로 추가해줘도 되구 , workflow에 가서 작성해도 된다.
2) 파일에 .github/workflows 파일을 생성한 후 작성해주어도 된다 ~
빌드에 계속 실패 했었는데
1. 버전 오류 (node 18 > node 20)
2. 브랜치 이름 (main인데 master로 브랜치 설정)
이 문제들 때문에 실패하던 것이었다.
깃허브 actions에서 에러 이유 또한 확인할 수 있으니 잘 활용해보자
빌드 완료 후 S3 버킷 엔드포인트로 접속이 가능하고 업데이트 시 버킷에 반영된다 ~
이제 남은 단계는
1. 가비아 도메인 구매
2. AWS Route53 과 도메인 연결
3. ACM 인증서 발급과 CloudFront를 통해 http에서 https로 배포
[참고]
https://docs.github.com/ko/actions