Docker 컨테이너에서 React 응용 프로그램을 실행하는 방법은 무엇입니까?
Docker에서 React 앱을 실행하려면 DockerFile을 만들기 위해 DockerFile을 작성하고 프로세스를 정의하고 프로세스를 정의하고, 소스 코드를 복사하고, 종속성을 설치하고, 앱을 빌드하고, Serv 또는 Nginx와 같은 서버를 사용하여 정적 파일을 제공하십시오.
Docker 컨테이너에서 React 응용 프로그램을 실행하려면 Dockerfile을 사용하여 앱을 컨테이너 화하고 Docker 이미지를 작성한 다음 해당 이미지를 컨테이너로 실행해야합니다. 이 프로세스는 React 앱이 다른 환경에서 일관되게 실행되도록합니다.
Dockerfile을 설정하십시오
React App의 루트 디렉토리에서 DockerFile (확장 없음)이라는 파일을 만듭니다. 이 파일은 앱을 구축하고 컨테이너 내부에서 제공하는 방법을 정의합니다.
다음은 React App Project Create를위한 일반적인 Dockerfile입니다.
# 공식 노드 런타임을 기본 이미지로 사용합니다.
노드에서 : 18- 알파인
# 컨테이너 안에 작업 디렉토리를 설정합니다
WorkDir /App
# 패키지 파일을 복사하십시오
패키지 복사*.json ./
# 종속성을 설치합니다
NPM 설치를 실행하십시오
# 모든 소스 코드를 컨테이너에 복사하십시오
복사 . .
# React 앱을 구축하십시오
NPM 실행 빌드를 실행하십시오
# 정적 파일을 제공하기 위해 가벼운 웹 서버 설치
npm install -g serve를 실행하십시오
# 포트 3000 노출 ( 'Serv'의 기본값)
3000 노출
# 구축 된 앱을 제공하기 위해 서버를 시작하십시오
cmd [ "serv", "-s", "build"]
Docker 이미지를 작성하십시오
프로젝트 디렉토리에서 터미널을 열고 다음 명령을 실행하여 Docker 이미지를 작성하십시오.
Docker Build -t my-react-app.
이것은 My-React-App 으로 태그가 지정된 이미지를 만듭니다. DOT ( . )는 Docker에게 현재 디렉토리에서 dockerfile을 찾도록 지시합니다.
컨테이너를 실행하십시오
이미지를 작성한 후 컨테이너를 시작하십시오.
Docker Run -D -P 3000 : 3000 My -React -App
이 명령은 컨테이너를 분리 모드 ( -D )로 실행하고 호스트 시스템의 포트 3000을 컨테이너의 포트 3000에 매핑합니다.
브라우저에서 http : // localhost : 3000을 방문하여 React 앱이 실행되는 것을 확인하십시오.
선택 사항 : 생산에 nginx를 사용하십시오
생산에서 더 나은 성능과 제어하려면 서빙 대신 Nginx를 사용하십시오.
- 프로젝트에서 nginx.conf 파일 생성 :
서버 {
80;
위치 / {
루트/usr/share/nginx/html;
색인 index.html index.htm;
try_files $ uri $ uri / / index.html;
}
ERROR_PAGE 500 502 503 504 /50X.html;
위치 = /50x.html {
루트/usr/share/nginx/html;
}
}
- dockerfile 업데이트 :
노드에서 : 빌더로서 18- 알파인
WorkDir /App
패키지 복사*.json ./
NPM 설치를 실행하십시오
복사 . .
NPM 실행 빌드를 실행하십시오
Nginx에서 : Alpine
카피 -from = builder/app/build/usr/share/nginx/html
nginx.conf /etc/nginx/conf.d/default.conf를 복사하십시오
80 노출
cmd [ "nginx", "-g", "daemon off;"]
그런 다음 3000 대신 포트 80을 사용하여 재 구축하고 실행하십시오.
기본적으로 Dockerfile에서 앱을 빌드하고 제공하는 방법을 정의하고 이미지를 만들고 실행하십시오. 일단 설정 한 후 간단하고 일관된 배포에 적합합니다.
위 내용은 Docker 컨테이너에서 React 응용 프로그램을 실행하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
핫 AI 도구
Undress AI Tool
무료로 이미지를 벗다
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Stock Market GPT
더 현명한 결정을 위한 AI 기반 투자 연구
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
반응을 Laravel과 통합하는 방법은 무엇입니까?
Jul 30, 2025 am 04:05 AM
setuplaravelasanapibackendbyinstallinglaravel, 구성, apiroutes 만들기, andreturningjsonfromcontrollers, 옵션을 repinglaravelsanctumforauthentication.2
Centos에 Docker를 설치하는 방법
Sep 23, 2025 am 02:02 AM
충돌을 피하기 위해 기존 버전의 Docker를 제거하고, 2. Yum-Utils를 설치하고 공식 Docker 저장소를 설치하고, 3. Dockerce, CLI 및 Containerd 설치, 4. Docker Services를 시작하고 활성화하여 Hello-World 이미지를 실행하여 설치가 성공했는지 확인하십시오.
Windows 용 Docker는 어떻게 작동합니까?
Aug 29, 2025 am 09:34 AM
dockerforwindowsusesalinuxvmorwsl2toruncontainersbecausewindowslackslacksnativelinuxkernelfeatures; 1) itaUtomallysulightalightweightlinuxvm (oruseswsl2) Withhyper-vogostthockerdaemonandcontainers;
Docker를 시작하는 방법
Aug 16, 2025 pm 01:46 PM
DockerIsaplatformforpackaging, 배송, andrunningApplicationsinlightIngweight, IronteHotheRoStoSkernel.2. installDockerDeskToponWindowSormacos, OruseThecurlComponllinux, thentestwithdocker- versionanddockerrunhello
매달려있는 도커 이미지를 제거하는 방법?
Aug 02, 2025 am 11:37 AM
MANDLINGINGEARTAGEDLAYERSNOTIUSIATIONSTAINSTISSIATIONGEATIONERANDCANBEREMOVEDUSINGDOCKER'SSBUILT-INCOMMANDS.1.OUDEDOCKERIMAGEPRUNETOSAFELYREMOVEDLIGLIGESSAFTERCONFIRMATION, ORADD-FTOFOREREMVOLT.2
Docker 컨테이너에서 명령을 실행하는 방법
Aug 20, 2025 am 05:09 AM
DockErrun을 사용하여 새 컨테이너에서 명령을 실행하고 DockerExec을 사용하여 실행중인 컨테이너에서 명령을 실행하십시오. 특정 방법은 다음과 같습니다. 1. Dockerrun을 사용하여 새 컨테이너를 시작하고 Dockerrun-rmubuntuls/tmp와 같은 명령을 실행합니다. 2. DockerExec을 사용하여 Dockerexecmy-Nginx-ServicePsaux와 같은 컨테이너에서 명령을 실행하고 대화 형 작업이 DockerExec-itmy-container/bin/bash와 같은 추가해야합니다. 3. Dockerrunnginx : himesnginx-t와 같은 컨테이너를 시작할 때 기본 명령을 덮어 씁니다.
지역 개발에 Docker를 사용하는 방법
Aug 31, 2025 am 02:43 AM
tousedockereffectially vocaldevelopment, firstinstalldockerdesktoporengineandverify-versionanddockerrunhello-world; thencreateadockerfiletodefineyourap'senvirondmentandadocker-compose.ymlformulti-servicesetupslikeanode.jsappwithwithwithwithwithwithwithwithwithwithwithwithwithwithwithwithwithwithwide
'Docker Container가 시작되지 않음'문제를 해결하는 방법은 무엇입니까?
Sep 20, 2025 am 12:11 AM
CheckContainerLogsusingDockerLogs [Container_id] TOINDIFYSTARTUPERRORSLIKEMISSFILESORDENCENCENCEFAILURE.2.RUNTHECONERINGERCILIVERUN-RM-IT- entryPoint/BIN/SHIMAGE_NAMETOINSEVENDENTANDANDENDELSENDELYTESTCOMMANDS.3
