마이크로서비스 아키텍처를 모노레포로 관리하기¶

알고 들어야 하는 내용¶

Microservices Architecture & Monolithic Architecture¶

Microservices Architecture & Monolithic Architecture 주로 백엔드에서 많이 다루는 내용이긴 하지만 프론트엔드 입장에서 서술하겠습니다.
frontend에서는 msa를 microservices가 아닌 microfrontends로 많이 불립니다.

최근 몇 년동안 MSA 돌풍이 불었습니다. MSA는 서비스들을 모듈단위로 작게 쪼개어 관리를 하는 것으로 예전부터 설계해온 Monolithic Architecture 와는 반대되는 아키텍처입니다.

MSA를 사용했을 때 여러 장점들이 있는데 거대한 서비스들을 작은 단위로 쪼갬으로써 빌드시간이 줄어들고 특정 부분의 장애가 전체 서비스의 장애로 이어지지 않고 장애가 발생한 특정 모듈만 교체함으로 써 문제해결이 가능하게 되었습니다.(가용성)

뿐만 아니라 배포나 버전관리도 전체 서비스단위로 하는게 아닌 업데이트가 필요한 모듈만 배포를 함으로써 유지보수성도 매우 높아졌습니다.

하지만 장점만 있는건 아니였습니다. 하나로 있던 모듈들을 쪼개버리니 공통으로 사용하고 있던 부분들이 모듈들에 중복으로 들어가게 되고, 모듈들이 통신하기 위한 중계 서비스 혹은 message queue(ex. kafka)의 사용이 필수가 됨으로써 서비스 자체의 크기가 더욱 커지게 되었습니다.

Overview¶

현재 회사의 프론트엔드 프로젝트는 마이크로서비스 아키텍처를 지향하며 개발하고 있습니다. 웹뷰의 경우 도메인 하나를 사용하지만 총 4개의 서비스들로 구성이 되어 있습니다.

path	description
`/a`	A 서비스
`/b`	B 서비스
`/c`	C 서비스
`/d`	D 서비스

네 개의 프로젝트를 다루면서 여러 장단점들이 있었는데 정리하면 다음과 같습니다.

장점¶

프로젝트 별로 기술스택을 다르게 가져갈 수 있다.
실제로 A 서비스는 vue, 다른 서비스들은 react로 개발하고 있습니다.
프로젝트를 작게 가져감으로써 빌드 시간을 줄일 수 있다.

단점¶

여러 기술스택을 사용하니 다른 개발자들에게 부담이 될 수 있다.
새로운 서비스를 만들어야 할 때 프로젝트 셋팅을 처음부터 다시 해야한다.
repo 생성
브랜치 rule 설정
.github meta setting
ci & cd setting (너무 공수가 많이든다.)
공통 모듈과 환경설정들을 공유할 수 없다.

어떻게 문제를 해결할 수 있을까?¶

위에 서술한 단점들을 해결하기 위해서 microfrontends에서는 monorepo를 도입하기 시작했습니다. (회사 웹뷰의 경우 모든 프로젝트들을 각기 다른 레포로 관리하는 multirepo 방식을 사용하고 있습니다.)

yarn workspace와 lerna를 통해 여러 서비스들을 monorepo로 관리가 가능한데, 이렇게 했을 때 환경설정과 공통 컴포넌트 & 함수들을 상위에 정의함으로써 공유가 가능하고, 서비스들은 packages를 통해 msa로 관리가 가능해졌습니다.

그렇다면 이제, 웹뷰 프로젝트에 적용해볼까?¶

위에서도 설명했듯이 웹뷰 프로젝트들은 두개의 프레임워크를 사용하고 있다고 했습니다. 이렇게 서비스들이 프레임워크를 다르게 사용하니 공통 컴포넌트를 사용할 수도 없고, 환경설정도 모두 다르게 셋팅 해줘야하는 문제 발생했습니다. 모노레포의 장점을 전혀 살리지 못하는거죠.

그래서 모노레포로 서비스들을 마이그레이션하는 작업을 중단하게 되었습니다. 😭

이대로 끝인가?¶

결국 모노레포로 마이그레이션은 시키지 못했지만, 그래도 할 수 있는 작업들이 있습니다. (사실 vue로 되어있는 A 프로젝트를 react로 변환하면 되지만.. 너무 공수가 큽니다 ㅠ)

현재 진행중인 디자인 시스템을 활용해 공통 컴포넌트를 모듈로 만들어 npm에 등록시키고 react를 사용하는 곳에서 가져다 사용하는 방법으로 말이죠. (eslint도 npm에 등록)

한꺼번에 많은 변화를 만들어내지는 못하겠지만 조금씩 조금씩 고쳐가고 개선해 나가면, 노력은 적게들고 개발을 빠르게 할 수 있게 될 것 같습니다.

작성자: 구민규

작성일: 2021-10-30