REACT 배포

jun5e00·2021년 5월 8일
0

들어가기

프론트 서버를 배포 하기 위해서 Nginx와 Apache를 고민하던 중, Nginx가 요새 많이 사용되기도 하고 성능이 좋고 가볍다고 해서 Nginx를 선택했다.
CI/CD를 사용하지 않는다면 도커 이미지를 만들어 줄 필요가 없지만, CI/CD를 위해서 도커를 살짝 맛봤다.

ec2 + nginx + docker로 서버 배포

ec2 인스턴스 생성 ( 보안 설정으로 포트를 열어줘야 함 + 탄력 ip 설정

사전 작업

진행 순서

  1. putty를 사용하여 인스턴스에 접속 ( ec2는 ubuntu를 사용함 )
  2. 접속 후, git clone <프로젝트 주소>
  3. 해당 프로젝트 디렉터리로 가서 nodejs 및 npm 설치
nodejs 설치 - curl -sL https://deb.nodesource.com/setup_12.x sudo -E bash - sudo apt-get install -y nodejs

npm 설치 - npm install

  1. npm run build —> nginx에 build 디렉터리의 절대 경로를 넘겨주면 이 디렉터리 내의 index.html 파일을 읽어서 서버에 띄운다.

  2. sudo vi nginx.conf —> nginx.conf 파일 생성 ( 설정 파일 )

  3. sudo vi Dockerfile —> Dockerfile 생성 ( 도커 이미지를 만들기 위한 파일 )

  4. sudo docker build -t <파일 이름>:0.1 . ( 점을 꼭 찍어야 함 )

  5. sudo docker run -d —name <도커 이름> -p 3000:80 <파일 이름>:0.1

    nginx 설정에서는 listen 80이기 때문에 3000포트로 들어오면 80포트로 넘겨준다.

Dockerfile

  • 기본 명령어
    • COPY <복사할 파일 경로> <이미지에서 파일이 위치할 경로>
    • RUN <명령어>

Nginx

  • /etc/nginx/nginx.conf 를 기반으로 nginx가 돌아간다. 이 안에 http 마지막쯤에 include 되어 있는 파일들에서 server 설정을 가져온다.
  • /etc/nginx/sites-available에서 default 파일에 root에 빌드한 파일의 절대 경로를 지정해주거나, 새로운 .conf 파일을 생성해서 /etc/nginx/sites-enabled에 심볼 링크를 생성해도 된다.
  • 내가 사용한 방법은 /etc/nginx/conf.d 에 새로운 nginx.conf ( server 설정만 ) 를 만들어주었다.

참고 사이트

profile
공부 일기장

0개의 댓글