[AWS] 리액트 프로젝트 도커라이징해서 EC2에 배포하기

 

1. 도커파일 작성

# Node.js 이미지를 베이스로 사용
FROM node:latest

# 작업 디렉터리 설정
WORKDIR /app

# 애플리케이션 파일들을 컨테이너로 복사
COPY . /app

# 의존성 설치
RUN npm install

# 빌드
RUN npm run build

# 런타임 이미지 선택
FROM nginx:alpine

# 빌드 파일을 Nginx 서버의 루트 디렉터리로 복사
COPY --from=0 /app/build /usr/share/nginx/html

# 80 포트 열기
EXPOSE 80

# Nginx 실행
CMD ["nginx", "-g", "daemon off;"]

 

프론트엔드 서버는 nginx로 실행해주고, 해당 프로젝트는 npm을 사용했다.

 

2. 도커 이미지 빌드

프로젝트 루트 디렉토리에서 프로젝트를 도커 이미지로 빌드해준다.

docker build -t projectname .

 

 

3. 빌드한 도커 이미지가 실행 되는지 테스트

docker run-p 8080:80 projectname

 

이렇게 뜨고 도커 데스크탑에서 해당 주소로 접속했을 때 프론트 화면이 뜬다면 성공한 것이다.

 

 

4. 도커 이미지를 도커 허브에 푸시

로컬에서 이미지 태그를 지정하고 도커허브에 이를 푸시한다.

docker tag projectname dockerhub-username/projectname
docker push dockerhub-username/projectname

 

 

5. 내가 만든 ec2 인스턴스에 접속해서 푸시한 이미지를 다시 풀받는다. (GCP도 동일하게 진행)

docker pull dockerhub-username/projectname:latest

 

 

6. 이미지를 실행하고 퍼블릭 ip로 접근한다.

docker run -d -p 80:80 dockerhub-username/projectname:latest