An Awesome list of posts, videos and tutorials on Micro Frontends
# Awesome Micro-Frontends [![Awesome](https://awesome.re/badge.svg)](https://github.com/sindresorhus/awesome)

An awesome list of resources about **Micro-Frontends** architecture such as tools, books, posts, videos, talks and more.

Hoping to keep this list updated as much as possible, any new links through PRs are appreciated.

## Contents
- [Slack Workspaces](#slack-workspaces)
- [Websites](#websites)
- [Tools](#tools)
- [Books](#books)
- [Posts](#posts)
- [Videos](#videos)
- [Slides](#slides)
- [Experience Reports](#experience-reports)
- [Follow on Twitter](#follow-on-twitter)
- [Courses and Tutorials](#courses-and-tutorials)
- [Podcasts](#podcasts)

## Slack Workspaces
- [Micro-frontends](https://join.slack.com/t/micro-frontendsgroup/shared_invite/enQtNzA0NjM2NjA5NjU0LWQ5MjFiNjkxZTRhYTU3ZjQ3NWU1Njg3MWFjYzhjZjVhNjAxMzdkODJiZTMzNDZiYmYwZjUwZTk1ZmU3M2M2NDI)
- [Single-Spa](https://join.slack.com/t/single-spa/shared_invite/zt-j4c38g92-JmV7O~35dkN1CnaBkK7NTw)

## Websites
- [micro-frontends.org](http://micro-frontends.org)
- [Micro Frontends by Elisabeth Engel](https://micro-frontends.zeef.com/elisabeth.engel?ref=elisabeth.engel&share=ee53d51a914b4951ae5c94ece97642fc)

## Tools

### Projects
- [Project Mosaic](https://www.mosaic9.org/) - A set of services, libraries together with a specification by Zalando.
- [Bit](https://github.com/teambit/bit) - A tool for developing and composing / integrating independently versioned components.

### Frameworks
- [Ara Framework](https://ara-framework.github.io/website/)
- [Garfish](https://github.com/modern-js-dev/garfish) - A powerful micro front-end framework.
- [icestark, a micro frontends solution for large application](https://github.com/ice-lab/icestark)
- [Isomorphic Layout Composer](https://github.com/namecheap/ilc) - Complete solution for Micro Frontends composition into SPA with SSR support.
- [Misk Web: a Micro-Frontends React + Redux + Typescript Framework](https://cashapp.github.io/misk-web/)
- [NUT](https://github.com/nut-project/nut)
- [OpenComponents, a framework for developing and distributing html components](https://github.com/opencomponents/oc)
- [PuzzleJs](https://github.com/puzzle-js/puzzle-js)
- [Single-Spa](https://single-spa.js.org/)
- [qiankun, probably the most complete micro-frontends solution you ever met](https://qiankun.umijs.org/)
- [One-app by American Express](https://github.com/americanexpress/one-app)
- [Scalecube-js: Toolkit for working in micro-services/micro-frontends architecture](https://github.com/scalecube/scalecube-js)
- [Berial - Simple micro-front end framework](https://github.com/berialjs/berial)
- [Podium](https://podium-lib.io) - Easy server side composition of microfrontends.
- [Nuz is an open-source project, the runtime package manager for web platform.](https://docs.nuz.app/introduction/overview) - WIP.
- [Luigi - technology agnostic, open-source micro-frontend framework](https://luigi-project.io/)
- [VoltranJS](https://github.com/hepsiburada/VoltranJS)

### Platforms
- [Mashroom Server](https://www.mashroom-server.com)
- [Piral](https://piral.io)

### Related
- [Angular_MicroApps_Different_Technologies](https://github.com/manfredsteyer/Angular_MicroApps_Different_Technologies)
- [A tiny, fast, zero-dependency event emitter](https://github.com/chrisdavies/eev)
- [Exercises for course "Integrating microservices on the frontend"](https://github.com/0xR/micro-frontend)
- [Extending the microservice paradigms to web development](https://github.com/neuland/micro-frontends)
- [Micromono](https://github.com/lsm/micromono)
- [Microservices in the frontend with BFFs providing their own bundles and API.](https://github.com/dactylographsy/browser-dactylographsy)
- [Proxy middleware for express that enables composition of microservices.](https://github.com/tes/compoxure)
- [Service Oriented Front-end](https://github.com/CanopyTax/sofe)
- [Simulate a micro frontend project using Node.js, React and NGinx Reverse Proxy in Alpine Docker images](https://github.com/willmendesneto/micro-frontend-pages)
- [Micro-Frontends architecture](https://docs.nuz.app/guides/micro-frontends-architecture)

## Books
- [Micro Frontends in Action](https://www.manning.com/books/micro-frontends-in-action)
- [Building Micro-Frontends](https://www.buildingmicrofrontends.com/)
- [Micro Frontend & Micro Services - Build applications with Micro FE & Services](https://www.google.de/books/edition/Micro_Frontend_Micro_Services/pOvtDwAAQBAJ?hl=de&gbpv=0) - By Muralikrishna T.
- [The Art of Micro Frontends](https://www.packtpub.com/product/the-art-of-micro-frontends/9781800563568) - By Florian Rappl.
- [Practical Module Federation](https://module-federation.myshopify.com/products/practical-module-federation) - By Zack Jackson & Jack Herrington.
- [Enterprise Angular - DDD, Nx Monorepos and Micro Frontends](https://leanpub.com/enterprise-angular) - By Manfred Steyer.
- [Micro Frontends Architecture: Introduction, Design, Techniques & Technology](https://www.amazon.de/Micro-Frontends-Architecture-Introduction-Techniques/dp/1097927989/) - By Ajay Kumar.

## Posts
- [The Future of Micro-Frontends](https://betterprogramming.pub/the-future-of-micro-frontends-2f527f97d506)
- [Building Micro-Frontends With Single-spa, React, and Vue](https://dzone.com/articles/building-micro-frontends-with-single-spa-and-react)
- [6 Patterns for Microfrontends](https://blog.bitsrc.io/6-patterns-for-microfrontends-347ae0017ec0)
- [Micro Frontends by Cam Jackson](https://martinfowler.com/articles/micro-frontends.html)
- [Micro frontends - a microservice approach to front-end web development](https://medium.com/@tomsoderlund/micro-frontends-a-microservice-approach-to-front-end-web-development-f325ebdadc16)
- [Cookie Cutter Scaling](https://paulhammant.com/categories.html#Cookie_Cutter_Scaling)
- [Microservice Websites](https://gustafnk.github.io/microservice-websites/)
- [What is a micro frontend](https://hub.packtpub.com/what-micro-frontend/)
- [ThoughtWorks Technology Radar](https://www.thoughtworks.com/de/radar/techniques/micro-frontends)
- [Dynamic vs. static ui composition](https://medium.com/@heartfor.it/dynamic-vs-static-ui-composition-4325282c760d)
- [Micro-libraries: The Future of front-end development](http://blog.wolksoftware.com/microlibraries-the-future-of-web-development)
- [The monolithic frontend in the microservices architecture](https://xebia.com/blog/the-monolithic-frontend-in-the-microservices-architecture/)
- [A Software Architect's Approach towards MicroFrontends](https://www.softwarearchitekt.at/post/2017/12/28/a-software-architect-s-approach-towards-using-angular-and-spas-in-general-for-microservices-aka-microfrontends.aspx)
- [An approach to building Scalable Web Apps](https://medium.com/@areai51/microfrontends-an-approach-to-building-scalable-web-apps-e8678e2acdd6)
- [A Take on Micro-Frontends](https://x-team.com/blog/micro-frontend/)
- [Building Microfrontends - Series](https://medium.com/@_rchaves_/building-microfrontends-part-i-creating-small-apps-710d709b48b7)
- [Including Front-End Web Components Into Microservices](https://technologyconversations.com/2015/08/09/including-front-end-web-components-into-microservices/)
- [Microservice Grid and Micro Frontends](https://dejanglozic.com/2017/02/22/microservice-grid-and-micro-frontends/)
- [Microservice Websites](http://microservice-websites.netlify.com/)
- [Microservices to Micro-Frontends by Sandeep Jain](http://www.agilechamps.com/microservices-to-micro-frontends/)
- [Front-end microservices with Web Components](https://hackernoon.com/front-end-microservices-with-web-components-597759313393)
- [Supporting Micro-frontends with ASP.NET Core MVC](https://blogs.msdn.microsoft.com/premier_developer/2018/03/09/supporting-micro-frontends-with-asp-net-core-mvc/)
- [Building micro frontends — angular elements](https://itnext.io/building-micro-frontend-applications-with-angular-elements-34483da08bcb)
- [Micro Front-Ends: Webpack Manifest](https://medium.embengineering.com/micro-front-ends-webpack-manifest-b05fc63a0d53)
- [My experience using micro frontends by David Den Toom](https://medium.com/@daviddentoom/my-experience-using-micro-frontends-e99a1ad6ed32)
- [Page Building using Micro-Frontends and Server-Side Include](https://medium.com/js-dojo/page-building-using-micro-frontends-c13c157958c8)
- [Strangling a Monolith to Micro-frontends with Laravel, Vue.js, and Hypernova](https://medium.com/js-dojo/strangling-a-monolith-to-micro-frontends-decoupling-presentation-layer-18a33ddf591b)
- [Serverless Micro-frontends using Vue.js, AWS Lambda, and Hypernova](https://medium.com/js-dojo/serverless-micro-frontends-using-vue-js-aws-lambda-and-hypernova-835d6f2b3bc9)
- [Using Micro-Frontends in WordPress with Gutenberg Blocks](https://itnext.io/using-micro-frontends-in-wordpress-with-gutenberg-blocks-882faad8cd62)
- [Taming the Frontend Monolith](https://blog.logrocket.com/taming-the-front-end-monolith-dbaede402c39/)
- [Micro-frontend Architecture: Replacing a Monolith from the Inside Out](https://levelup.gitconnected.com/micro-frontend-architecture-replacing-a-monolith-from-the-inside-out-61f60d2e14c1)
- [Breaking down the last Monolith - Micro Frontends](https://dev.to/aregee/breaking-down-the-last-monolith-micro-frontends-hd4)
- [Micro Frontends in Action](https://medium.com/swlh/micro-frontends-in-action-221d4ed81c35)
- [How to build your first Micro Frontend with SSR in minutes](https://levelup.gitconnected.com/how-to-build-your-first-micro-frontend-with-ssr-in-minutes-95cd57788529)
- [You probably don't need a micro-frontend](https://blog.scottlogic.com/2021/02/17/probably-dont-need-microfrontends.html)

## Videos
- [Micro-Frontends Antipatterns](https://www.youtube.com/watch?v=7qQQUcG9fqo) - Talk by Luca Mezzalira in CityJS conference 2022.
- [The Microfrontend Revolution: Using Webpack 5 Module Federation](https://www.youtube.com/watch?v=sJGADUuLk5Y) - A talk by Manfred Steyer in JS Poland 2022.
- [Micro-Frontends with Module Federation: Beyond the Basics](https://hasgeek.com/jsfoo/microfrontends-conf/schedule/micro-frontends-with-module-federation-beyond-the-basics-9ax2jaoaxMo2bNcbuuNXdo) - Talk by Manfred Steyer in Micro Frontends Conference in JSFoo 2022.
- [Micro Frontend - Web Rebels, Oslo 2018](https://www.youtube.com/watch?v=dTW7eJsIHDg)
- [Break Up With Your Frontend Monolith - JS Kongress 2017](https://www.youtube.com/watch?v=W3_8sxUurzA)
- [YouTube Playlist - Micro Frontend Talks](https://www.youtube.com/playlist?list=PLI1AtZo9B3YL_xpi19IuxFcTuCi2_thQT)
- [Micro­service Websites by Gustaf Nilsson Kotte](https://vimeo.com/242458365)
- [Breaking The Monolith](https://vimeo.com/97666093)
- [Microservice UI Composition](https://www.oio.de/m/konf/wjax2016/Microservice-UI_WJAX2016.pdf)
- [Introduction to Piral](https://www.youtube.com/watch?v=SkKvpBHy_5I)
- [Micro Frontend Architecture - Building an Extensible UI Platform](https://www.youtube.com/watch?v=9Xo-rGUq-6E) - A talk by Erik Grijzen on how New Relic implemented Micro Frontends.
- [Microfrontends and single spa](https://www.youtube.com/playlist?list=PLLUD8RtHvsAOhtHnyGx57EYXoaNsxGrTU) - Playlist by Joel Denning.
- [Micro-Frontends: Whay, why and how?](https://www.youtube.com/watch?v=w58aZjACETQ) - A Video by Jack Herrington.
- [Web Components for Micro Frontends](https://www.youtube.com/watch?v=XUtCnA9WEgQ) - Jack Herrington using Web Components for Micro Frontends.
- [Micro Frontends using single-spa](https://www.youtube.com/watch?v=wU06eTMQ6yI) - Jack Herrington using single-spa.
- [Micro Frontends using Open Components](https://www.youtube.com/watch?v=9CG0LeswOoM) - Jack Herrington on using Open Components.
- [DIY Micro FE Framework](https://www.youtube.com/watch?v=4U067O3_fYk) - Jack Herrington on building a Micro-FE Framework.
- [Micro-FEs in Zoid](https://www.youtube.com/watch?v=2jhTHjF-e2Y) - Jack Herrington on using Zoid.
- [Edge Side Includes for Micro-FEs](https://www.youtube.com/watch?v=4PoNBZl4t0Y) - Jack Herrington on using ESI.
- [The one right way to do microfrontends - two opinions](https://www.youtube.com/watch?v=u4SSOZhZ-3k) - A Talk by Mario Fernandez for Thoughtworks Presents.
## Slides
- [Micro Frontend - Web Rebels, Oslo 2018](https://noti.st/naltatis/HxcUfZ/micro-frontends-think-smaller-avoid-the-monolith-love-the-backend)
- [Migrating from Monolith to Microfrontends](http://slides.com/yaprakayazoglu/monolith-to-microfrontend)
- [Microservice Websites (microXchg 2017)](https://www.slideshare.net/GustafKotte/microservice-websites-microxchg-2017)
- [Microservice Websites Presentation](https://www.slideshare.net/GustafKotte/microservice-websites-redev-2017-81811987)
- [Avoid the Monolith by Michael Geers](https://noti.st/naltatis/HxcUfZ/slides)
- [Micro Frontends by Michael Geers](https://speakerdeck.com/naltatis/micro-frontends-yglf-tel-aviv)
- [Micro Frontends - The Nitty Gritty Details or Frontend, Backend, 🌈 Happyend](https://noti.st/naltatis/zQb2m5/micro-frontends-the-nitty-gritty-details-or-frontend-backend-happyend)
- [Micro Frontends by Assaf Gannon](https://de.slideshare.net/AssafGannon/micro-frontends)
- [Micro Frontends by Srikanth Jallapuram](https://de.slideshare.net/SrikanthJallapuram/micro-frontends-78813796)
- [Micro Frontends: Building a modern webapp with multiple teams by Michael Geers](https://speakerdeck.com/naltatis/micro-frontends-building-a-modern-webapp-with-multiple-teams)
- [Introduction to micro frontends by Kuba Holak](https://slides.com/kubaholak/introduction-to-micro-frontends)
- [Microfrontends architecture by Lucca Mezzalira](https://docs.google.com/presentation/d/1-SGjpuL6TibMlnawW42nFA9rDXclLrC_vQrn2cBJMo8/edit#slide=id.g35f391192_00)
- [Lets talk about Micro Frontends](https://microfrontend.deckset.net/)
- [Building micro-frontends by Luca Mezzalira](https://docs.google.com/presentation/d/1DgK2mjJ9IYbCmjgzJH5ru5YLv88zKpcCxKrMozqnT3A/edit#slide=id.g42f50ce565_0_651)
- [Micro Frontend Architecture - Building an Extensible UI Platform](https://speakerdeck.com/erikgrijzen/micro-frontend-architecture-building-an-extensible-ui-platform) - A talk by Erik Grijzen on how New Relic implemented Micro Frontends.



## Experience Reports

- [Upwork: Modernizing Upwork with Micro Frontends](https://www.upwork.com/blog/2017/05/modernizing-upwork-micro-frontends/)
- [allegro: Managing Frontend in the Microservices Architecture](https://allegro.tech/2016/03/Managing-Frontend-in-the-microservices-architecture.html)
- [Hello Fresh: Front-end Microservices](https://engineering.hellofresh.com/front-end-microservices-at-hellofresh-23978a611b87)
- [OpenTable: Microservices in the Frontend World](http://tech.opentable.co.uk/blog/2016/04/27/opencomponents-microservices-in-the-front-end-world/)
- [OpenTable: Dismantling the monolith](http://tech.opentable.co.uk/blog/2015/02/09/dismantling-the-monolith-microsites-at-opentable/)
- [5 years of OpenComponents](https://medium.com/@matteofigus/5-years-of-opencomponents-3114e6d6a35b)
- [AutoScout24: UI Composition](https://medium.com/scout24-engineering)
- [Klarna Checkout](https://news.ycombinator.com/item?id=13012916)
- [Spotify: Technology Stack](https://www.quora.com/What-is-the-technology-stack-behind-the-Spotify-web-client/answer/Andreas-Blixt)
- [Let's build a Webshop out of Micro Frontends](https://blog.senacor.com/microfrontends/)
- [Using Micro-Frontends to Permanently Solve the Legacy JavaScript Problem](https://medium.com/hacking-talent/using-micro-frontends-to-permanently-solve-the-legacy-javascript-problem-5fba18b0ceac)
- [Micro Frontends with Gustaf Nilsson Kotte](https://www.case-podcast.org/22-micro-frontends-with-gustaf-nilsson-kotte)
- [Experiences Using Micro Frontends at IKEA](https://www.infoq.com/news/2018/08/experiences-micro-frontends/)

## Follow on Twitter

### Hashtags
- [#microfrontend hashtag on Twitter](https://twitter.com/hashtag/microfrontend)
- [#microfrontends hashtag on Twitter](https://twitter.com/hashtag/microfrontends)


### People
- [Amanda Muñoz (@amandamunoz)](https://twitter.com/amandamunoz)
- [Assaf Gannon (@assafga1)](https://twitter.com/assafga1)
- [Cam Jackson (@thecamjackson)](https://twitter.com/thecamjackson)
- [David Leitner (@duffleit)](https://twitter.com/duffleit)
- [Elisabeth Engel (@\_lizzelo\_)](https://twitter.com/\_lizzelo\_)
- [Elmar 🐼 🇪🇺 (@elmarburke)](https://twitter.com/elmarburke)
- [Emanuel Indermühle (@inthemill)](https://twitter.com/inthemill)
- [Felipe Guizar Diaz (@felipeguizard)](https://twitter.com/felipeguizard)
- [Florian Rappl (@FlorianRappl)](https://twitter.com/FlorianRappl)
- [Gil Fink (@gilfink)](https://twitter.com/gilfink)
- [Gustaf Nilsson Kotte (@gustaf_nk)](https://twitter.com/gustaf_nk)
- [Hans-Christian Otto (@muhdiekuh)](https://twitter.com/muhdiekuh)
- [Ivan Jovanovic (@ivanjov96)](https://twitter.com/ivanjov96)
- [Joel Denning (@Joelbdenning)](https://twitter.com/Joelbdenning)
- [Kuba Holak (@kubaholak)](https://twitter.com/kubaholak)
- [Luca Mezzalira (@lucamezzalira)](https://twitter.com/lucamezzalira)
- [Lucas Dohmen (@moonbeamlabs)](https://twitter.com/moonbeamlabs)
- [Manfred Steyer (@ManfredSteyer)](https://twitter.com/ManfredSteyer)
- [Michael Geers (@naltatis)](https://twitter.com/naltatis)
- [Micro Frontend News on Twitter](https://twitter.com/_lizzelo_/lists/micro-frontend-news)
- [Matteo Figus (@matteofigus)](https://twitter.com/matteofigus)
- [Nils Röhrig (@drunknzombiecow)](https://twitter.com/drunknzombiecow)
- [Rui Marques (@ruimarques84)](https://twitter.com/ruimarques84)
- [Rustam Aliyev (@rstml)](https://twitter.com/rstml)
- [Will Mendes (@willmendesneto)](https://twitter.com/willmendesneto)
- [Yaprak Ayazoğlu (@yaprakaya)](https://twitter.com/yaprakaya)
- [Zack Jackson (@ScriptedAlchemy)](https://twitter.com/ScriptedAlchemy)
- [Rahul Gaur (@iamaregee)](https://twitter.com/iamaregee)
- [Lam Hieu (@_lamhieu)](https://twitter.com/_lamhieu)


## Courses and Tutorials
- [Micro Frontends Architecture](https://www.pluralsight.com/courses/micro-frontends-architecture)
- [Building micro-frontends](https://learning.oreilly.com/live-training/courses/building-micro-frontends/0636920358800/)
- [Micro-frontends Decisions Framework](https://www.pluralsight.com/courses/ng-conf-enterprise-session-10)
- [Microfrontends with React: A Complete Developer's Guide](https://www.udemy.com/course/microfrontend-course/)
- [Learn all about Micro-Frontends](https://www.freecodecamp.org/news/learn-all-about-micro-frontends/)


## Podcasts
- [Micro-Frontends with Luca Mezzalira on Software Engineering Daily](https://softwareengineeringdaily.com/2022/02/14/micro-frontends-with-luca-mezzalira/)
- [Michael Geers on Micro Frontends](https://www.se-radio.net/2020/08/episode-422-michael-geers-on-micro-frontends/) - Episode 422 in SE-Radio.
- [What even is a micro frontend?](https://changelog.com/jsparty/121) - Michael Geers in JS Party.
- [So You wanna use Monorepos and Micro Frontends](https://realtalkjavascript.simplecast.com/episodes/episode-99-so-you-wanna-use-monorepos-and-micro-frontends-in-your-enterprise-architecture-with-manfred-steyer) - Manfred Steyer in Real Talk JavaScript.
- [What's so cool about Micro frontends](https://www.thoughtworks.com/podcasts/micro-frontends) - Thoughtworks Technology Podcasts.
- [Micro-Front Ends with Natlia Venditto](https://webrush.io/episodes/episode-113-micro-front-ends-with-natlia-venditto) - Web Rush Podcast Episode 113 about Micro Front-ends.
