AWS EC2와 Github Actions로 프론트엔드 CI/CD 구축하기 ( 1 )

이진혁·2023년 1월 27일
3
post-thumbnail

1. 프로젝트 생성

먼저 프로젝트를 생성하자.

나는 Next.js로 프로젝트를 구성할 것이기 때문에 Create-Next-App 을 사용하려고 한다.

React로 진행하려는 프로젝트라면 Create-React-App을 통해 프로젝트를 생성해주자.

당연한 이야기겠지만 프로젝트 이름은 어떤 걸로 지어도 상관없다.

yarn create next-app myTamra --typescript

2. EC2 인스턴스 생성하기

인스턴스 생성

EC2를 검색해서 들어간 후 인스턴스 시작을 누른다.

원하는 인스턴스의 이름 및 태그를 생성해주자.

어떤 이름이든 상관은 없다.

나같은 경우 프로젝트의 이름과 똑같이 생성해주었다.

애플리케이션 및 OS 이미지(Amazon Machine Image)

나는 소프트웨어 운영 체제로 ubuntu를 골랐다.

꼭 ubuntu를 고집할 필요는 없지만 가장 보편적으로 사용되고 참고할 레퍼런스도 많기 때문에 선택했다.

그 다음 Ubuntu의 버전을 선택할 수 있는데 현재 (23년 1월 기준) Ubuntu는 22.04 버전과 20.04 버전이 나와있다.

나는 ubuntu 버전으로 최신 버전(22.04)이 아닌 20.04 버전을 선택해 주었다.
그 이유는 나중에 ubuntu에 code deploy agent를 설치해주어야 하는데 이를 위해 ruby 2점대 버전이 필요하다.
하지만 22.04에서는 ssm agent와 호환이 맞지 않아 ruby 3점대 버전이 설치되기 때문에 ruby 버전을 다운그레이드 하기 위해 여러가지 작업들이 필요하고, Ubuntu 인스턴스에 여러 가지를 설치해야하는데 버전 호환성을 고려해야 하기 때문에 편의상 20.04를 설치했다.

인스턴스 유형

그 다음 인스턴스 유형을 선택해야 한다.

하지만 프리티어는 t2.micro 밖에 없으므로 t2.micro를 선택하면 된다.

프리티어가 아닌 사람들은 본인의 프로젝트 규모에 맞게 인스턴스를 적절히 선택하면 될 것 같다.

키 페어(로그인) 생성

키 페어 이름은 마찬가지로 임의로 설정한다.

새 키페어 생성을 눌러주자.

키페어를 성공적으로 생성했다면 이렇게 pem 파일이 다운로드 되었을 것이다.

키 페어 유형은 RSA 형식으로 하고, 파일 형식은 .pem으로 설정해준다.

이 키페어는 정말로 중요한 파일이다.
이 키페어가 유출되어 해커들에게 악용된다면 AWS 요금폭탄을 맞을 수 있으니 각별히 유의하자.

네트워크 설정

이제 네트워크를 설정해야 한다.

오른쪽 위에 있는 편집 버튼을 눌러 세부 설정으로 들어가 추가적인 설정을 해주자.

나는 이미 편집 버튼을 눌렀기 때문에 사진상 편집 버튼이 없다.

편집 버튼을 누르게 되면 위와 같이 인바운드 규칙을 설정해 줄 수 있다.

나는 기본적인 ssh 설정을 포함해 http,https 설정을 해주고 0.0.0.0/0 과 ::/0 모두 설정해주었다.

ssh는 이 인스턴스의 주인 즉, 우리다. 우리가 키 페어를 통해 인스턴스에 접속할 때 이 ssh를 사용하니 혹여나 제거하지 말자!

스토리지 구성

다음은 스토리지 구성이다.

스토리지는 우리 인스턴스의 저장 공간이라고 생각할 수 있는데 기본적으로 8GB가 설정되어있다.

8GB를 보편적으로 설정해주지만 예전에 8GB로 설정해주었다가 용량이 부족해 에러가 발생한 적이 있어 40GB로 설정해 주었다.

프리티어는 30GB까지 제공해주기 때문에 안심하고 30GB까지 설정 가능하니 이점 참고해서 본인 프로젝트 규모에 맞게 적절히 설정해주자.

인스턴스 시작

나의 경우 고급 세부정보는 따로 설정할 일이 없어 넘어갔고 이제 인스턴스 시작을 눌러 인스턴스를 가동시키자.

성공적으로 인스턴스를 생성했다면 위와 같은 화면이 보일 것이다!

profile
개발 === 99%의 노력과 1%의 기도

1개의 댓글

comment-user-thumbnail
2024년 7월 20일

프로젝트 배포에 많은 도움이 되었습니다! 자세한 상황 설명과 캡쳐본이 있어 거의 헷갈리지 않고 따라갈 수 있었네요. 좋은 글 감사합니다. 😄

답글 달기