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

Native Federation: The Future of Micro Frontend...

Avatar for Manfred Steyer Manfred Steyer PRO
July 18, 2024
Programming
510
0

Native Federation: The Future of Micro Frontends in Angular

Avatar for Manfred Steyer

Manfred Steyer PRO

July 18, 2024

More Decks by Manfred Steyer

See All by Manfred Steyer
Signal Forms: Beyond the Basics @ngBaguette 2026 in Paris
Avatar for Manfred Steyer manfredsteyer
PRO
0
89
Agentic UI beyond Chats Architecture Patterns & Open Standards @ngMunich 05/2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
140
Agentic AI in the Frontend: Architectures with Open Standards @iJS London 2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
110
Agentic AI & UI: Arcitecture, HITL, Emerging Standards
Avatar for Manfred Steyer manfredsteyer
PRO
0
140
Agentic UI Requires Standards: AG-UI, A2UI, and MCP Apps Work Together @Angular London
Avatar for Manfred Steyer manfredsteyer
PRO
1
77
Signal Forms: Beyond the Basics @ngBelgrade 2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
200
Agentic UI in the Frontend: Architectures with Open Standards @JAX 2026 in Mainz
Avatar for Manfred Steyer manfredsteyer
PRO
0
130
Rethinking Angular: The Future with Signal Store and the New Resource API @JAX 2024 in Mainz
Avatar for Manfred Steyer manfredsteyer
PRO
0
83
Agentic UI with Angular @ngAir April 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
200

Other Decks in Programming

See All in Programming
TSKaigi 2026 TypeScriptバックエンドのオブザーバビリティ戦略 — Datadog × NestJSの実践
Avatar for Taisei Yamamoto taiseiyamamotoan
1
190
The Arts and Crafts of Work in the AI Era — Toward Mastery in Software Development
Avatar for Yoshihito Kuranuki / 倉貫義人 kuranuki
0
350
ユニットテストの先へ：テスト技法で要求・仕様を整理するJava開発実践 / Beyond_Unit_Testing_Practical_Java_Development_Techniques_for_Organizing_Requirements_and_Specifications
Avatar for SHIMANE, Yoshikazu shimashima35
0
140
AI時代の仕事技芸論 — ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ
Avatar for Yoshihito Kuranuki / 倉貫義人 kuranuki
0
100
CLIであることを活かしたGitHub Copilot CLI活用術 / GitHub Copilot CLI Pro Tips & Tricks
Avatar for Naoya.i nao_mk2
1
1k
色即是空、空即是色、データサイエンス
Avatar for KamoNeggi kamoneggi
1
160
AWSはOSSをどのように 考えているのか？
Avatar for アキキー | Akihisa Ikeda akihisaikeda
1
140
Old Dog, New Tricks: The Java 25 Reinvention - JNation
Avatar for A N M Bazlur Rahman bazlur_rahman
0
120
柔軟なPDFレイアウトエディタを支える型システム設計 — Discriminated UnionとConditional Typeの実践
Avatar for minako-ph minako__ph
4
580
不変条件と整合性境界—ビジネスが決める設計判断と実現パターン / Invariants and Consistency Boundaries
Avatar for nrs nrslib
6
1.3k
OSもどきOS
Avatar for Sora Arakawa arkw
0
140
Cloudflare で始める Data Platform
Avatar for Takumi Abe ta93abe
0
300

Featured

See All Featured
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
470
The innovator’s Mindset - 
Leading Through an Era of Exponential Change - McGill University 2025
Avatar for Jean-Marc De Jonghe jdejongh
PRO
1
180
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
Paper Plane (Part 1)
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
7.9k
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
Avatar for AKADEMIYA2063 akademiya2063
PRO
1
120
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
Avatar for Tomoya Matsuura tomoyanonymous
2
820
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
163
24k
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
370
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
270
14k
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
800
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
52k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
1.3k

Transcript

  1. @ManfredSteyer ManfredSteyer Native Federation: The Future of Micro Frontends in

    Angular WeAreDevelopers World Congress

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

  3. @ManfredSteyer

  4. @ManfredSteyer

  5. @ManfredSteyer

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

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

  8. @ManfredSteyer

  9. @ManfredSteyer

  10. @ManfredSteyer Federation & esbuild Frankenstein w/ Web Components Island Architectures

  11. @ManfredSteyer Manfred Steyer

  12. @ManfredSteyer

  13. @ManfredSteyer

  14. @ManfredSteyer

  15. @ManfredSteyer

  16. @ManfredSteyer

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

    sharing libs

  18. @ManfredSteyer

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

    3. Start Shell and Micro Frontends

  20. @ManfredSteyer

  21. @ManfredSteyer

  22. @ManfredSteyer Wrap them into Web Components Angular App (MFE) React

    App (MFE)

  23. @ManfredSteyer

  24. @ManfredSteyer

  25. @ManfredSteyer

  26. @ManfredSteyer Title Content Call to Action Info More Info

  27. @ManfredSteyer

  28. @ManfredSteyer

  29. @ManfredSteyer SPA + SSR Classic SPA Complexity Complexity Monolith MF

    Frankenstein Biz Apps B2C Team Autonomy →

  30. @ManfredSteyer Free eBook (6th Edition) ANGULARarchitects.io/book 20 Chapters

  31. @ManfredSteyer Module Federation: Mental Model rocks! Native Federation Deferred Loading

    SSR with HTML Fragments

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

    http://angulararchitects.io