리액트 프로젝트 초기 설정 정리

프로젝트 추가 모듈

  • React
  • Typescript
  • Hooks
  • Styled-components
  • Axios
  • Redux
  • React-router

CRA –typescript

// react
yarn create react-app project-name

// typescript
yarn create react-app project-name --typescript

타입스크립트 버전으로 CRA을 설정하려면 뒤에 --typescript만 붙여주면 된다.

모듈 설치

yarn add redux react-redux styled-components @types/react-redux @types/styled-components react-router-dom axios @types/react-router-dom

타입스크립트를 사용할 때 일부 모듈들은 type을 지원하지 않기 때문에 @type/module-name을 수행해줘야한다.

.Prettierrc

{
  "singleQuote": true,
  "semi": true,
  "useTabs": false,
  "tabWidth": 2,
  "trailingComma": "all",
  "printWidth": 80
}

프리터 설정은 ' 사용 말고는 특별한 것은 없다.