Docker Network

Docker에서 Container 사이의 통신을 위해 같은 네트워크에 포함 시킨 후 컨테이너명을 이용해 접근을 할 수 있었다.
다음과 같은 코드가 backend 컨테이너에 접근하는 방식이다.

const response = await fetch('http://backend:8080/');

하지만, 다음은 사용 불가능하다.

Network 방식

• Docker는 컨테이너 내부 코드를 실행할 때, 컨테이너명을 ip로 변환하여 실행한다!

In React

• React코드는 컨테이너 내부에서 실행하지 않음!
• 항상 웹브라우저에서 실행됨
• 즉, 브라우저는 컨테이너명을 이해하지 못함!
  
  

React에서 사용하기

backend 설정

docker run -p 8080:8080 backend

다음과 같이 -p를 이용해서 Host와 연결

React 에서

const response = await fetch('http://localhost:8080/');

다음과 같이 localhost로 사용한다!

끝내면서

리액트와 스프링를 도커 컨테이너를 이용해서 구성하면서 한참 고생을 하였다. 도커를 사용하면서 도커가 네트워크를 어떤 방식으로 사용하는지 사용하는 언어는 어떤 특성이 있는지 이해하는 것이 아주 중요하다!