Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

Native Federation: The Future of Micro Frontend...

Manfred Steyer
PRO
July 18, 2024
Programming
0
380

Native Federation: The Future of Micro Frontends in Angular

Manfred Steyer
PRO

July 18, 2024
Tweet

More Decks by Manfred Steyer

See All by Manfred Steyer
Effective Signals in Angular 19+: Rules and Helpers @ngbe2024
manfredsteyer
PRO
0
40
Your Architecture as a Crime Scene: Improvements with Forensic Analysis
manfredsteyer
PRO
0
12
Micro Frontends Unmasked Opportunities, Challenges, Alternatives
manfredsteyer
PRO
0
220
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
170
Your Architecture as a Crime Scene: Improvements with Forensic Analysis @ijs Munich 2024
manfredsteyer
PRO
0
120
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
120
Micro Frontends Unmasked: Opportunities, Challenges, Alternatives @w-jax 2024 München
manfredsteyer
PRO
0
110
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
1
130
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
72

Other Decks in Programming

See All in Programming
Java 23の概要とJava Web Frameworkの現状 / Java 23 and Java web framework
kishida
2
380
急成長期の品質とスピードを両立するフロントエンド技術基盤
soarteclab
0
610
React + Tauriでデスクトップアプリ開発に入門してみた
ynishimura0922
0
140
競技プログラミングで 基礎体力を身につけよう / You can get basic skills through competitive programming
mdstoy
0
150
コンテンツの主権を守るため（？）、高機能画像CDNからAWS自前対応に乗り換えた話
lengthtail
1
110
プロダクトの品質に コミットする / Commit to Product Quality
pekepek
1
610
Cursorでアプリケーションの追加開発や保守をどこまでできるか試したら得るものが多かった話
drumnistnakano
0
280
CSC305 Lecture 23
javiergs
PRO
0
120
たのしいparse.y
ydah
3
110
Leveling Up Developer Tooling for the Modern Rails & Hotwire Era @ Ruby Türkiye, November 2024
marcoroth
0
160
テスト自動化失敗から再挑戦しチームにオーナーシップを委譲した話/STAC2024 macho
ma_cho29
1
490
あれやってみてー駆動から成長を加速させる / areyattemite-driven
nashiusagi
1
140

Featured

See All Featured
Writing Fast Ruby
sferik
627
61k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
Building Adaptive Systems
keathley
38
2.3k
Code Review Best Practice
trishagee
64
17k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
890
Speed Design
sergeychernyshev
25
650
Practical Orchestrator
shlominoach
186
10k
Documentation Writing (for coders)
carmenintech
65
4.5k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
169
50k
Faster Mobile Websites
deanohume
305
30k
Designing for Performance
lara
604
68k

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