Nextjs를 github action, EC2, pm2로 CI/CD 구축하기(1)

CGH96·2023년 7월 24일
2
post-thumbnail

# 서론

최근 진행하고 있는 프로젝트의 CI/CD를 구축하려 한다. react의 경우는 cloudfront, s3를 통해 배포해 보았고, nextjs는 amplify(serverless)로 간단하게 구축해보았다. 이번에는 웹 인프라에 대한 이해도를 좀 더 올릴 겸 EC2에 배포해 보기로 했다. 블로그에 정리하기로 마음 먹은 이유는 대부분의 글들이 처음부터 끝까지 온전히 정리된 글들이 없었다. 또한 특정 툴을 왜 쓰는지와 같은 내용들이 빠져 있어 내 컴퓨터에서 온전히 실행되지 않는 경우, 대처를 어떻게 해야할지 난감했다. 전체 흐름을 파악하고 배포에 성공하기까지 여러 글들을 읽으며 취합하는 과정이 상당히 수고스러워서 정리해보려 한다.



# 계획

나는 다음 툴들을 사용할 것이다.

  • Github aciton
  • S3
  • CodeDeploy
  • EC2 (pm2)

위 그림을 말로 풀자면 다음과 같은 순서다.

1. main 브랜치에 코드가 push되면 github action이 S3에 코드를 업로드한다.
2. S3에 업로드된 코드를 CodeDeploy가 EC2에 배포한다.
3. nodejs 프로세스 매니저인 pm2를 사용하여 백그라운드에서 nextjs app이 계속 실행되도록 한다.
4. 사용자는 IP를 통해 EC2에 접근하여 EC2에서 실행중인 nextjs에 app을 볼 수 있다. (도메인 연결은 하게 된다면 추가로 작성)

github action으로 바로 EC2에 꽂아넣으면 될 것 같지만 굳이 S3를 한번 거치는 이유는 github action으로 EC2에 바로 꽂을 수 없기 때문이다. 지금까지 구글링 한 바로는 그렇다.

pm2를 사용하는 이유는 EC2 내에서 백그라운드로 nextjs app을 실행시면서 다른 작업들을 하기 위해서다. 지금은 nextjs 하나만 실행되고 있기 떄문에 굳이 필요는 없지만, 백엔드 서버를 같이 EC2에 넣는 등 여러 상황에서 pm2가 있는게 좋다.

과정도 길고 복잡해서 글이 아주 길어질 예정이다. 이번 포스팅에서는 EC2 인스턴스 설정까지만 작성해보려 한다.

# EC2 인스턴스 생성

인스턴스 시작을 누르자.




웹서버 이름을 정하고, 설치할 OS 이미지와 버전을 고르자. 나는 Ubuntu 22.04LTS를 설치했다.




스크롤을 내려서 인스턴스 유형, 키 페어를 선택해주자.
인스턴스 유형같은 경우 나는 과금을 할 생각이 없어서 프리티어 사용이 가능한 t2.micro를 선택했다.

키 페어는 나중에 ssh로 내가 만든 EC2 인스턴스에 로그인할 때 필요한 키이다. 아마 이 글을 보는 사람들 대부분은 만들어둔 키 페어가 없을 것이다. 새 키페어 생성을 눌러서 키를 만들고 방금 만든 키를 선택해주자. 아마 [키 이름].pem 파일이 자동으로 다운로드 될 텐데 잘 저장해두자. 계속 쓰인다.




이어서 네트워크 설정도 해주자. EC2 배포를 위한 세팅은 SSH를 통해서 할 것이고, HTTPS, HTTP는 누구나 브라우저를 통해 내 코드가 들어있는 EC2에 접근할 수 있도록 하기 위함이다.




스토리지 구성. 나는 20gb로 해주었다. EC2 서버에서 nextjs를 구동하기 위해 nodejs, npm 등 설치할 것들이 많으니 맘 편하게 넉넉히 해주자.




이제 인스턴스 생성을 누르고 생성하면 된다.
인스턴스 탭서 내가 만든 인스턴스를 확인할 수 있다.




그리고 내가 만든 인스턴스의 인스턴스 ID를 누르고 하단에 태그 탭을 들어가자.

