SPA Framework/React 2

[React] App 기본 실행 포트 설정하기

1. 개요 create-react-app을 통해 만든 React App의 경우 기본으로 3000번 포트를 사용해서 구동된다. 그러나 해당 3000번 포트가 겹치는 등의 사유로 따로 포트를 지정해줘야 할 상황이 생길 수 있다. 이와 같은 경우 포트를 변경해서 사용하는 대표적인 방법 세 가지를 정리해보고자 한다. (아래 내용들은 3001 포트로 변경한다고 가정한다.) 2. 포트 변경 방법 2.1 명령어로 포트 설정하기 - React 프로젝트 폴더에서 아래와 같은 명령어를 사용해 React 앱을 실행시킨다. (명령어를 통해 구동 시 한 번만 적용된다.) PORT=3001 npm start 2.2 package.json파일 설정 수정하기 - React 프로젝트 폴더에 ".package.json" 파일을 찾아 아..

SPA Framework/React 2022.05.16

[React] 초기 프로젝트 생성 (Hello-world)

1. 전제사항 NodeJS를 설치한다. (14~16 Version) VSCODE를 설치한다. 2. React 프로젝트 생성 프로젝트를 생성하고자 하는 위치의 상위폴더에서 다음의 명령어를 입력한다. 아래의 PROJECT_NAME에 원하는 프로젝트 이름을 넣으면 된다. npx create-react-app 이 과정을 스타벅스에서 진행하는게 아니라면(원활한 네트워크 환경이라면) 보통 1~2분내외 정도를 기다린 후 다음과 같이 Happy hacking! 이라는 문구와 함께 프로젝트가 생성됨을 확인할 수 있다. 생성된 프로젝트를 VSCODE로 열면, 다음과 같은 구조로 되어있음을 확인할 수 있다. 프로젝트 최상위 위치에서 다음과 같이 npm start명령어를 통해 로컬에 웹사이트를 띄운다. $npm start 컴..

SPA Framework/React 2022.04.24
반응형