본문 바로가기
fron-end 기본

마이크로 프론트엔드 아키텍쳐

by ddddbbbb 2024. 1. 31.

간단하게 생각하면 

하나의 프로젝트를 서비스단위로 구분해서 나누고 이를 구성한 후 합쳐서 하나의 프로젝트를 제공하는 것입니다.

 

 

각각의 서비스를 독립적으로 관리하기 때문에 이슈의 범위가 줄어들고 

새로운 서비스를 추가하기 편해진다는 장점이 있습니다

 

 

하지만 구성이 복잡하고 

서비스 단위로 구분하는 것이 어려울 수 있습니다.

 

 

https://velog.io/@kylexid/%EB%A7%88%EC%9D%B4%ED%81%AC%EB%A1%9C%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EC%95%84%ED%82%A4%ED%85%8D%EC%B3%90

 

 

마이크로 프론트엔드 아키텍쳐를 검색하면 

같이 검색되는 것들이 모노레포와 멀티레포가 있습니다

 

하나의 레포지토리에서 프로젝트를 진행하다가 프로젝트 범위가 넓어져 분리해서 관리하고싶은 소요가 생겼고 

멀티레포로 나누어서 관리하게 되었는데 나누어서 관리하다보니

공통 컴포넌트를 쓰기 어렵고, 각 레포지토리마다 컨벤션 및 종속성이 달라 문제가 발생하는등의 이슈가 있었습니다

 

이후 등장한 것이 모노레포로 

하나의 레포지토리에 여러 서비스를 제작하고 각각을 독립적으로 배포하여 main 에서 합치는 방식입니다 

이는 하나의 레포지토리에 존재하기에 공통 컴포넌트를 사용하기 좋고, 새로운 서비스를 추가하더라도 이미 존재하는 레포지토리에 제작함으로 초기 세팅을 해줄 소요가 줄어든다

 

 

이를 통해 얻을 수 있는 장점은

  1. 특정 부분의 코드가 변경되어 다시 빌드할 때 굳이 전체를 빌드하지 않아도 되고
  2. 서비스 영역으로 프로젝트를 구분지어 놓는다면 종속성 또한 각 프로젝트에서 관리할 수 있고
  3. 새로운 서비스의 추가가 쉬워질 것 같습니다.

 

'fron-end 기본' 카테고리의 다른 글

Module Federation  (0) 2024.02.01
bundler에 대하여  (0) 2024.01.28
프로젝트를 진행하면서 잊은 부분들 (중요)  (1) 2023.11.15
Memoization 과 Closer  (1) 2023.10.19
React component life cycle  (0) 2023.10.02