프리티어, ESLint

---

프리티어 (Prettier)

• 프리티어는 코드 포맷팅 도구로, 코드 스타일, 들여쓰기, 줄바꿈 및 기타 서식을 자동으로 표준화해주는 역할을 한다
• 코드 포맷팅의 주요 목적은 코드의 일관성을 유지하고, 가독성을 향상시키며, 협업을 더 효율적으로 만들어준다.
• 프리티어는 주로 코드베이스에 적용되며, 코드를 저장하거나 커밋할 때 자동으로 코드를 정리한다.

 

프리티어 설정 예시

// .prettierrc 파일

{
  "singleQuote": true,   // 작은따옴표(') 사용
  "semi": true,          // 세미콜론(;) 사용
  "trailingComma": "all", // 후행 콤마 사용 (예: { a: 1, b: 2, })
  "tabWidth": 2,         // 탭 너비
  "printWidth": 80       // 줄 바꿈 문자 수 제한
}

 

 

ESLint 

• ESLint는 자바스크립트 코드에서 문제점을 찾고 코드 스타일 규칙을 강제하는 도구이다.
• 개발자가 설정한 규칙에 따라 코드를 분석하고, 코드에서 잠재적인 오류나 스타일 가이드라인 위반을 식별한다.
• ESLint는 커스터마이징이 가능하며, 팀 또는 프로젝트에 맞게 규칙을 조정할 수 있다.

 

ESLint 설정 예시

// .eslintrc 파일

{
  "extends": ["eslint:recommended"],
  "parserOptions": {
    "ecmaVersion": 2021
  },
  "rules": {
    "semi": ["error", "always"],   // 항상 세미콜론을 사용하도록 강제
    "quotes": ["error", "single"], // 항상 작은따옴표(') 사용하도록 강제
    "indent": ["error", 2],        // 들여쓰기를 2칸으로 강제
    "comma-dangle": ["error", "always-multiline"] // 후행 콤마 사용 (여러 줄일 때만)
  }
}

 

 

두가지 라이브러리 모두 개발자들이 품질 높은 코드를 작성하고 유지하는 데 큰 도움을 준다. 

 

특히 대규모 프로젝트, 여러 인원이 참여하는 프로젝트에서 코드 일관성과 품질을 유지하는 데 필수적이며, 코드 리뷰 및 협업과정에서도 유용하다.