Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

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
Your Architecture as a Crime Scene: Improvements with Forensic Analysis
manfredsteyer
PRO
0
6
Micro Frontends Unmasked Opportunities, Challenges, Alternatives
manfredsteyer
PRO
0
160
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
150
Your Architecture as a Crime Scene: Improvements with Forensic Analysis @ijs Munich 2024
manfredsteyer
PRO
0
72
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
110
Micro Frontends Unmasked: Opportunities, Challenges, Alternatives @w-jax 2024 München
manfredsteyer
PRO
0
100
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
1
110
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
65
Modern Angular: Renovation for Your Applications
manfredsteyer
PRO
0
260

Other Decks in Programming

See All in Programming
「今のプロジェクトいろいろ大変なんですよ、app/services とかもあって……」/After Kaigi on Rails 2024 LT Night
junk0612
5
2.2k
WebAssembly Unleashed: Powering Server-Side Applications
chrisft25
0
1.8k
Develop iOS apps with Neovim / vimconf_2024
uhooi
1
120
Ethereum_.pdf
nekomatu
0
480
TypeScript Graph でコードレビューの心理的障壁を乗り越える
ysk8hori
3
1.3k
距離関数を極める！ / SESSIONS 2024
gam0022
0
330
デザインパターンで理解するLLMエージェントの作り方 / How to develop an LLM agent using agentic design patterns
rkaga
11
2k
ローコードSaaSのUXを向上させるためのTypeScript
taro28
1
700
.NET Conf 2024の振り返り
tomokusaba
0
120
EMになってからチームの成果を最大化するために取り組んだこと/ Maximize team performance as EM
nashiusagi
0
110
チームにとって最適なスキルアップ施策とは何か/what-is-the-best-skill-up-approach-for-team
nobuoooo
0
140
ふかぼれ！CSSセレクターモジュール / Fukabore! CSS Selectors Module
petamoriken
0
160

Featured

See All Featured
How to Think Like a Performance Engineer
csswizardry
20
1.1k
Git: the NoSQL Database
bkeepers
PRO
427
64k
How to Ace a Technical Interview
jacobian
276
23k
The Cost Of JavaScript in 2023
addyosmani
45
6.8k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
860
Imperfection Machines: The Place of Print at Facebook
scottboms
265
13k
Documentation Writing (for coders)
carmenintech
65
4.4k
Navigating Team Friction
lara
183
14k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
4
390
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
Happy Clients
brianwarren
98
6.7k
Optimizing for Happiness
mojombo
376
70k

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