[React] deploy - 리액트 배포하기

React 프로젝트 배포

배포는 개발이 완료된 React 애플리케이션을 사용자들이 접근할 수 있도록 웹에 올리는 과정입니다.

 

 

 

프로젝트 빌드하기

터미널에서 기존 작업 종료 합니다.

터미널에 기존 작업이 진행 되고 있다면 에러 날 수 있습니다.

 

작업종료 단축키 - ctrl c

React 프로젝트를 배포하기 전에 먼저 빌드 과정을 거쳐야 합니다. 

빌드는 개발 환경에서 작성한 코드를 최적화하여 배포에 적합한 형태로 변환하는 과정입니다.

프로젝트를 웹에 올리기 위한 즉, 서버에 업로드 할 파일을 추출하는 과정을 설명 합니다.

 

명령어 : npm run build

 

 

위 명령어를 실행하면 프로젝트 폴더 내에 build 디렉토리가 생성되며, 이 안에 최적화된 정적 파일들(HTML, CSS, JavaScript 등)이 포함됩니다.

 

vs code 좌측 디렉토리 체크 합니다.

아마도 보이지 않던 build 디렉토리가 생성되었을 것입니다.

이 디렉토리가 서버에 업로드할 디렉토리 입니다.

 

 

 

 

로컬에서 빌드 결과 테스트하기

빌드된 결과물을 로컬에서 테스트하려면 serve 패키지를 사용할 수 있습니다.

npx serve -s build

 

 

 

빌드 디렉토리 파일 서버로 띄우기

가상서버로 빌드된 디렉토리를 테스트 해 볼 수 있습니다.

여기서 프로젝트가 제대로 가동 된다면 실제서버에서도 된다는 의미로 받아들이기 바랍니다.

 

 

 

결론

React 애플리케이션 배포는 npm run build 명령어로 최적화된 정적 파일을 생성한 후, 이를 적절한 호스팅 서비스에 업로드하는 과정입니다.

 

 

 

 

출처 : React.js deploy - 리액트 배포하기