연습장

ESlint , Prettier 본문

JavaScript

ESlint , Prettier

js0616 2024. 7. 3. 01:21

ESLint

  • JavaScript 코드에서 문제를 식별하고 코드 스타일을 검사하는 도구입니다.
  • 일관된 코딩 스타일을 유지하고, 잠재적인 버그를 사전에 발견하여 코드 품질을 향상시키는 데 사용

 

ESLint의 주요 기능과 특징은 다음과 같습니다:

  1. 문법 검사(Syntax Checking):
    • ESLint는 JavaScript 코드의 문법을 엄격하게 검사하여 잘못된 구문이나 문법 오류를 식별합니다.
    • 예를 들어, 세미콜론 누락, 괄호의 정확한 사용 등을 검사합니다.
  2. 코드 스타일 검사(Code Style Checking):
    • ESLint는 설정 파일을 통해 정의된 코드 스타일 규칙을 기반으로 코드의 일관성을 검사합니다.
    • 들여쓰기, 공백 사용, 변수 선언 방식 등 여러 가지 스타일 규칙을 지원하며,
    • 개발 팀이 공통된 코딩 스타일을 유지할 수 있도록 돕습니다.
  3. 커스텀 규칙 지원(Custom Rules Support):
    • ESLint는 사용자가 자신만의 커스텀 규칙을 정의하고 적용할 수 있는 기능을 제공합니다.
    • 특정 프로젝트나 팀의 요구사항에 맞춰 추가적인 검사 규칙을 설정할 수 있습니다.
  4. IDE 통합(Integration with IDEs):
    • 대부분의 인기 있는 통합 개발 환경(IDE)에서 ESLint를 통합하여 실시간으로 코드 검사를 수행하고, 문제를 표시하며, 수정 제안을 제공할 수 있습니다.
    • 예를 들어, Visual Studio Code, Atom, Sublime Text 등에서 ESLint 플러그인을 설치하여 사용할 수 있습니다.
  5. 지속적 통합(Continuous Integration):
    • ESLint는 지속적 통합(CI) 도구와 통합하여 코드베이스에 대한 자동화된 코드 검사와 품질 보증을 지원합니다.
    • CI 서버에서 ESLint를 실행하여 팀의 코드베이스가 설정된 규칙을 준수하고 있는지 확인할 수 있습니다.

ESLint는 JavaScript 개발에서 코드 품질을 높이고,

버그를 사전에 발견하여 개발 생산성을 향상시키는 중요한 도구입니다.

코드의 가독성과 유지보수성을 개선하며, 팀 전체의 개발 스타일을 통일시키는 데 도움을 줍니다.

 
 

 

Prettier

  • 코드 포맷터(Code Formatter), 코드를 일관된 스타일로 자동으로 포맷팅
  • 코드 스타일의 일관성을 유지
  • 개발자들이 코드를 더 읽기 쉽고 유지보수하기 쉽도록 함
  • 코드 포맷팅 작업을 자동화하여 생산성을 향상
 
코드 포맷팅(Code formatting)
  • 프로그래밍 언어로 작성된 코드의 레이아웃, 구조, 들여쓰기 등을 일관되게 정리하거나 조정하는 작업을 말합니다.
 

 


 
 
 

Prettier는 주로 코드의 포맷팅을 담당하고, ESLint는 코드의 품질과 스타일을 검사하는 데 사용