create-react-app 설치

npx create-react-app 폴더

• 특정 폴더에 리액트 기본 설정 패키지들을 설치한다.

리액트 라이브러리

import React from 'react'

import ReactDOM from 'react-dom'

• react : 리액트 컴포넌트(=내가 만든 HTML 태그)를 만들어 주는 라이브러리.
• react-dom : 리액트 컴포넌트를 HTML에 렌더링하는 라이브러리

리액트 실행

npm run start 또는 npm start  // 웹 브라우저에 리액트 앱을 **개발 모드**로 띄움

npm run build  // 웹 브라우저에 리액트 앱을 **배포 모드**로 띄움

npm test  // jest를 통해 코드를 테스트함

npm run eject  // create-react-app 으로부터 코드와 패키지들를 꺼내서 펼쳐 놓음

lint-staged

// lint-staged 설치
npm i lint-staged -D

// lint-staged를 실행하는 husky 설치
npm i husky -D

// git hook 활성화
npx husky install

// lint-staged를 실행하기 위한 husky의 기본 설정
npx husky add .husky/pre-commit 'lint-staged'

//package.json 파일
// lint-staged 기본 설정
"lint-staged": {
	"**/*.js": [
	"**eslint** --fix",
	"**prettier** --write",
	"git add"
	]
}

• lint-staged : commit 직전에 commit 할 파일들(staged file)의 문법을 검사하는 패키지
• eslint, prettier : 코드의 잘못된 문법에 표시를 해주는 패키지