프론트엔드도 MFA를 적용해보려고 합니다.

[NarciSource]

MFA

Micro Frontends Achictecture

마이크로서비스아키텍처(MSA)를 프론트엔드로도 확장시켜본 개발 방식입니다.

문제를 잘게 구분해서 나누는 방법을 웹서비스에서도 수행합니다.

문제를 잘게 구분하는 목적은 독립적으로 배포하고 실행하기 위함이겠죠.

프론트엔드에서 보자면 전체화면을 여러 단위로 나누어 개별적으로 개발하고 배포한 후 조립하게 됩니다.

아직 단위를 어떻게 나눌지 어떤 툴로 조합할지를 고민 중인데 같이 이야기하고 토론해주셨으면 좋겠습니다.

진행은

프론트엔드에서 구현은 그대로 진행하면 됩니다. 조합 방식을 고민하고 적용하려고요.

다만 전체 페이지 단위로 개발하면서 구체화하기 보다는 서비스별로 구현하고 있으면 나중에도 분리하기 편할 것 같습니다.

고민할

지금 고민 중인 통합 방식은

• iframe : 각 html 페이지를 통째로 중첩시키는 구조로 통합이 비정상적인 작동이 많아 패스
• Module Federation : 웹팩을 이용해 종합 빌드를 한번 더 하는 방법
• Web Components : 웹표준으로 커스텀 컴포넌트로 캡슐화하는 방법 -> 컴포넌트로는 서비스 단위를 담기 힘들 것 같아...
• Single-SPA : 라우팅과 하위 모델을 통해 여러 이종간 SPA(Vue.js, React, Angular)들을 통합하는 방법