$30 off During Our Annual Pro Sale. View Details »

Native Federation: The Future of Micro Frontend...

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

Native Federation: The Future of Micro Frontends in Angular

Avatar for Manfred Steyer

Manfred Steyer PRO

July 18, 2024
Tweet

More Decks by Manfred Steyer

See All by Manfred Steyer
All About Angular‘s New Signal Forms
Avatar for Manfred Steyer manfredsteyer
PRO
0
10
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
170
Your Architecture as a Crime Scene? Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
130
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
230
Your Architecture as a Crime Scene: Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
94
Reactive Thinking with Signals and the new Resource API
Avatar for Manfred Steyer manfredsteyer
PRO
0
210
Rethinking Angular: The Future with Signal Store and the New Resource API @w-jax 2025, Munich
Avatar for Manfred Steyer manfredsteyer
PRO
0
89
Premier Disciplin for Micro Frontends Multi Version/ Framework Scenarios
Avatar for Manfred Steyer manfredsteyer
PRO
0
140
The Missing Link in Angular's Signal Story: Resource API and httpResource
Avatar for Manfred Steyer manfredsteyer
PRO
0
170

Other Decks in Programming

See All in Programming
ゲームの物理 剛体編
Avatar for Fadis fadis
0
370
メルカリのリーダビリティチームが取り組む、AI時代のスケーラブルな品質文化
Avatar for osari.k cloverrose
2
360
バックエンドエンジニアによる Amebaブログ K8s 基盤への CronJobの導入・運用経験
Avatar for suna-big sunabig
0
170
AIコーディングエージェント（Gemini）
Avatar for kondai kondai24
0
270
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
Avatar for HideyukiKitao panda728
PRO
39
26k
フルサイクルエンジニアリングをAI Agentで全自動化したい 〜構想と現在地〜
Avatar for Kaito Minatoya kamina_zzz
0
280
從冷知識到漏洞，你不懂的 Web，駭客懂 - Huli @ WebConf Taiwan 2025
Avatar for Huli aszx87410
2
3k
AI前提で考えるiOSアプリのモダナイズ設計
Avatar for 野瀬田　裕樹 yuukiw00w
0
190
Navigation 3: 적응형 UI를 위한 앱 탐색
Avatar for Sungyong An fornewid
1
440
エディターってAIで操作できるんだぜ
Avatar for kis9a kis9a
0
750
クラウドに依存しないS3を使った開発術
Avatar for しめさば simesaba80
0
160
Cell-Based Architecture
Avatar for Luram Archanjo larchanjo
0
140

Featured

See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
330
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
0
250
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
710
Neural Spatial Audio Processing for Sound Field Analysis and Control
Avatar for NII S. Koyama's Lab skoyamalab
0
130
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
21
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
400
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
170
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
0
4.6k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
Avatar for Akash Hashmi akashhashmi
0
190
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.3k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
4.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