npm은 node.js로 만들어진 프로그램을 쉽게 설치해주는 일종의 앱스토어,
npm을 설치할 때는 node.js라는 프로그램을 컴퓨터에 다운 받으면 된다.
공식적으로는 npx을 이용하는데
npm을 사용하는 방법 먼저 설명하자면,
npm install -g create-react-app
npm에게 create-react-app을 설치해줘라고 부탁하는 것!
create-react-app이라는 하나의 명령을 실행해서 react web app을 set up할 수 있게 해준다.
이런 에러가 난다면,
sudo npm install -g create-react-app
앞에 sudo를 붙여주고 다시 설치해보자.
공식문서에서는 npx create-react-app으로 설치하는데
둘의 차이는,
npm이 그 프로그램을 설치하는 프로그램이라면,
npx는 이 create-react-app이라는 프로그램을 임시로 설치해서 딱 한 번 설치해서 지우는 프로그램이다.
장점은 컴퓨터 공간을 낭비하지 않고, 실행할 때마다 다운을 새로 받기 때문에 항상 최신상태이다.
그 다음, 데스크탑에 새로운 폴더를 만든다.
폴더의 이름은 react-app으로 한다.
이 디렉토리에 세팅을 하는 방법은!
생성한 디렉토리 안으로 들어가서 명령을 실행해야 그 디렉토리가 creaste-react-app에 의해서 개발환경이 된다.
cd하고 내가 만든 디렉토리를 iterm에 옮겨주면 경로가 쓰여진다.
그 다음은
create-react-app .
.은 현재 디렉토리를 말한다.
그럼 해당 디렉토리안에 create-react-app이 설치된 걸 볼 수 있다.
npx는
documents에 들어가서 앱을 생성한다고 하면
cd Documents
이렇게 내 documents에 들어가고,
npx create-react-app my-app
my-app이라는 폴더 안에 create-react-app을 설치해준다!
생활코딩이랑 노마드코더 영상을 봤는데 npx가 더 간단하게 느껴진다.
react를 실행시키려면
그리고 vscode로 들어가서 터미널을 키고(cmd + j)
npm run start
이렇게 하면 브라우저가 저절로 뜬다.
브라우저가 가장 최소한의 앱을 미리 구현해서 보여주고,
터미널에서는 2개의 주소를 알려준다.
해당 주소에 접속해서 개발 중인 앱을 확인 할 수있다.
끄고 싶을 땐 ctrl + C를 눌러주면 된다.