220605 [AWS] AWS Amplify 사용법 / React 자동 배포 (CI/CD) / https, 깃허브 브랜치 연결 배포
1. AWS Amplify란?
Amplify Console은 Git 기반 워크플로를 통해 풀 스택 서버리스 웹 애플리케이션을 배포 및 호스팅 할 수 있는 AWS 서비스입니다. 즉, Git repository와 연동시킨 뒤, Git에 소스코드를 Push하는 것만으로 프로젝트가 빌드되고 그 결과물을 호스팅까지 해주는 서비스입니다.
2. 자동 배포 설정
1) AWS Amplify console 접속 하여 웹 앱 호스팅 시작하기
2) GitHub 연결 선택
3) branch 선택
자동배포가 이루어질 브랜치를 선택한다.
여기서 하나를 선택하더라도 나중에 다른 브랜치를 추가 선택할 수 있다.
4) 빌드 스펙 설정
이 부분은 자동으로 빌드 설정이 진행되기 때문에 어려운 부분은 없다.
5) 자동 배포
이제 등록한 깃허브 브랜치에 변화가 일어나면 자동으로 빌드와 배포가 이루어진다.
빌드시에 오류가 있다면 빌드 실패가 될수도 있으니 참고!
나같은 경우에는 develop 브랜치와 main 브랜치의 배포를 따로 나누어 테스트용과 실제 메인 서비스 url의 배포를 분리하였다. 이렇게 되면 develop에서 배포를 하여 배포버전을 테스트를 한 뒤 main에 최종 배포를 할 수있다는 장점이있다.
Amplify Console은 프론트엔드 프로젝트를 배포할 때, 내부적으로 S3와 CloudFront를 이용하여 호스팅한다. 자동 빌드가 완료되면 파일이 S3에 업로드되며, 이는 즉시 CloudFront까지 업로드 되는 형태라고 한다.. 그리고 새로운 빌드가 진행되어 이전과 같은 파일 이름으로 S3에 업로드 할 때는 버저닝을 하고, CloudFront는 새로운 버전이 확인되면 즉시 CloudFront에 새로 업로드하여 소스코드가 변경되면 바로바로 배포가 된다.
3. 환경 변수 설정
Amplify의 장점으로는 배포환경에 대한 환경변수를 별도로 설정할 수 있다는 점이다.
브랜치마다 또는 전체 브랜치에 동일하게 설정도 가능하여 아주 유용하게 활용하였다.
.env 파일과 같은 환경변수 이름과 값을 설정하면 된다. 다만 수정을 하게되면 재배포를 해줘야 적용이 되니 깃허브 해당 브랜치에 push가 필요하다.
4. 사용 후기
1) SSL 인증서 발급이 쉽다.
2) 배포 과정이 단순하여 초보자도 쉽게 할 수 있다.
3) 깃허브 브랜치 자동배포 기능
4) Custom Domain 설정이 간편하다.