# Linting

린팅(Linting)이란 코드를 작성할 때 규약을 자동으로 맞춰주는 도구입니다. 린팅은 매우 중요하지는 않지만 매우 필수라고 얘기하고 싶습니다. 린팅은 단순하게는 코드 포멧팅을 해주는 것이라 실행 시 영향을 미치는 부분이 아니라서 매우 중요하지는 않지만 규칙이 정확히 정해지지 않은 코드를 유지보수 하다보면 생산성이 떨어지기 때문에 매우 필수라고 생각합니다. 린팅은 간단하게는 단순히 함수 뒤에 띄어쓰기를 안했다던지 함수 인자에 띄어쓰기를 생략했다던지 할 때 강제로 띄어쓰기를 넣어주거나 삭제해주거나 등의 일을 하면서 코드의 포멧을 일정하게 잡아줍니다. 린팅의 규칙은 설정 파일을 통해 각 프로젝트 별로 다르게 지정할 수도 있고 이미 정한 규칙 설정을 확장하여 일부만 바꿔서 사용하는 것도 가능합니다. 대부분 언어 별로 표준 같은 것이 정해져 있어서 해당 린팅 규칙을 가져와서 일부 프로젝트에 맞는 설정만 변경하여 사용합니다. 저희 회사 린팅 설정은 Guides에 존재합니다.

# 린팅(Linting)을 사용하는 이유?

// 표준 포멧
function MyFunction (a, b, c) {
  // do somthing
}

// 개발자들 별로 다른 스타일들
function MyFunction(a, b, c) { // Function 뒤에 띄어쓰기 없음
function MyFunction (a,b,c) { // 인자간 띄어쓰기 없음
function MyFunction(a, b, c){ // 함수 시작 앞에 띄어쓰기 없음
function MyFunction( a, b, c) { // 첫번째 인자에 실수로 띄어쓰기 들어감

1
2
3
4
5
6
7
8
9
10

대부분 린팅을 협업 시 코딩 규약을 맞추기 위함으로 알고 있는데, 혼자 작업을 하더라도 린팅은 필수입니다. 하나의 함수를 작성하더라도 다양한 형태로 코드를 작성할 수 있고, 작성 형식이 다르다보면 차후 해당 소스를 찾아볼때 검색에서 걸리지 않거나 여러 형태로 검색을 여러 번 해야 합니다. 만약 해당 함수에 버그가 발견되어 검색을 한다면 개발자들이 의도 또는 실수할 수 있는 모든 형태로 검색해봐야 합니다. 이는 유지보수 시 엄청난 소모가 일어나고 실수를 유발합니다. 예전에는 이런 내용들을 코딩 컨벤션(Coding Convention)이라는 이름으로 문서로 작성하고 신입사원들이 입사를 하면 컨벤션 먼저 숙지하고 따르는 것이 일상이었으나, 사람은 언제든 실수를 할 수 있기 때문에 이제는 린팅(Linting)이라는 기계적 도구를 이용해서 거의 대부분의 실수를 잡아 내고 일관된 포멧을 유지합니다.

TIP

이해하기 쉽게 띄어쓰기를 예로 들었지만 다른 스타일링과 의도하지 않고 의심스러운 오류나 버그 등을 정적인 상태로 잡아내는 것도 가능합니다.

# 정리

린팅에 관해서 딱히 선택지가 있기보다는 프로젝트 설정에 맞춰서 사용 해당 설정들을 이해하고 구축할 수 있는 것이 중요합니다. 요즘은 대부분 프레임워크에 내장되어 있고 별다른 설정없이 바로 사용이 가능하나, 오픈소스 라이브러리 제작 등에는 직접 설치 설정/구성을 할 줄 알아야 합니다.

일반적인 웹 개발 린팅 설정은 eslint + standard format + eslint::typescript + vue + prettier 정도로 사용하고 각 프로젝트 별 설정 방법은 가이드에 존재합니다.

← CSS Bundling & Transpiler →