[React] 초기 설정 create-react-app

사전 준비

 

1. node 설치

https://nodejs.org/en/

Node.js

 

 

react 초기 설정

npx create-react-app {app 이름}

//redux 추가 버전
npx create-react-app my-app --template redux

 

성공적으로 실행되었다면 {app 이름} 으로 된 폴더가 생기고 해당 폴더로 들어가면 package.json 이 있습니다.

아래 내용 확인을 하시면 됩니다.

{
  "name": "gugudan",
  "version": "0.1.0",
  "private": true,

  /* react 동작에 필요한 라이브러리 */
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.2",
    "@testing-library/react": "^12.1.3",
    "@testing-library/user-event": "^13.5.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "5.0.0",
    "web-vitals": "^2.1.4"
  },

   /* react 동작 Script 의 모음 ex> npm run start, npm run build 등... npm rum {예약 명령어} 로 동작 */
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },

  /* react 동작시 지원 브라우저 종류 */
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

 

react 서버 동작

 

npm run start

위 명령어 입력시 서버가 동작하게 됩니다.

 

리액트 절대경로 설정 root 에 파일생성.

https://create-react-app.dev/docs/importing-a-component/#absolute-imports