React 프로젝트 배포
배포는 개발이 완료된 React 애플리케이션을 사용자들이 접근할 수 있도록 웹에 올리는 과정입니다.
프로젝트 빌드하기
터미널에서 기존 작업 종료 합니다.
터미널에 기존 작업이 진행 되고 있다면 에러 날 수 있습니다.
작업종료 단축키 - ctrl c
React 프로젝트를 배포하기 전에 먼저 빌드 과정을 거쳐야 합니다.
빌드는 개발 환경에서 작성한 코드를 최적화하여 배포에 적합한 형태로 변환하는 과정입니다.
프로젝트를 웹에 올리기 위한 즉, 서버에 업로드 할 파일을 추출하는 과정을 설명 합니다.
# 프로젝트 폴더에서 다음 명령어 실행
npm run build
terminal
위 명령어를 실행하면 프로젝트 폴더 내에 build 디렉토리가 생성되며, 이 안에 최적화된 정적 파일들(HTML, CSS, JavaScript 등)이 포함됩니다.
vs code 좌측 디렉토리 체크 합니다.
아마도 보이지 않던 build 디렉토리가 생성되었을 것입니다.
이 디렉토리가 서버에 업로드할 디렉토리 입니다.
로컬에서 빌드 결과 테스트하기
빌드된 결과물을 로컬에서 테스트하려면 serve 패키지를 사용할 수 있습니다:
npx serve -s build
terminal
빌드 디렉토리 파일 서버로 띄우기
가상서버로 빌드된 디렉토리를 테스트 해 볼 수 있습니다.
여기서 프로젝트가 제대로 가동 된다면 실제서버에서도 된다는 의미로 받아들이기 바랍니다.
결론
React 애플리케이션 배포는 npm run build 명령어로 최적화된 정적 파일을 생성한 후, 이를 적절한 호스팅 서비스에 업로드하는 과정입니다.
'React.js basic manual' 카테고리의 다른 글
| React.js props - 리액트 프롭스 (0) | 2025.06.25 |
|---|---|
| React.js component - 리액트 컴포넌트 (0) | 2025.06.25 |
| React.js about - 리액트 정의 (0) | 2025.06.20 |
| react new project building - VS Code에서 React 프로젝트 생성하기 (0) | 2025.06.20 |
| create react app tool chain (0) | 2025.06.20 |