안녕하세요!

Node.js 환경에서 Clang을 활용한 C, C++, Java, JavaScript 포매터를 개발하였습니다. 이 프로젝트는 더 이상 유지 보수되지 않는 Angular의 clang-format 패키지를 기반으로 새롭게 시작된 프로젝트입니다.

두세 달 전에 비슷한 내용을 공유했었는데, 이번에 v1.3.0 버전을 배포하며 사용자분들이 더욱 쉽고 편리하게 사용할 수 있도록 상세한 문서 사이트를 추가했습니다. 문서 사이트는 여기에서 확인할 수 있으며, 기본 설치 방법부터 이 패키지를 사용해야 하는 이유까지 다양한 내용을 담고 있으니 관심 있으신 분들은 참고해주시면 좋을 것 같습니다.

이번 업데이트에서는 여러 테스트를 추가해 패키지의 안정성을 더욱 높였으며, 새로운 기능들도 추가되었습니다.

해당 패키지는 모두 MIT 라이센스이며, 자유롭게 이용하실 수 있습니다.


clang-format-node는 어떤 프로젝트인가요?

이 패키지는 LLVM의 C 컴파일러로 유명한 Clang의 clang-format을 기반으로 C, C++, Java 언어의 코드 포맷팅을 지원하는 Node.js 패키지입니다. 간단히 말해, Node.js 환경에서 Prettier와 유사한 역할을 수행하지만, Prettier가 지원하지 않는 C, C++, Java 언어의 포맷팅을 제공한다는 점이 차별화됩니다.

특히, Node.js 코어나 Electron 개발처럼 JavaScript 코드와 C/C++ 코드를 함께 작성해야 하는 경우 clang-format-node가 유용합니다.

기존 clang-format 패키지는 Ubuntu 등의 운영체제 환경에 의존하는 추가 의존성을 설치해야 하는 번거로움이 있었지만, 이 패키지를 사용하면 별도의 설치 없이 바로 사용할 수 있습니다. 또한, 기존 패키지가 CI 환경에서 Node.js 및 npm 기반 워크플로에 통합하기 까다로운 면이 있었던 반면, clang-format-node는 단순히 npm에서 설치하고 스크립트를 설정하는 것만으로 간편하게 사용할 수 있어 CI 환경에서 많은 이점을 제공합니다.


그렇다면 clang-format-node 패키지의 특징은 무엇인가요?

1. Angular의 clang-format을 대체하는 Drop-in Replacement

clang-format-nodeAngular/clang-format 패키지를 손쉽게 대체할 수 있는 Drop-in Replacement입니다.
기존 패키지에서 clang-format-node로의 전환은 아주 간단하며, 별다른 복잡한 과정 없이 바로 사용할 수 있습니다.

2. Clang을 사용하기 위한 추가 의존성 없이 Node.js만으로 충분합니다.

Python이나 C++ 같은 추가적인 의존성이 전혀 필요 없습니다. Node.js만 있으면 간단히 실행 가능합니다.

3. 넓은 지원 범위

다양한 운영 체제 및 아키텍처, Node.js 버전, GitHub Actions 러너 이미지, Docker 빌드 이미지 등을 폭넓게 지원합니다.

4. 간편한 CI 설정

복잡한 설정 없이, 다른 Node.js 패키지와 동일하게 clang-format-node를 사용할 수 있습니다.

5. 자동화된 빌드와 릴리스

clang-format 업데이트가 이루어질 때마다 새로운 npm 버전이 자동으로 릴리스됩니다. GitHub Actions가 주기적으로 업데이트를 감지하고, 패키지를 빌드한 뒤 Pull Request를 생성해줍니다.


clang-formatgit-clang-format으로 코드 포매팅하기

