1. docker 로 react 프론트 서버를 3000번 포트로 띄운다.
- 도커파일에 node 이미지를 기반으로 RUN 명령어로 리액트를 실행한다.(start)
- 도커파일을 이미지화한다.
- 3000:3000 포트 옵션을 주어 컨테이너를 실행한다.
- nginx 설정에서 / 로 들어오는 요청을 http:127.0.0.1:3000 으로 매핑한다.
- 정적 파일 경로를 따로 설정할 필요가 없다.
- 리액트 컨테이너에 이미 있다.
- 간편하다.
2. docker 로 nginx를 띄울 때 프론트 서버를 빌드하고 그 정적파일을 nginx 경로로 옮긴다.
- 도커파일을 빌드 + 런 두개로 구성한다.
- 빌드에서는 프론트 서버를 빌드한다.
- 런에서는 nginx 이미지를 기반으로 하여 위 빌드단계에서 만들어진 build (정적데이터) 를 nginx 경로로 COPY한다.
- 필요시 default.conf 도 COPY 한다.
- nginx 이미지를 빌드한다.
- 위 이미지를 80:80 포트 옵션을 주어 컨테이너를 실행한다.
- 도커파일 작성이 핵심이다.
- 엔진엑스 이미지를 도커로 띄우는 형식이다.
나는 2번을 선택했다. 1번보다 번거롭다. 그런데 왜..?
처음에는 nginx 의 고유한 기능(정적 파일을 서빙하고 동적 요청을 포트포워딩) 을 살리는 방법이라고 생각했다.
그런데 도커를 써서 리액트서버를 돌리고 연결하는 것과 저렇게 따로 파일을 두는 것에 어떤 차이가 있는지... 좀 더 알아봐야겠다.
1번은 프론트를 빌드하지 않고, 2번은 프론트를 빌드하는데 어떤 차이를 불러오는 것일까..
캐시의 차이? 속도차이? 보안에서의 차이..?
궁금하다...