개인 프로젝트/프론트 개발

Docker Desktop에서 실시간 코드 반영 (바인드 마운트 설정)

Hx2y98 2024. 12. 21. 20:58

일단 프론트까지 환경설정을 하고 수정을 해보려고 하니까 실시간 반영이 막혀있었다. 

찾아보니 코드 수정시 컨테이너를 다시 빌드해야 코드 변경이 반영 된다고 한다. 

이러기엔.. 매번 하기 귀찮으니 바인드 마운트라고 실시간으로 코드를 반영 가능하게 해보자. 

 

1. 컨테이너 재실행  

stop 버튼을 누른다. - doker desktop 에서는 gui 를 통해 편리하게 도커를 사용 가능하도록 지원해주니까 이용하도록 하자.

네모난 사각형을 누르면 된다.

2. 컨테이너 삭제

정지된 컨테이너를 쓰레기통 아이콘을 선택하여 삭제하도록하자.  삭제하지 않고 지속적으로 사용한다면 기존에 빌드된 이미지를 사용한다. 

 

삭제 ㄱㄱ

3. 이미지 다시 빌드 

다음의 명령어를 통해 다시 빌드 하도록 하자. 

docker build -t stock-frontend .

 

4. 바인드 마운트 설정

기존에는 그냥 docker run을 통하여 실행하였지만 , 이번에는 바인드 마운트를 추가하여 설정하도록 하자. 

docker run -p 3000:3000 -v /path/to/your/project:/app stock-frontend

 

가운데 path/to/your/project는 자신의 프로젝트 경로를 입력하면 된다 .

 

 다음과 같이 실행하면 로컬의 코드가 즉시 반영되게 된다. 

 

 

이러한 바인드 마운트는 개발단계 이기 때문에 추천하는 방식이다. 수정할때 마다의 컨테이너 재빌드를 

할필요가 없기 때문이다. 

 

운영 배포를 하게 된다면 이를 제외하고 처리하도록 하자 .

 

'개인 프로젝트 > 프론트 개발' 카테고리의 다른 글

CSS - Shadcn/ui , tailwindcss 적용하기  (1) 2024.12.25