MFA(Micro Frontend Architecture)란?

먼저 mfa는 더 큰 프로덕트를 제공하기 위해 응용프로그램에 사용되는 기능들을 작은 프로덕트로 분할한 구조를 말한다.

MFA를 쓰는 이유는?

일반적으로 페이지가 2~3장 정도 되는 프로덕트는 mfa를 생각할 필요도 없다. 하지만 모든 프로덕트가 그렇게 간단하면 좋겠지만, 아닌경우도 있다. 페이지가 20~30 정도되는 프로덕트가 한 레포지토리에서 관리된다면 어떨까? 굉장히 복잡할 것이다. 이를 위해서 mfa라는 아키텍쳐가 나온 것이다.

MFA의 장점

1. 큰 애플리케이션을 작게 나눔으로써 각 앱의 크기가 작고 간단하다.
2. 모든 앱이 분리되어 별도로 개발되기 때문에 서로 독립적이다.
3. 앱이 작기 때문에 빌드하는 시간이 많이 소요되지 않고 빠르게 배포할 수 있다.

MFA의 단점

1. 서로간의 개발환경이 다르므로 복잡도가 높아진다.
2. 배포 번들 사이즈가 커진다.

MFA 통합 방법

나눠진 마이크로 프론트엔드를 결국에 나중에는 합쳐야 한다. 이 합치는 방법으로는 여러가지 방법이 있다.

• 서버 사이드 템플릿 통합

각 서버로 html 템플릿을 요청하고, 최초 응답서버에 각 템플릿을 조합해서 응답을 보낸다. Nginx를 사용하여 라우팅을 한다. 각 프로덕트가 /profile, /home, /search 로 라우트 되면서 서로 다른 코드로 짜여져 있는 프로덕트지만 같은 인증정보를 사용할 수 있다.

• 빌드 타임 통합

마이크로 프론트엔드를 패키지로 배포하고, 컨테이너 앱이 그것들을 라이브러리 종속성으로 포함하도록 하는 것이다. 아래와 같은 package.json이 작성될 수 있다.