Day 01

Node.js 설치 합니다.

https://nodejs.org/en

Node.js

 

vscode에 디렉토리를 추가하고 터미널(⌃⌘)을 열어서 다음을 입력 합니다.

npm init reate-app .

(디렉토리명은 소문자로만 작성해야함)

npm run start 으로 시작하면 개발모드 시작됨.

port 변경은 시작 명령어 앞에 PORT=[사용할포트] : $PORT=38080 npm run start

package.json 파일 내용 수정 export = mac,linux set = windows

"scripts": {

"start": "export PORT=38080 && react-scripts start",

"build": "react-scripts build",

"test": "react-scripts test",

"eject": "react-scripts eject"

},

또는 프로젝트/node_modules/react-scripts/scripts/start.js 에서 포트 변경

const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;

 

Chrome 에서 확장자를 추가 : react chrome developer tools

https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=ko 

React Developer Tools

 

개발자 모드에서  Components, Profiler 가 추가된 것을 확인 할 수 있음.

다시 vscode 로 돌아와 

public 아래 index.js 를 제외 하고 제거 합니다.

index.js 내용은 아래만 남깁니다.

 

src 아래 index.js를 제외하고 모두 제거 합니다.

index.js 내용은 아래 내용만 남깁니다.

 

이것으로 세팅 준비 끝.