[JavaScript] 모노레포(Monorepo)를 위한 도구들

2024-04-12 hit count image

JavaScript로 개발할 프로젝트에서 모노레포(Monorepo)를 사용하기 위해 필요한 도구들을 알아보도록 하겠습니다.

개요

이번 블로그 포스트에서는 JavaScript로 개발할 프로젝트에서 모노레포(Monorepo)를 사용하기 위해 필요한 도구들을 알아보도록 하겠습니다.

블로그 시리즈

이 블로그는 시리즈로 제작되었습니다. 다음 링크를 통해 다른 블로그 포스트도 확인해 보시기 바랍니다.

모노레포를 시작하는 방법

모노레포를 시작하는 방법은 크게 두 가지가 있습니다.

  • 패키지 매니저를 이용하는 방법
  • 모노레포용 툴을 사용하는 방법

이번 블로그 포스트에서는 JavaScript 프로젝트에서 모노레포를 지원하는 패키지 매니저와 모노레포 툴에 대해서 알아보겠습니다.

패키지 매니저

JavaScript 프로젝트에서 모노레포를 구성하기 위해서는 모노레포를 지원하는 패키지 매니저를 사용할 수 있습니다. 모노레포를 지원하는 패키지 매니저는 pnpm, yarn, npm이 있습니다.

모노레포를 지원하는 패키지매니저인 pnpm, yarn, npm은 다음과 같은 특성을 가지고 있습니다.

기능pnpmyarnnpm
workspace 제공
고립된 node_modules✅(default)
호이스팅된 node_modules✅(default)
피어 자동 설치
Plug’n’Play✅(default)
Zero-Installs
종속 패치
NodeJS 버전 관리
Lockfile✅(pnpm-lock.yaml)✅(yarn.lock)✅(package-lock.json)
덮어쓰기 지원✅(resolution 사용)
Content-addressable 리포지토리
동적 패키지 실행✅(pnpm dlx)✅(yarn dlx)✅(npx)
Listing licenses✅(pnpm licenses list)✅(Via a plugin)

모노레포용 툴

패키지 매니저가 제공하는 Workspace 기능만으로도 충분히 모노레포를 구성할 수 있지만, 모노레포용 툴을 사용하면 보다 쉽게 모노레포를 구성할 수 있습니다. 또한, 모노레포용 툴이 제공하는 Cache 기능을 사용하면 BuildCI 등을 보다 빠르게 수행할 수 있습니다.

JavaScript 프로젝트를 위한 모노레포용 툴에는 Lerna, Nx, Turborepo가 있습니다.

Lerna

Lerna는 오픈소스로 개발, 관리되고 있습니다. 오픈소스 커뮤니티만으로는 관리가 어려워 Nx에 인수되었습니다.

현재도 Lerna를 사용할 수 있지만, Nx에 인수되었기 때문에, Nx가 자신들의 툴만큼 Lerna를 지원할지 확실하지 않기 때문에, Lerna를 사용할 예정이라면 Nx를 사용하는 것을 고려하거나, 좀 더 추이를 지켜보는 것이 좋을 것 같습니다.

Nx

NxNarwhal Technologies Inc.라는 회사에서 개발하여 제공하고 있습니다. 이 회사는 Angular 프레임워크와 관련된 도구 및 서비스를 제공하는 회사입니다. Angular 프레임워크 관련 도구를 개발하는 회사가 만든 Nx이기 때문에, NxAngular 애플리케이션을 위한 모노레포 관리 도구로 시작되었습니다. 현재는 React 등 다른 프레임워크도 지원하고 있습니다.

만약 Angular 프레임워크로 프로젝트를 개발할 예정이라면 Nx는 훌륭한 선택일 것입니다. 물론 다른 프레임워크에서도 Nx는 좋은 선택지일 수 있지만, Angular 프레임워크를 중심으로 개발된 NxAngular 중심의 툴을 개발하는 회사가 만든 NxAngular 프레임워크에서 더 좋은 성능을 발휘할 것입니다.

Nx가 지원하는 프레임워크는 다음 링크를 통해서 확인 가능합니다.

Turborepo

TurborepoJared Palmer가 개발하였지만, 2021년 NextJS를 만들고 운영하는 Vercel이 인수하여 개발, 관리하고 있습니다.

만약, NextJS, React로 프로젝트를 개발할 예정이라면 Turborepo는 훌륭한 선택일 것입니다. 특히, NextJS를 사용하면 같은 회사가 개발, 관리하고 있는 Turborepo를 사용하는 것이 다른 툴을 사용하는 것보다 좋을 것입니다.

Turborepo가 지원하는 프레임워크는 다음 링크를 통해서 확인 가능합니다.

완료

이번 블로그 포스트에서는 JavaScript로 개발할 프로젝트에서 모노레포(Monorepo)를 사용하기 위해 필요한 도구들을 알아보도록 하겠습니다. 패키지 매니저가 제공하는 기능으로도 충분히 모노레포를 구성할 수 있지만, 모노레포용 툴을 사용하면 좀 더 편하고 다양한 기능들을 사용할 수 있습니다.

모노레포로 프로젝트를 구성할 예정이시라면 패키지 매니저의 기능뿐만 아니라 모노레포용 툴의 도입도 고려해 보시기 바랍니다.

제 블로그가 도움이 되셨나요? 하단의 댓글을 달아주시면 저에게 큰 힘이 됩니다!

앱 홍보

책 홍보

블로그를 운영하면서 좋은 기회가 생겨 책을 출판하게 되었습니다.

아래 링크를 통해 제가 쓴 책을 구매하실 수 있습니다.
많은 분들에게 도움이 되면 좋겠네요.

스무디 한 잔 마시며 끝내는 React Native, 비제이퍼블릭
스무디 한 잔 마시며 끝내는 리액트 + TDD, 비제이퍼블릭
[심통]현장에서 바로 써먹는 리액트 with 타입스크립트 : 리액트와 스토리북으로 배우는 컴포넌트 주도 개발, 심통
Posts