[CRA] 내가 보려고 적는 각종 패키지 설치 명령어 및 여러 단축어

• 현재 사용하는 IDE는 VS Code

nvm 설치하기

homebrew를 설치
homebrew를 통해 nvm을 설치
> brew install nvm
터미널에 복사 → 붙여넣기 → 엔터
> sudo curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash

nvm 설치 확인하기

nvm --version

nvm으로 노드 설치하기

nvm install 16.15.1

설치 확인하기

nvm ls //nvm으로 설치한 노드 버전 리스트 확인 명령어
nvm use 16.15.1 //16.15.1으로 노드 버전 적용 명령어
node -v //노드 버전 확인 명렁어

맨 마지막에 설치된 버전만 초록색으로 된다.

npm으로 yarn 설치

npm으로 패키지를 설치할 때는 아래 명령어를 사용해요!
옵션은 필요한 경우에만 적어줍니다.
npm install [옵션] [설치할 패키지 이름]

npm install -g yarn 

이 명령어는 "npm으로 yarn을 컴퓨터 전체에 설치한다"는 뜻입니다.
-g 옵션은 컴퓨터 전체에서 쓸 수 있게 한다는 뜻입니다.

yarn으로 패키지 설치

yarn add [옵션] [설치할 패키지 이름]

yarn으로 CRA 설치하기

# 옵션 global은 전역에 이 패키지를 깔겠다는 뜻입니다.
yarn add global create-react-app

CRA 설치하기

# yarn create react-app [우리의 첫 리액트 프로젝트 이름]
# 우리가 설치한 create-react-app 패키지를 써서 프로젝트를 만들어요.
# 주의! 꼭 sparta_react 폴더 경로에서 입력해주세요!
yarn create react-app 만드려는폴더명

리액트 시작하기

cd week-1 # week-1 폴더로 이동합니다.
yarn start

styled-components 설치하기

yarn add styled-components

react-router-dom 패키지 설치하기

yarn add react-router-dom

리덕스 패키지 설치하기

yarn add redux react-redux

리덕스 툴킷 설치하기

yarn add react-redux @reduxjs/toolkit

json-server 설치하기

 yarn add json-server

json-server 실행하기

db.json 이라는 것을 db로 삼고, 3001 포트에서 서버를 시작하겠다는 뜻

 yarn json-server --watch db.json --port 3001

리액트와는 별개로 따로 실행을 해줘야 합니다. 다시 말해 리액트도 start하고, json-server로 start 해야 합니다. 그래야 리액트와 json-server가 서로 통신 할 수 있습니다.
=> 터미널 분할해서 하나는 json, 하나는 react 열면 됨.