Set up Airbnb Style

Airbnb Style이란?

Airbnb Style 가이드는 양질의 코드를 생성하기 위해 사용되는 말 그대로 스타일 가이드 입니다.

 

Airbnb React/JSX Style Guide의 자세한 내용은 깃헙 레파지토리에서 참고했습니다.

https://github.com/airbnb/javascript/tree/master/react#basic-rules

airbnb/javascript

 

eslint를 먼저 설치해줍니다.

npm install eslint --save -dev

 

eslint 환경 설정을 빠르게 쉽게 하고 싶다면 아래와 같은 명령어를 입력해줍니다.

npx eslint --init

그림에서 나온 것 처럼 몇 가지 질문들이 나오는데 질문에 맞게 선택하면 됩니다.

.eslintrc.js 파일은 아래와 같이 확인됩니다.

Prettier는 eslint와 다르게 코드 형식을 지정할 수 있기에 같이 설치해줍니다.

npm install prettier eslint-config-prettier eslint-plugin-prettier -D

 

최종 확인!

ESLint, Prettier, Airbnb style을 함께 적용했습니다.

className에서 "을 지우니  에러들이 바로 확인이 됩니다.