husky로 팀의 코드 자산에 대한 그라운드 룰 유지하기

팀의 프로젝트 레포지토리를 살펴볼 때, 협업 인원이 많을수록 코드의 일관성이 깨지는 경우가 많았다. lint 한 번을 돌려봐도 사용하지 않는 변수가 속출하고, 곳곳에 타입이 명시 되지 않는 경우도 있다. 이러한 환경에서 협업 인원이 더 늘어나면 코드 퀄리티를 유지하기가 더욱 어려워질 수 밖에 없었다. 따라서 그라운드 룰을 적용하여 코드 퀄리티를 유지할 수 있는 라이브러리 도입이 필요했다.

TL;DR

husky를 도입하여 팀에서 정의한 그라운드 룰에 따른 코드 퀄리티를 보장할 수 있다. 이는 팀워크 향상과 버그 감소에도 기여할 수 있고, 새로운 팀원이 합류하게 되어도 쉽게 코드 퀄리티를 유지할 수 있다!

이 글에서 다루는 것

• 팀의 코드 일관성 보장 과정
• husky 설치
• git hook의 pre-commit 적용

이 글에서 다루지 않는 것

• 코드 자산 그라운드 룰 설정을 위한 구체적인 Lint, Prettier 세팅 방법

팀의 코드 일관성 보장 어떻게 해결해야할까?

이를 해결하려면 아래와 같은 내용들이 필요했다.

1. 팀의 코드 퀄리티를 유지할 수 있는 그라운드 룰 정하기
2. 그라운드 룰을 강제로 적용할 수 있는 적합한 라이브러리 찾기
3. 라이브러리를 도입하기

팀의 코드 퀄리티를 유지할 수 있는 그라운드 룰 정하기

이제는 프로젝트에 Lint와 Prettier를 적용하는 것은 필수이다. 팀의 성향과 언어의 best-practice를 적용한 플러그인 설치를 통해 그라운드 룰을 정하는 것이 좋다. 우리 팀의 경우 다른 것은 차치하고, 취향 접전 끝에 tabWidth을 2로 설정하였다 😂

그라운드 룰을 강제로 적용할 수 있는 적합한 라이브러리 찾기

이를 해결하고자 commit을 할 때 코드 퀄리티를 유지할 라이브러리를 찾게 되었다. 

어떤 라이브러리를 사용하는 것이 좋을까?

이러한 라이브러리들을 통칭하여 Code Quality Meta Tools이라고 하는데, 검색할 때 husky, lefthook, pre-commit 같은 도구들이 나왔다.

어떤 라이브러리를 많이 사용하는지 알아보기 위해 npm trend를 살펴보았는데 압도적으로 husky가 도입율이 높았다. 그리고 각 라이브러리의 github의 문서를 읽어보았을 때, lefthook과 pre-commit에 비해 husky가 도입하기 가장 쉬운 것으로 느껴졌다. 그래서 husky를 도입하기로 하였다.

husky 세팅하기 (라이브러리 도입하기)

npm install husky -D

git hook의 pre-commit으로 commit 할 때 그라운드 룰 적용시키기

git hook은 git과 관련된 특정 커멘드가 실행되었을 때 이벤트를 발생시키는 기능이다. 여기서 사용할 것은 pre-commit이라는 기능인데, pre-commit은 commit을 실행하기 전에 발생되는 것을 의미한다. 

이글에서는 pre-commit으로 lint를 적용해보고자 한다.

husky를 프로젝트에 도입하는 사람의 경우 pre-commit을 적용시키기 위해 아래 단계를 거쳐야한다.

npx husky install

이를 거치게 되면 프로젝트 루트에 .husky 디렉토리가 생성되는 것을 확인할 수 있다.
그리고 다른 사람들이 husky를 사용할 수 있도록 package.json에 아래 명령어를 추가한다.

{
  "scripts": {
    "prepare": "husky install",
    }
}

마지막으로 그라운드룰을 적용하기 위한 Lint를 commit 할 때 husky가 lint를 실행시킬 수 있도록 아래 명령어를 입력한다.

npx husky add .husky/pre-commit "npm run lint"

 이렇게 하면 이제 commit을 실행할 때마다 lint가 돌아가게 되며, 만약 에러가 나는 경우 commit이 불가하게 된다. 이제 이를 브랜치에 적용하여 다른 사람들이 함께 husky를 이용할 수 있도록 하면 된다.

도입 효과

그라운드 룰만 잘 정해놓으면 코드 자산의 퀄리티를 유지하기가 쉬워졌다. 다만 husky는 도구이기 때문에, 어떤 그라운드 룰을 통해 코드 퀄리티를 유지할지는 팀의 논의가 필요하는 것을 느꼈다. 

차후 해결해보고 싶은 문제

husky를 프로젝트 초반에 세팅해놓으면 코드 퀄리티를 유지하기 쉽지만, 문제는 이미 성숙한 프로젝트에 husky를 도입하게 되면 맞지 않는 lint나 조건들을 하나하나 다 수정하느라 도입에 대한 부담이 클 수 밖에 없다. 따라서 부분적으로라도 husky를 도입할 수 있는지 찾아보고 싶다.

참고 리소스

• husky github

GitHub - typicode/husky: Git hooks made easy 🐶 woof!

• husky-vs-lefthook-vs-pre-commit

husky vs lefthook vs pre-commit | npm trends