MFA, 누구냐 너: 공통 플랫폼개발 파트의 MFA도입기 / if(kakao)2022
if kakao 카카오 · YouTube
AI 핵심 요약
공통 플랫폼개발 파트는 여러 애플리케이션에서 같은 화면을 중복 개발하고, 하나의 앱을 여러 조직이 함께 운영하면서 테스트와 배포 일정이 얽히는 문제를 겪었습니다. 이를 해결하기 위해 마이크로 프론트엔드 아키텍처(MFA)를 검토하고, 번들된 JS·CSS를 런타임에 내려받아 컨테이너 앱에 주입하는 방식을 선택했습니다. 컨테이너와 마이크로 앱에서 필요한 로직을 공통 npm 모듈로 제공해 기존 앱의 변경을 줄였고, 앱별 소유권을 분리해 조직 간 결합도와 중복 개발을 낮췄습니다. 다만 중복 번들로 인한 페이로드 증가, 앱별 빌드·배포 파이프라인 운영, CSS와 전역 window 공유에 따른 충돌은 계속 해결해야 할 과제로 남았습니다.
- 마이크로 앱의 소유권과 배포 책임을 명확히 나누면 조직 간 일정 조율과 운영 의존성을 줄일 수 있습니다.
- 구현 방식을 고를 때는 앱 간 통신, 라우팅, 배포 독립성, 기존 코드 변경량을 함께 비교해야 합니다.
- 런타임 JS·CSS 인젝션은 빌드 시점 통합보다 배포를 분리하기 쉽지만, 각 앱의 번들에 중복 의존성이 포함될 수 있습니다.
- CSS 전역 영향과 window 객체 공유로 생기는 라이브러리 충돌은 개발 단계에서 재현·디버깅하기 어려울 수 있습니다.
소개
조직이 비대해지고 어플리케이션이 커짐에 따라 프론트앤드 중복개발, 팀간 운영/배포의 상호 의존성등의 문제가 발생할 수 있습니다. 이런 경우 프론트앤드 앱 자체를 하나의 Micro App으로 만들어 배포하는 방식을 고려할 수 있습니다. 이때 사용할 수 있는 방법 중 하나로 MFA(Micro Front-end Architecture)이 있습니다. 본 세션에선 아직 생소한 개념인 MFA에 대한 설명과 공통플랫폼개발 파트에서 왜 MFA를 선택했는지, 어떤 과정을 거쳐 구현을 해냈는지에 대한 설명을 진행할 예정입니다. #MFA 카카오 공통플랫폼개발파트에서 프론트앤드 개발을 담당하고 있는 썬입니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-74 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 ...
비슷한 학습 자료
컨퍼런스 if kakao
1년간 진행된 카카오맵 매장관리 프로젝트에서 TDD를 활용하여, 디자인, 마크업, API 없이도 프론트엔드 개발을 사전에 진행했던 경험을 바탕으로 새로운 프로세스를 제안합니다. 이를 통해 프론트엔드 개발을 보다 효율적으로 진행할 수 있는 방법론을 소개하고자 합니다. #front-end #TDD #Vue.js 카카오의 지도서비스 및 매장관리 서비스 프론트엔드 업무를 담당하고 있는 Cayde입니다. 발표자료 보기 👉 https://speakerdeck.com/kakao/ifkakao24-34 if(kakaoAI)2024에 대한 자세한 정보는 👉 https://if.kakao.com #카카오 #이프카카오 #개발자컨퍼런스 #AI #기술 #개발 #ifkakaoAI2024
프론트엔드 TDD
컨퍼런스 if kakao
ㄷㄷㄷ: Domain Driven Design과 적용 사례공유 / if(kakao)2022
컨퍼런스 if kakao
Legacy Server의 포팅을 위해 Domain Driven Design을 적용하여 MSA 화 한 사례를 공유합니다. #MSA #DDD 카카오 엔터테인먼트에서 백엔드 개발자로 일하고 있는 셜록입니다. git blame을 열면 혹시나 제가 짠 코드일까 두근두근하면서, 레거시 서버로 고통받았던 나날과 함께 backlog를 열심히 청소하는 중입니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-37 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 #개발자컨퍼런스 #기술 #개발 #ifkakao2022
백엔드
컨퍼런스 if kakao
마이크로프론트엔드. 실무에 쓸만할까? / if(kakao)2022
컨퍼런스 if kakao
요즘 FE 기술 트렌드로 많이 언급되는 '마이크로 프론트엔드'. 말은 많은데, 실무에 어떻게 적용할 수 있을까요? 그리고 내 프로젝트에 적용해도 되는 걸까요? 그리고 적용하면 어떤 이득이 있을까요? 개발자와 사용자 모두 win-win 할 수 있는 마이크로 프론트엔드 아키텍처. 카카오워크 FE 개발팀은 실무에 어떻게 적용하고 있는지를 공유해 드립니다. #MSA #UX 카카오워크의 관리자 서비스를 개발하고 있습니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-82 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 #개발자컨퍼런스 #기술 #개발 #ifkakao2022
프론트엔드
컨퍼런스 if kakao
카카오페이의 프론트엔드 서비스가 제공되는 환경에 대해 이야기 하고, 프론트엔드 서비스가 제공되는 환경의 관점에서 개발자 경험과 사용자 경험을 개선하기 위한 카카오페이 프론트엔드 팀의 작업을 사례를 통해 이야기합니다. #UX 카카오페이 FE인프라TF TF장 에릭입니다. 카카오페이 FE 서비스의 근간을 이루는 다양한 환경에 대한 고민을 하고 있습니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-83 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 #개발자컨퍼런스 #기술 #개발 #ifkakao2022
웹 개발 프론트엔드
컨퍼런스 if kakao
카카오페이 앱 리빌딩 스토리 / if(kakao)2022
컨퍼런스 if kakao
카카오페이앱을 리빌딩하면서 겪은 과정들을 소개해 드리려고 합니다. #Android 카카오페이 안드로이드 주식 서비스 업무를 맡고 있는 스카일러입니다. 카카오페이 안드로이드 계정 서비스 업무를 맡고 있는 에디입니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-91 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 #개발자컨퍼런스 #기술 #개발 #ifkakao2022
모바일 앱 개발
컨퍼런스 if kakao
Preview Frontend @if(kakao)2022
컨퍼런스 if kakao
if(kakao)2022 컨퍼런스에서 Frontend 관련 기술 발표 트랙을 소개합니다. 01:28 1. MFA, 누구냐 너: 공통 플랫폼개발 파트의 MFA도입기 by 어호선(sun.kist) 카카오 공통플랫폼개발파트에서 프론트앤드 개발을 담당하고 있는 썬입니다. 01:58 2. 마이크로프론트엔드. 실무에 쓸만할까? by 김수찬(tony.chan) 카카오워크의 관리자 서비스를 개발하고 있습니다. 02:17 3. 웹 반응성 개선하기: Lighthouse Userflow를 사용한 웹 반응성 개선기 by 박은우(ethan.eunwu) 카카오 FE플랫폼팀에서 FE개발자를 위한 개발을 하는 에단입니다. 02:35 4. 카카오페이 프론트엔드 개발팀의 Client Side Rendering 환경 고도화 by 박병현(eric.dev) 카카오페이 FE인프라TF TF장 에릭입니다. 카카오페이 FE 서비스의 근간을 이루는 다양한 환경에 대한 고민을 하고 있습니다. 02:56 5. 광고 웹 ...
프론트엔드