(아래 글은 제가 https://clang-format-node.lumir.page/docs/get-started/introduction 섹션에 영문으로 작성한 글을 일부 한글로 번역한 내용입니다.)

코드 포매팅의 중요성

코드를 언제나 포매팅하세요

코드 포매팅은 코드 품질을 높이는 데 있어 매우 중요한 작업입니다. 포매팅의 핵심은 코드의 포매팅을 일관되게 유지해 가독성과 이해도를 높이는 데 있습니다.


clang-format이란?

clang-format은 C와 C++ 같은 언어의 소스 파일을 자동으로 포매팅해주는 도구로, LLVM Clang 오픈 소스 프로젝트의 일부로 개발되었습니다.

작동 방식
  1. 설정 파일 생성
    포매팅 스타일을 정의한 설정 파일(.clang-format)을 생성합니다.
  2. 명령 실행
    clang-format 명령어를 실행하면 해당 스타일 규칙에 맞춰 소스 코드가 자동으로 재구성됩니다.
주요 특징
  • 다양한 언어 지원
    C, C++, Java, JavaScript, Objective-C, Protobuf, C# 등 다양한 언어를 지원합니다.
  • 포매팅 명령어 예시
    clang-format -i my_source.cpp  
    
    위 명령어를 실행하면 my_source.cpp 파일이 지정한 스타일대로 자동 포매팅됩니다.
코드 포매팅 예제
// Before formatting  
void test(QString&data, bool extraString) {  
    int i=0;  
    for (i=0;i<3;i++) {  
        data+="reallylongstringtoproducealonglineasanexample" + QString::number(i * 1000) + "/filetoload.html";  
        if (extraString)  
        {  
            data += "some-extra";  
        }  
    }  
}  
  
// After formatting  
void test(QString &data, bool extraString)  
{  
    int i = 0;  
    for (i = 0; i < 3; i++) {  
        data += "reallylongstringtoproducealonglineasanexample" + QString::number(i * 1000)  
                + "/filetoload.html";  
        if (extraString) {  
            data += "some-extra";  
        }  
    }  
}  

위 예시는 clang-format이 어떻게 코드를 포매팅하는지 보여줍니다. 포매팅 규칙은 팀의 스타일에 맞게 자유롭게 설정할 수 있습니다.


clang-format의 문제점

clang-format은 훌륭한 도구이지만, 기존 코드커밋 이력 문제를 야기할 수 있습니다.

주요 문제점
  1. 기존 코드와의 충돌
    전체 파일을 포매팅하면 포매팅과 관련 없는 부분까지 변경되어 불필요한 변경 사항이 발생합니다.
  2. 커밋 이력의 혼란
    대규모 포매팅 변경은 커밋 이력을 복잡하게 만들어 브랜치 병합, 코드 리뷰, 코드 분석에 어려움을 줄 수 있습니다.
  3. 새로운 코드와 기존 코드의 불일치
    이미 포매팅된 코드에 새 코드를 추가할 때 포매팅 유지가 어려울 수 있습니다.
해결책: git-clang-format

git-clang-format은 변경된 코드에만 포매팅을 적용할 수 있도록 도와주는 Git 확장 도구입니다. 이를 사용하면 다음과 같은 장점이 있습니다.

  • 포매팅 범위 최소화: 변경된 코드에만 포매팅 적용
  • 리뷰 간소화: 포매팅 변경과 개발 변경을 별도로 검토 가능

git-clang-format 사용 방법

설치

git-clang-formatclang-format-node 패키지와 함께 제공됩니다. clang-format-git npm 패키지를 설치해 사용할 수 있습니다.

기본 워크플로
  1. 코드를 작성합니다.
  2. 변경 사항을 staging에 추가합니다(git add).
  3. git-clang-format을 실행합니다.
예제
# 새 파일 추가 및 변경 사항 스테이징  
$ git diff --staged  
diff --git a/x.cpp b/x.cpp  
new file mode 100644  
index 0000000..af14ed5  
--- /dev/null  
+++ b/x.cpp  
@@ -0,0 +1,3 @@  
+int main() {  
+  
+}  
  
# git-clang-format 실행  
$ git-clang-format  
changed files:  
    x.cpp  
  
# 포매팅 후 상태 확인  
$ git status  
On branch master  
Changes to be committed:  
    new file:   x.cpp  
Changes not staged for commit:  
    modified:   x.cpp  

이 워크플로를 통해 포매팅 변경과 개발 변경을 독립적으로 검토할 수 있습니다. 포매팅 변경이 마음에 들지 않으면 git checkout으로 되돌릴 수도 있습니다.

스타일 지정

--style 옵션을 사용하여 포매팅 스타일을 설정할 수 있습니다.

$ git-clang-format --style=WebKit  
$ git-clang-format --style=file  # `.clang-format` 파일 사용  

결론

clang-format은 강력한 도구지만, 실무에서는 단순히 clang-format -i 명령어만으로는 부족할 때가 많습니다. 변경된 부분에만 포매팅을 적용하는 git-clang-format을 사용하면, 효율적으로 코드를 관리하고 리뷰 과정을 간소화할 수 있습니다.

git-clang-format은 변경 사항만 포매팅하기 때문에, 깔끔하고 전문적인 코드베이스를 유지하면서도 유연한 개발 환경을 제공할 수 있습니다. 작업 커밋이나 전체 브랜치를 포매팅할 때 몇 가지 Git 명령만 추가로 사용하면, 포매팅 문제를 손쉽게 해결할 수 있습니다.


긴 글 읽어주셔서 감사드립니다! 긱뉴스 독자분들 모두 새해 복 많이 받으세요🙇‍♂️

따봉 드리고 갑니다