analogcoding

What is Prettier ? Visual Studio Code Extention 으로 정해진 규칙에 따라 자동으로 코드 스타일을 정리 해주는 도구입니다. 여러 규칙들을 쉽게 커스터마이징 할 수도 있습니다. Why use Prettier ? 코드를 저장 시 정해놓은 규칙에 맞게 자동으로 정렬해서 가독성을 높이고 코드 스타일을 통일할 수 있습니다. How to Start ? Visual Studio Code Extention 에서 Prettier 를 검색하고 설치합니다. 이 후 VS Code를 재 시작 한 후 setting 에서 규칙을 설정하면 코드를 깔끔하게 정리할 수 있습니다. { "singleQuote": true, // 따옴표 고정 "semi": true, // 코드 끝에 ; 설정 "useTab..

What is ESlint ? ES ( EcmaScript ) + Lint ( 에러 코드 표식 ) 코드에 특정 스타일과 규칙을 적용해서 문제를 사전에 찾고 패턴을 적용시킬 수 있는 정적 분석 툴입니다. airbnb 등 미리 스타일과 규칙이 정해진 rule 을 적용시킬 수도 있습니다. 개발자가 자신만의 스타일과 규칙을 유동적으로 정해서 적용할 수 있습니다. Tip* ( airbnb 와 airbnb-base 의 차이는, airbnb-base 에는 리액트 관련 규칙이 들어있지 않습니다. ) Why use ESlint ? 다양한 플러그인을 사용해서 새로운 규칙을 추가하고 커스텀할 수 있습니다. 즉 뛰어난 확장성을 바탕으로 다른 사람들과 같은 환경에서 개발을 진행할 수 있습니다. How to Start ? 많은 ..

What is Jest ? Jest 는 코드가 제대로 동작하는 지 확인하는 test case 를 만드는 '테스팅 프레임워크' 입니다. Why use Jest ? lint 가 코드 스타일에 rule 을 정하는 것이라면 코드가 올바른 기능을 하는 지 체크할 수 있습니다. 이를 통해서 보다 안정적이고 제대로 동작하는 코드를 작성할 수 있습니다. How to Start ? package.json 파일을 만들고 Jest 라이브러리를 개발 의존성으로 설치합니다. yarn 과 npm 모두 간단하게 설치 가능합니다. yarn add --dev jest npm install --save-dev jest Tip* ( -dev 는 package.json 안에 dependencies 가 닌 devDependencies 에 저..