[AWS EC2] EC2에 React 앱 + Node.js 서버 배포 1 - VPC, EC2 생성

AWS 각 서비스를 공부하기 이전에 한 EC2에 1. React로 만든 프론트엔드 프로젝트를 Nginx를 통해 실행하고 2. Node.js와 express를 사용한 백엔드 프로젝트를 실행하여 전체적인 하나의 웹 서비스를 배포해보려고 한다.

 

전체 구성도는 다음과 같다.

 

 

먼저 이를 위해 개인 VPC를 생성하고 Security Group을 만들어 웹 프로젝트를 배포할 EC2를 띄워보겠다.

기본 VPC를 사용할 예정이라면 1~4 과정은 건너뛰고 보안그룹(Security Group) 생성부터 진행하면 된다.

 

1. AWS console에 접속하여 로그인하고 vpc 검색 후 vpc 생성을 클릭

 

2. vpc 이름과 IPv4 CIDR 블록을 지정하고 Name 태그 작성 후 생성 (예제에서는 10.127.0.0/16 을 사용)

 

 

3. 왼쪽 내비게이션에서 서브넷 선택, 서브넷 생성 (예제에서는 가용영역 2a(10.127.1.0/24), 2c(10.127.2.0/24)에 서브넷 생성)

 

 

4. 왼쪽 내비게이션에서 인터넷 게이트웨이 선택, 생성 후 VPC와 연결 (기존에 생성한 VPC 선택)

 

 

5. 라우팅 테이블 생성

 

위에서 생성한 인터넷 게이트웨이 라우팅 추가

퍼블릭 서브넷 연결

 

6. 왼쪽 내비게이션에서 Security Group 생성 및 인바운드 규칙 설정

 

 

7. EC2 검색 및 인스턴스 시작

 

AMI 선택

인스턴스 유형 선택

VPC, 서브넷(예제에서는 2a) 선택

스토리지 크기 조정 (30GB까지 프리티어 가능)

Name 태그 추가

보안 그룹 선택

SSH 접속을 위한 키 페어 생성 (기존 키 페어가 있는 경우 기존 것 선택) 및 키 페어 다운로드!!!

 

8. 생성된 EC2에 SSH로 접속하기

(1) 다운받은 .pem 키 접근 권한 변경

 

$ chmod 600 pem파일이름.pem

 

(2) 아래 명령어로 EC2 접속 (Amazon Linux 2 또는 Amazon Linux AMI의 경우 사용자 이름은 ec2-user)

 

$ ssh -i pem경로 사용자이름@ec2의_퍼블릭_IPv4_주소_또는_도메인

 

(3) 참고: https://hanbee1005.github.io/aws/ec2/ssh/mac/2021/10/08/aws-ec2-ssh.html

---

지금까지 구성한 내용을 그림으로 살펴보면 다음과 같다.

 

 

다음 글에서는 생성한 EC2에 Nginx를 설치하고 react 프로젝트를 실행해보겠다.