발행일

패스트 캠퍼스 챌린지 17일차 미션 (2월 17일) : 마이크로 FE 강의 후기

패스트 캠퍼스 챌린지 17일차 미션 (2월 17일) : 마이크로 FE 강의 후기

이 글은 네이버 블로그에 2025년 2월 17일에 올렸던 것을 그대로 옮겨온 것입니다.

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.

[ 마이크로 프론트엔드(MFA:Micro Frontend Architecture) : 대규모 서비스 설계부터 운영까지 (feat.모노레포&모듈페더레이션)

1. 공부 시작 시각

image

2. 공부 종료 시각

image

3. 클립 1번 수강 인증 사진

image

4. 클립 2번 수강 인증 사진

image

5. 학습 인증샷 1장

image

6. 학습 후기 700자

패키지 매니저와 모노레포 빌드 시스템 도구 및 개발 도구 선택에 대한 고찰

현대적인 웹 개발에서 패키지 매니저와 모노레포 빌드 시스템 도구를 선택하는 것은 프로젝트의 유지보수성과 확장성을 결정짓는 중요한 요소다. 패키지 매니저는 프로젝트의 의존성을 관리하는 역할을 하며, 대표적으로 npm, Yarn, pnpm이 있다. 과거에는 npm이 기본적으로 사용되었으나, 속도와 효율성 문제로 인해 Yarn이 등장했고, 이후 Yarn Berry와 pnpm이 더욱 빠르고 효율적인 캐싱 전략과 의존성 관리 방식을 제공하면서 주목받고 있다.

모노레포를 사용할 경우, 단순한 패키지 매니저만으로는 한계가 있기 때문에 Turborepo, Nx, Lerna 같은 모노레포 빌드 시스템이 필요하다. Turborepo는 Vercel에서 인수한 이후 빠른 빌드 및 캐싱 전략을 제공하면서 많은 프로젝트에서 채택되고 있으며, Nx는 대규모 엔터프라이즈 프로젝트에서 강력한 플러그인과 유연한 구성을 제공한다. 반면 Lerna는 초기부터 모노레포 환경을 지원했던 도구이지만, 최근에는 자체적인 빌드 시스템보다는 Nx와 같은 도구와 함께 사용되는 경우가 많다.

도구를 선택할 때는 프로젝트 규모와 팀의 요구 사항을 고려해야 한다. 소규모 프로젝트라면 굳이 모노레포 빌드 시스템을 도입할 필요가 없지만, 여러 개의 패키지를 관리하는 대규모 프로젝트라면 Turborepo나 Nx가 유리하다. 또한, 패키지 매니저도 팀 내 협업 방식에 따라 Yarn이나 pnpm을 선택할 필요가 있다. pnpm의 경우 하드링크 방식을 활용하여 중복 설치를 최소화하고 디스크 사용량을 줄이는 장점이 있어 성능이 중요한 프로젝트에서 유리하다.

마이크로 프론트엔드 기술 발전 과정과 인사이트

마이크로 프론트엔드는 마이크로서비스 아키텍처에서 영감을 받아 등장한 개념으로, 프론트엔드 애플리케이션을 여러 개의 독립적인 모듈로 나누어 관리할 수 있도록 한다. 초기에는 단일 리포지토리에서 모든 프론트엔드를 관리하는 방식이 일반적이었으나, 프로젝트 규모가 커지고 팀이 분리되면서 단일 코드베이스에서 발생하는 복잡성과 배포 문제를 해결하기 위해 마이크로 프론트엔드가 대두되었다.

초기에는 iframe을 활용한 방식이 있었지만, 이는 성능 저하와 보안상의 문제로 인해 효율적이지 않았다. 이후, Web Components를 활용하는 방식이 등장하면서 기술적으로 더욱 유연한 구성이 가능해졌다. Web Components는 표준 웹 기술을 활용하여 독립적인 UI 컴포넌트를 만들고, 서로 다른 프레임워크 간의 호환성을 높이는 역할을 한다. 하지만 Web Components만으로는 상태 관리나 데이터 공유가 어렵기 때문에, 이를 보완하기 위해 Module Federation 같은 기술이 활용되었다.

Module Federation은 Webpack 5에서 도입된 기능으로, 서로 다른 애플리케이션 간에 코드를 동적으로 로드하고 공유할 수 있게 해준다. 이를 통해 마이크로 프론트엔드 애플리케이션 간의 독립성을 유지하면서도 공통 컴포넌트나 상태를 효과적으로 공유할 수 있다. 특히, 대규모 엔터프라이즈 프로젝트에서는 각 팀이 독립적으로 배포하고 운영할 수 있는 환경을 제공하기 때문에 생산성과 유지보수성이 크게 향상된다.

현재 마이크로 프론트엔드는 단순한 개념을 넘어, 다양한 프레임워크와 결합하여 발전하고 있다. 예를 들어, Next.js나 Remix 같은 풀스택 프레임워크에서도 마이크로 프론트엔드 아키텍처를 적용할 수 있는 방식이 연구되고 있으며, Turborepo 같은 모노레포 빌드 시스템과 결합하여 더욱 효율적인 개발 환경을 구축할 수 있다.

이러한 발전을 보면서, 단순히 기술을 따라가기보다는 프로젝트의 요구 사항과 팀의 구조에 맞는 도구를 선택하는 것이 가장 중요하다는 점을 느낀다. 마이크로 프론트엔드가 모든 프로젝트에 적합한 것은 아니며, 특정 상황에서는 오히려 유지보수 비용이 증가할 수도 있다. 따라서 적절한 기술을 선별하고, 현재의 기술 트렌드가 어떻게 발전하는지 지속적으로 분석하는 것이 필요하다.

#패스트캠퍼스 #직장인자기계발 #직장인공부 #환급챌린지 #패스트캠퍼스후기 #오공완

필수 URL https://bit.ly/4gL1f1o