Trainings Instructors FAQ Contact

Advanced Micro Frontend Solutions

Targeted at people with decent experience in micro frontends this workshop will go into advanced details - ensuring that your projects will always scale well.

Some essential properties are shared by all of our offered workshops.

  • ✅ Condensed transfer of expert knowledge
  • ✅ Interactive session to ask questions and form discussions
  • ✅ Examples you can use as a blueprint and guideline for your projects
  • ✅ Lots of practical examples, step-by-step exercises, and live coding
  • ✅ Pair programming with the instructor
  • ✅ Designed by Dr. Florian Rappl

Goals

  • 🎯 Being able to architect, refactor, and create a large-scale micro frontend solution
  • 🎯 Understanding of the advanced issues and edge cases that might arise with micro frontends
  • 🎯 Ability to use the available tooling and frameworks with maximum efficiency

Prerequisites

  • Some knowledge in a framework like React, Angular, or similar
  • Good knowledge of JavaScript

Location and Duration

  • Remote and In-House
  • 2 days

Upcoming Dates

2024 18.07. - 19.07. 7am - 3pm (CET)

Advanced Micro Frontend Solutions

Remote
English English
Florian Rappl
Book Now

Agenda

Theory block

  • Standard problems with micro frontends
  • Performance considerations
  • Important web standards

Guided work

  • Encapsulation of components in the shadow DOM

Theory block

  • Dependency sharing
  • Which dependencies can be bundled safely?
  • Central vs distributed sharing
  • Escape hatches and team awareness

Guided work

  • Setting up distributed sharing via module federation

Theory block

  • Module federation in detail
  • Importmaps and native federation

Guided work

  • Using native federation as a replacement for module federation

Theory block

  • Discovery of micro frontends
  • Properties and options for a micro frontend discovery service

Guided work

  • Using the Piral Feed service as discovery service for native federation

Theory block

  • Server-side rendering of micro frontends
  • Central vs distributed pre-rendering of micro frontends
  • Next.js with Module Federation

Guided work

  • Transforming the tractor example into a Next.js server-side composed micro frontend solution

Conclusion

  • Recap of the initially drawn problems and the discussed solutions
  • How to structure large solutions to remain scalable