Docker를 활용한 노드(React) 실행 환경 구축

간단한 도커 활용법을 익히기 위한 도커를 활용한 노드 실행 환경 구축

로컬에 노드 실행 환경을 구축하지 않고 도커의 컨테이너 기술을 활용하여 실행 환경 구축

1. 도커 허브에 등록된 노드 이미지 검색

2.  node 이미지 실행

 docker container run -d -v /c/test:/tmp/react-app -p 80:3000 node tail -f /dev/null

-v /c/test:/tmp/react-app

/tmp/react-app와 c:\test 파일을 볼륨 매핑 해줍니다.

-p 80:3000

80 포트를 3000번 포트로 포트 포워딩 해 줍니다.

tail -f /dev/null

데몬 환경에서도 꺼지지 않게 해줍니다.

 docker exec -it dbe /bin/bash

/bin/bash를 통해 컨테이너 접속합니다.

root@dbe21686db9c:/# cd tmp
root@dbe21686db9c:/tmp# npx -y create-react-app react-app

그럼 c:\test 아래에 react-app이 생성됨

 

root@dbe21686db9c:/tmp# cd react-app
root@dbe21686db9c:/tmp/react-app# npm start

localhost:80으로 접속 시 react가 정상적으로 작동하는 것을 확인할 수 있습니다.

 

3. dockerfile 정의 

FROM    node 
WORKDIR /tmp
RUN npx -y create-react-app react-app
WORKDIR /tmp/react-app
CMD [ "npm","start" ]

도커 파일 정의

docker image build -t react-app .

도커 파일이 있는 곳에서 도커 이미지를 빌드해 줍니다.

3-1(최초 실행 시)

최초 실행 시에 볼륨매핑을 할 경우 로컬에 비어있는 파일이 컨테이너 내부로 덮어 씌워져 파일이 사라지기 때문에 최초 실행시 컨테이너 내부에서 파일을 복사하여 실행시켜줘야 합니다.

docker create --name dummy react-app

빌드한 이미지를 컨테이너 생성

docker cp dummy:/tmp/react-app /test

※오류 날 경우 cmd를 관리자 권한으로 실행

더미 안에 있는 데이터를 호스트 pc로 가져옵니다.

docker rm dummy

컨테이너 삭제

docker container run  -v c:\test\react-app:/tmp/react-app -p 80:3000 react-app

볼륨 매핑과 포트 포워딩을 해주면 위와 동일한 결과를 얻을 수 있습니다.