태그 관리를 누르고 Key와 Value에 값을 넣어서 태그를 추가해주자. (Value는 선택)
이 태그는 CodeDeploy에서 코드를 배포할 EC2 인스터스를 식별하기 위한 것이다.




이제 public IP를 할당 받아서 내가 만든 EC2 인스턴스에 연결해주자. 이 IP를 통해 사람들이 EC2 인스턴스에 접근할 수 있다. EC2인스턴스를 그냥 사용하게 되면 IP가 동적으로 변한다. 그래서 IP 할당받아 고정적인 IP로 접근할 수 있게 하는 것이다. 배포할 것이라면 필수다.
네트워크 및 보안 - 탄력적 IP탭에 들어가자.

할당 받은 IP를 내가 만든 EC2 인스턴스에 연결시켜야 한다.
IP주소 클릭 - 탄력적 IP 주소 연결 클릭

연결할 인스턴스 선택하고, 연결 클릭




아까 다운로드 받은 .pem키로 SSH을 통해 EC2 인스턴스에 로그인 해보자.
나같은 경우는 윈도우다. powershell을 관리자 권한으로 실행시켜주자.

  1. .pem키가 있는 곳으로 이동


  2. .pem키의 권한 설정 (소유자만 READ할 수 있도록)

아래 명령어는 linux shell명령어이다. Mac을 사용한다면 터미널에서 아래와 같은 명령어로 권한설정을 해주면 된다. 하지마 윈도우는 chmod를 지원하지 않는다.

  chmod 400 [.pem키 위치 경로]/[.pem키 파일명]

다음은 window에서 권한설정 하는 방법이다.
1. 파워쉘을 관리자 권한으로 열기
2. 파워쉘에서 .pem키가 존재하는 위치로 이동
3. 다음 명령어 입력

icacls.exe [파일명.pem] /reset
icacls.exe [파일명.pem] /grant:r "$($env:username):(r)"
icacls.exe [파일명.pem] /inheritance:r



자, 이제 .pem키의 권한이 바뀌었다. 이 키로 로그인 해보자.
1. 파워쉘을 열자.
2. 파워쉘에서 .pem키가 존재하는 위치로 이동하자.
3. 다음 명령어 입력

ssh -i [경로명]/[파일명].pem ubuntu@[연결된 탄력적 IP] 
예시> ssh -i ChagokDeployInstance.pem ubuntu@15.165.168.62

로그인에 성공하면 파워쉘이 다음과 같이 바뀐다.


이제 CodeDeploy를 EC2에 설치하자. ssh에 계속 입력하면 된다.
AWS Ubuntu Server용 Code Deploy 에이전트 설치

sudo apt update
sudo apt install ruby-full
sudo apt install wget
cd /home/ubuntu
wget https://aws-codedeploy-ap-northeast-2.s3.ap-northeast-2.amazonaws.com/latest/install
chmod +x ./install

**아래 명령어는 둘 중 하나 (버전 체크 잘하기!!!)**
sudo ./install auto (20.04 제외)
sudo ./install auto > /tmp/logfile (20.04 버전)

CodeDeploy를 설치했다면 잘 실행되고 있는지 확인해보자.

sudo service codedeploy-agent status

아래와 같이 뜬다면 잘 동작하고 있는 것이다.

error: No AWS CodeDeploy agent running와 같은 메시지가 표시되면 서비스를 시작하고 다음 두 명령을 한 번에 하나씩 실행하자.

sudo service codedeploy-agent start
sudo service codedeploy-agent status



이제 EC2 인스턴스에 IAM설정을 해주어야 한다.


액세스관리 - 역할 탭에 들어가서 역할을 만들자.




AWSCodeDeployFullAccess, AmazonS3FullAccess, AmazonEC2RoleforAWSCodeDeploy추가



역할 이름 작성하고, 권한 추가가 잘되었는지 확인하자.



이제 생성된 role을 EC2인스턴스에 연결하자.
EC2인스턴스 우클릭 - 보안 - IAM 역할 수정

이렇게 하면 EC2인스턴스에 대한 설정은 끝났다. 나머지는 다음 편에서...

0개의 댓글