[React] 특정 포트번호로 프로젝트 실행하기

[React] 특정 포트번호로 프로젝트 실행하기

React 프로젝트를 실행할 때, 기본적으로 3000번 포트번호로 실행이 된다. 그러나 80번, 8080번 등 다른 포트번호로 실행하고 싶으면 어떻게 해야할까? 한번 알아보자.

중복된 포트번호 프로젝트 실행

3000번 포트번호로 프로젝트가 실행중인 경우, 또 다른 프로젝트를 실행하면 아래와 같은 것을 볼 수 있다. 다른 포트번호로 실행할 것인지 아닌지 묻는 것이다. 이런 방법으로 다른 포트번호로 프로젝트를 실행할 수 있다.

다른 포트번호로 프로젝트 실행

다른 포트번호로 프로젝트를 실행하는 방법은 매우 간단하다. package.json 파일에 있는 script를 수정해주면 된다. 기존 "start": "react-scripts start"로 되어 있는 것을 "start": "export PORT=포트번호 && react-scripts start"로 수정하면 된다. 아래 이미지를 참고해보자.

위와 같이 package.json을 변경한 후 프로젝트를 실행하면 내가 지정해둔 포트번호로 프로젝트가 실행된 것을 볼 수 있다. 아래 결과를 확인해보자.

마지막

해당 내용은 틀릴 수도 있다는 것을 감안하여 봐주세요. 틀린 내용 및 오탈자 수정 요청 환영입니다.