29일차 docker

Sprint - 애플리케이션 컨테이너화 Pair

 

Bare minimum requirement

repository 주소

 

풀스택 애플리케이션은 다음 아키텍처로 구성되어 있습니다.

1. frontend 디렉토리에 있는 파일이 이미지로 빌드되어야 합니다.

• Apache HTTP Server (httpd:2.4)를 base image로 삼아야 합니다. - 컨테이너 내 80 포트로 접속 시, frontend/index.html이 표시되어야 합니다.
• frontend/Dockerfile을 채워넣으세요.

 

먼저, 프론트앤드의 docker file부터 구성을 하였다.

 

httpd:2.4까진 작성이 되어있었고 copy에 "호스트의 현재 경로에 있는 파일을 생성할 이미지 /usr/local/apache2/htdocs/ 에 복사한다"라는 코드를 넣은 후 

docker build --tag frontend:2.0 .

 

으로 이미지를 만든 후

docker run --name frontend -p 80:80 frontend:2.0

 

 

frontend이미지로 컨테이너를 80번 포트에 실행시켰다.

 

 

 

 

 

2.  backend 디렉토리에 있는 파일이 이미지로 빌드되어야 합니다.

• Node.js 이미지 (node:16-alpine)를 base image로 삼아야 합니다.
• 컨테이너 내 80 포트로 접속 시, hello from server가 응답으로 표시되어야 합니다.
• backend/Dockerfile을 채워 넣으세요.

먼저, 백앤드에서 Dockerfile부터 구성을 하였다.

 

 

참조 

WORKDIR /usr/src/app
## 앱 디렉터리 생성

# 앱 의존성 설치
# 가능한 경우(npm@5+) package.json과 package-lock.json을 모두 복사하기 위해
# 와일드카드를 사용
COPY package*.json ./

RUN npm install
# 프로덕션을 위한 코드를 빌드하는 경우
# RUN npm ci --only=production

# 앱 소스 추가
COPY . .

EXPOSE 3333 : 80

CMD [ "node", "app.js" ]
#서버를 구동하도록 node app.js을 실행하는 기본 npm start

 

그 후 dockerfile로 이미지를 만든 후

 

 컨테이너로 실행시켰다.

 

 

 

 

 

 

3.  docker-compose.yml 파일을 통해 두 이미지가 동시에 실행되어야 합니다.

• 두 이미지는 아키텍처에 표시되어 있는 포트 번호로 서로 통신할 수 있어야 합니다.
• frontend는 backend에 의존성을 가집니다.
• docker-compose.yml을 채워 넣으세요.

 

docker-compose.yml 파일을 만들었다.

httpd라는 서비스를 compose 할 거라고 명시하고 있고 이미지는 frontend:2.0 을 쓸거고 특별한 오류가 없으면 항상 restart하고 외부내부포트는 80번 컨테이너 이름은 client이다.

 

node라는 서비스를 compose할거라고 명시하고 있고 이미지는 backend:2.0을 쓸 거고 특별한 오류가 없으면 항상 restart 하고 외부포트는 3333번 내부포트는 80번이고 컨테이너 이름은 server이다.

 

이렇게 작성 후 

docker-compose up
# -d 옵션을 함께 사용하면, 컨테이너를 백그라운드로 실행할 수 있습니다.

으로 compose를 하였다.

 

그럼 두 개의 컨테이너가 돌아가며 compose 하였기에 동일한 docker 네트워크에 구성돼서

 

서버로부터 메시지를 받아오는 것을 확인할 수 있다.