[TIL] Microfrontends with React : 개발자 가이드

마이크로 프런트엔드 강의를 완주했습니다.

https://www.udemy.com/course/microfrontend-course/

난해하고 잘 쓰기 어려운 기술이라 거의 쓰이지 않을 것 같습니다. 그러나 강의를 따라 가면서, 몇가지 react 와 javascript 프런트엔드에 대해 깨닫는 바가 있어서 유익하다고 생각합니다. 특히 라우팅 부분은 여러 spa 로 구성되는 복합 앱 개발에서는 잘 이해하는 게 좋을 것 같았습니다. CSS 네임스페이스의 필요성도 마이크로 프런트엔드에서는 꼭 필요하다는 걸 실감하게 됩니다.

… 추천하긴 애매한 강의네요.

강의 내용 소개 번역

마이크로 프론트엔드는 대규모 앱을 여러 개의 작은 앱으로 나누는 데 사용됩니다. 이는 프론트엔드 개발에 다음과 같은 고유한 이점을 제공합니다.

• 더 작고 이해하기 쉬운 코드베이스 작성

• 각 서브 앱(sub-app)마다 다른 라이브러리 세트 사용 - 작업에 가장 적합한 도구 도입!

• 각 부분을 개별적으로 배포 - 사용자의 이용이 중단될 가능성 최소화

• 각 엔지니어링 팀이 독립적으로 작업할 수 있도록 지원

다음은 이 강의에서 다루는 주제의 일부 목록입니다.

• 세계 최대 규모의 기업들이 사용하는 디자인 패턴 학습

• 마이크로 프론트엔드를 언제 사용해야 하는지 이해

• 계층형 라우팅(tiered routing) 시스템을 사용하여 여러 앱 연결

• 교차 앱 오염 방지를 위한 페이지 내 CSS 스코프(Scope) 설정

• 격리성을 높이기 위해 앱 간 상태 공유 방지

• 프로덕션 버그를 방지하기 위해 앱의 각 부분을 독립적으로 배포

• 릴리스 프로세스를 자동화하는 CI/CD 파이프라인 구축

• 동일한 앱에서 여러 프론트엔드 프레임워크 활용

• 모듈 페더레이션(module federation)을 사용한 성능 극대화