Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Micro Frontends with Modern Angular

Avatar for Manfred Steyer Manfred Steyer
PRO
October 18, 2023
0
160

Micro Frontends with Modern Angular

Avatar for Manfred Steyer

Manfred Steyer
PRO

October 18, 2023
Tweet

More Decks by Manfred Steyer

See All by Manfred Steyer
Advanced Micro Frontends: Multi Version/ Framework Scenarios @WAD 2025, Berlin
Avatar for Manfred Steyer manfredsteyer
PRO
0
25
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @enterJS Advanced Angular Day 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
The Missing Link in Angular‘s Signal Story Resource API and httpResource @ngRome 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
87
Your Architecture as a Crime Scene: Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
150
Rethinking Data Access: The New httpResource in Angular
Avatar for Manfred Steyer manfredsteyer
PRO
0
300
Reactive Thinking with Signals, Resource API, and httpResource @Devm.io Angular 20 Launch Party
Avatar for Manfred Steyer manfredsteyer
PRO
0
190
JavaScript as a Crime Scene Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
93
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @jax2025 in Mainz, Germany
Avatar for Manfred Steyer manfredsteyer
PRO
0
170
Premier Disciplin for Micro Frontends Multi Version/ Framework Scenarios
Avatar for Manfred Steyer manfredsteyer
PRO
0
100

Featured

See All Featured
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
48
2.9k
Writing Fast Ruby
Avatar for Erik Berlin sferik
628
62k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
138
34k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
44
2.4k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
161
15k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
30
2.1k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
29
5.4k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
233
17k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
332
24k

Transcript

  1. @ManfredSteyer Micro Frontends with Modern Angular ManfredSteyer

  2. @ManfredSteyer Angular is changing …

  3. @ManfredSteyer

  4. @ManfredSteyer

  5. @ManfredSteyer Federation & Standalone & esbuild Frankenstein w/ Angular Elements

  6. @ManfredSteyer Manfred Steyer

  7. @ManfredSteyer

  8. @ManfredSteyer Booking App Check-in App Boarding App Luggage App

  9. @ManfredSteyer

  10. @ManfredSteyer const Component = await import('other-app/xyz')

  11. @ManfredSteyer const Component = await import('other-app/xyz')

  12. @ManfredSteyer

  13. @ManfredSteyer

  14. @ManfredSteyer

  15. @ManfredSteyer Mindset: Module Federation EcmaScript Modules Import Maps Simple config,

    sharing libs

  16. @ManfredSteyer

  17. @ManfredSteyer 1. ng add @angular-architects/native-federation […] 2. Adjust generated config

    3. Start Shell and Micro Frontends

  18. @ManfredSteyer

  19. @ManfredSteyer

  20. @ManfredSteyer Free eBook (5th Edition) ANGULARarchitects.io/book Module Federation & Nx

  21. @ManfredSteyer Module Federation: Mental Model rocks! Native Federation Web Standards

  22. @ManfredSteyer d Slides & Examples Remote Company Workshops and Consulting

    http://angulararchitects.io