이 블로그 게시물에서는 Docker를 살펴보고 간단한 Nginx 애플리케이션을 사용하여 다단계 Docker 빌드를 만드는 방법을 살펴보겠습니다. Docker를 처음 시작하는 경우 걱정하지 마세요. 따라하실 수 있도록 모든 것을 단계별로 설명하겠습니다!
우리가 작업할 Dockerfile은 다음과 같습니다.
FROM node:18-alpine AS installer WORKDIR /app COPY package*.json ./ RUN npm install COPY . . RUN npm run build FROM nginx:latest AS deployer COPY --from=installer /app/build /usr/share/nginx/html
이제 이 Dockerfile에서 일어나는 일을 단계별로 풀어보겠습니다.
이 줄은 Docker Hub에서 공식 Node.js 이미지(Alpine Linux의 버전 18)를 가져옵니다. Docker Hub를 이미지 라이브러리로 생각하세요. 이 줄을 사용하여 Node.js를 빌드의 첫 번째 단계에 대한 기본 이미지로 사용하겠다고 지정합니다.
이 명령은 컨테이너 내부의 작업 디렉터리를 /app으로 설정합니다. 데스크탑에서 파일을 구성하는 방법과 유사하게 컨테이너 내에 애플리케이션 전용 폴더를 생성하는 것으로 생각할 수 있습니다.
여기서 로컬 디렉터리의 package.json 및 package-lock.json 파일을 컨테이너의 작업 디렉터리로 복사합니다. 이 파일에는 애플리케이션에 필요한 종속성에 대한 정보가 포함되어 있습니다.
이 명령은 package.json에 지정된 모든 종속성을 설치하는 npm install을 실행합니다.
이 줄은 나머지 애플리케이션 파일을 컨테이너에 복사합니다. 로컬 디렉터리의 모든 항목을 컨테이너 내부의 /app 디렉터리로 가져옵니다.
이제 npm run build 명령을 사용하여 애플리케이션을 컴파일합니다. 이 단계에서는 일반적으로 코드(이 경우 React)를 사용자에게 제공할 준비가 된 정적 번들로 변환합니다. 이 명령의 출력은 /app 내의 빌드 디렉터리에 저장됩니다.
이 줄에서는 새로운 기본 이미지인 Nginx로 전환합니다. Nginx는 방금 구축한 것과 같은 정적 파일을 제공할 수 있는 강력한 웹 서버입니다. 이것이 다단계 구축 프로세스의 두 번째 단계의 시작입니다.
여기에서는 이전 단계(설치 프로그램)에서 빌드된 애플리케이션 파일을 Nginx 제공 디렉터리에 복사합니다. --from=installer 플래그는 Docker에게 방금 정의한 설치 프로그램 단계에서 파일을 가져오도록 지시합니다.
Dockerfile이 설정되면 다음 명령을 사용하여 Docker 컨테이너를 빌드하고 실행할 수 있습니다.
FROM node:18-alpine AS installer WORKDIR /app COPY package*.json ./ RUN npm install COPY . . RUN npm run build FROM nginx:latest AS deployer COPY --from=installer /app/build /usr/share/nginx/html
your-app-name을 원하는 이름으로 바꾸세요. -dp 플래그는 컨테이너를 분리하고 호스트 시스템의 포트 3000을 컨테이너의 포트 80에 매핑하여 http://localhost:3000에서 앱에 액세스할 수 있도록 합니다.
그리고 거기에 있습니다! Nginx를 사용하여 애플리케이션 개발부터 프로덕션까지 진행하는 다단계 Docker 빌드를 만들었습니다. 진행 과정에 대해 질문이나 의견이 있으시면 아래에 댓글을 남겨주세요!
이 설정으로 작업할 때 흔히 발생하는 문제 중 하나는 올바른 포트 번호를 매핑하는 것을 잊어버리는 것입니다. Nginx는 일반적으로 컨테이너 내부의 포트 80에서 수신 대기하지만 로컬 컴퓨터에서 앱에 액세스하려는 경우 컨테이너에서 컴퓨터로 올바른 포트를 전달해야 합니다. 예를 들어, localhost:3000에서 앱에 액세스하려면 -p 3000:80 플래그를 사용하여 컨테이너를 실행하여 컴퓨터의 포트 3000을 컨테이너의 포트 80에 매핑해야 합니다.
이 단계를 놓치면 왜 모든 것이 완벽하게 구축되었으나 브라우저에서 앱에 접근할 수 없는지 궁금할 것입니다!
@piyushsachdeva
3일차 영상
위 내용은 CKA 풀 코스 데이 Ulti Stage Docker Build의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!