# Micro Frontend

ckstn0777

저번 시간에 Module Federation 글에 연장선으로 이번 시간에는 Monorepo에 대해 알아보도록 하겠습니다. 모노레포 또한 대규모 웹 애플리케이션 개발 시 자주 언급되는 방법론인거 같습니다. 그만큼 토스, 라인 등 여러 회사에서 채택되어 사용되고 있습니다.

ckstn0777

최근에 우연찮게 Micro Frontends에 대해 알아볼 기회가 생겼습니다다. 사실 그 전까지는 알아볼 필요성을 못느꼈다고 봐야 될 거 같습니다. 이전 회사에서 제가 맡은 서비스가 대규모인것도 아니었고, 개인적인 공부나 실습에서도 사용할 필요가 없었기 때문입니다.

woodie

Micro Frontend

kyman19940214

Micro Frontend 마이크로 프론트엔드 아키텍쳐를 잘 활용하기 위해서 몇가지 지켜야하는 필수사항들이 있다. 컨테이너 외의 프로젝트들끼리는 공유되는게 없어야한다. 함수/객체/클래스 상태값(ex.redux,context) 라이브러리 컨테이너와 하

kyman19940214

지난번에 이어서 마이크로 프론트엔드를 좀 더 파헤쳐 보자. 저번에 구현 부분을 네트워크탭에서 확인해보면 cart와 products에서 동시에 faker 모듈을 분리해서 불러오고 있는것을 볼 수 있다. 하지만 faker은 중첩된 모듈이고 번들 사이즈도 매우 큰편이기에 효

kyman19940214

마이크로 프론트엔드 아키텍쳐를 리액트를 가지고 실제로 적용시켜 보며 개념을 정리해보자.모놀로식 애플리케이션을 여러개의 조금한 애플리케이션으로 나누어 개발하는 것을 말한다. 일반적으로 마이크로 서비스 아키텍쳐 개념을 프론트엔드 애플리케이션에 접목시켰다고 이해하면 쉬울 것

lucas

글을 시작하며.. 과거에서부터 웹 프론트엔드 기술은 요구되는 기능의 양이 방대해지면서 다양하게 진화를 거듭해왔다. 이를테면 여러 모듈을 번들링하고 ECMAScript를 지원하지 않는 브라우저를 위해 코드 트랜스파일링을 진행해주는 바벨 플러그인을 사용할 수 있는 웹팩의

yoonjeong222

single-spa cli를 설치한다.글로벌에 설치로컬에 설치글로벌에 설치했을 경우로컬에 설치했을 경우

ksh5324

리액트 프로젝트를 모놀릭스 아키텍처에서 micro-frontend로 바꿔보자

god5612

모든 패밀리 사이트의 폰트는 process.env.VUE_APP_COMM_HOSTNAME + "/styles/fonts/\_font.css" 으로 일관성있게 적용blink현상 없이 폰트 적용(폰트 로더가 먼저 로딩)webfontloader.tsremote package

god5612

remote에서 공유된 CSS가 우선순위를 가짐.hostmain.tsremote webpack.config.js

god5612

각자 독립된 scope에서 서로 다르게 반영되어 동작함.remote \_variables.sasshost\_variables.sasswebpack.config.js(remote, host 양측 동일) webpack에 의해 번들링될때 scss의 variables($p

god5612

types/types.d.tsmain.ts

god5612

webpack5 module Federation 2020년 10월에 릴리즈한 webpack5 스펙에 module Federation이 추가 되었다. 실무에 적용해 보고 그 과정을 공유해 보자.

jonghunbok

원문: When should you leverage Module Federation, and how? 모듈 페더레이션(Module Federation)을 언제, 왜, 어디서 활용해야 하는지에 관해 기술의 창안자의 생각과 패턴을 공유합니다.

eungyeole

Micro-Frontend를 구축하게 된 이유를 다룹니다.

laeyoung

요즘 몇년 사이의 Backend 트랜드인 Micro Services의 Frontend 버전을 만든 것에 대한 글