Eslint, Prettier

곽민서·2026년 7월 4일

Eslint란?

Eslint는 JavaScript와 TypeScript 코드에서 문법 오류나 코드 스타일 문제를 찾아주는 도구이다.

개발자가 실수한 부분을 미리 알려주기 때문에 오류를 줄이고, 여러 사람이 함께 개발할 때 일관된 코드를 작성하는 데 도움이 된다.

주요 기능

  • 문법 오류 검사
  • 사용하지 않는 변수 확인
  • 코드 스타일 검사
  • 프로젝트 규칙 적용

예시

❌ ESLint 경고

let a = 10;
let b = 20;

console.log(a);

위 코드에서는 b를 사용하지 않았기 때문에 ESLint가 사용하지 않는 변수(no-unused-vars)라고 경고한다.


Prettier란?

Prettier는 코드의 들여쓰기, 줄바꿈, 따옴표 등의 형식을 자동으로 맞춰주는 코드 포맷터이다.

개발자가 직접 코드를 정리하지 않아도 일정한 스타일로 자동 저장해 준다.

주요 기능

  • 들여쓰기 자동 정렬
  • 코드 줄바꿈
  • 따옴표 통일
  • 세미콜론 자동 정리
  • 코드 가독성 향상

🎨 Prettier 예시

정리 전

function hello(){console.log("Hello")}

정리 후

function hello() {
  console.log("Hello");
}

Prettier는 코드의 들여쓰기, 줄바꿈, 세미콜론 등을 자동으로 정리하여 가독성을 높여준다.

EsLint와 Prettier의 차이점

ESLintPrettier
코드 오류를 검사코드 형식을 자동 정리
잘못된 문법을 알려줌보기 좋은 코드로 변경
코드 품질 향상코드 스타일 통일

ESLint는 코드의 오류를 검사하는 도구이고, Prettier는 코드의 형식을 자동으로 정리하는 도구

0개의 댓글