monorepo (with nx)

jojo·2022년 4월 11일
1
post-thumbnail

이 글에서는 monorepo에 대한 간단한 설명과 monorepo를 구성하는데 도움을 주는 nx에 대해서 서칭해본 내용을 공유하려고 합니다.


monorepo?

monorepo가 무엇인지는 multirepo와 비교해보면 간단히 알수있다.

흔히 project를 만들고 관리할때, 하나의 project는 하나의 repo를 가지도록 관리했을것이다.
이 방식이 multirepo 이다. (polyrepo 라고도 불린다.)

반대로 여러 project를 하나의 repo로 관리하는
방식이 monorepo 이다.


필요성

multirepo의 필요성은 multirepo의 불편한점에서 시작한다.

1번처럼 여러 project들이 겹치는 사항이 없다면, multirepo를 선택하는게 더 합리적이고 큰 문제가 없다.

하지만, 2번의 경우라면?
반복적으로 겹치는 사항들을 각각 구현해야한다.
저 주황색 부분이 작을때는 상관없겠지만 저 부분이 점차 커지게 되면, 다른 project에서 구성했던 부분을 또 타이핑하는데 비효율적이라고 느껴질수 있다.

또, micro front를 이용하고 있는 경우

package끼리의 버전 sync를 맞추는 것도 쉽지 않다.

이때, 하나의 repo에서 이 project(=package)들을 관리한다면 각각의 sync를 맞추기 편하다.

👍 이외에도 장점을 정리하자면 다음과 같다.

  • 팀끼리 코드 공통성을 맞추기 편하다.
  • refactoring의 필요성을 구성원들이 모두 동감하기 쉽다.

그럼 장점만 있을까?

분명 단점도 있다.

  1. 이미 multirepo 구현된 패키지, 프로젝트들이 많다면, migration에 대한 비용이 높다.
  2. 공통으로 쓰는 library의 경우 version up이 까다롭다. (왜냐하면, version up시에 이 패키지를 사용하는 다른 프로젝트에 side effect가 생길 문제가 다분하다.)

언제 monorepo를 사용하면 좋을까?

1. project마다 긴밀하게 연결되어 있는가? ( ex) microfront 같이 test, build, deploy의 순서에 대해서 밀접하게 연결되어 있는 경우)
2. 공통되는 사항이 많은가?
3. 마이그레이션 비용이 충분히 감당 가능한가?

monorepo 구성을 도와주는 nx

monorepo의 구성을 도와주는 library는 여러가지가 있지만, 이번에 소개할것은 nx이다.

nx의 특징은 다음과 같다.

1. 많은 plugin들을 제공하며 사용한다면 빠르게 project 구성이 가능하다.
2. dependency graph를 제공한다.
3. 공식문서가 잘쓰여져 있는 편이다.

처음부터 nx를 이용해서 프로젝트를 구성하고 싶으면,
그냥 여기에 있는 guide 문서 따라서 하는게 젤 좋음

하지만, 이렇게 끝내긴 아쉬우니 간단히 plugin을 이용해서 구성하는 방법을 소개하고 글을 마치겠다.

create nx workspace 실행

//cra처럼 nx workspace의 초기구성이 이미 되어있는 템플릿이라고 생각하면 편하다.
npx create-nx-workspace@latest


이후, 위 그림처럼 그냥 세팅하고 싶은대로 선택하고 이름 정하고 하면됨.

어떻게 내부에 프로젝트들을 추가하나요?

더 자세한 사항은 링크참고

//Install Nx CLI
npm install -g nx
nx generate [plugin]:[generator-name] [options]

//plugin들의 종류는 어케보나여?
cli에 nx list 치면 list 나옴
거기서 필요한 plugin 찾아서 yarn add -D {plugin 이름} 이런식으로 깔면됨

profile
프론트 주니어

0개의 댓글