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

Micro Frontends with Modern Angular

Manfred Steyer
PRO
October 18, 2023
0
150

Micro Frontends with Modern Angular

Manfred Steyer
PRO

October 18, 2023
Tweet

More Decks by Manfred Steyer

See All by Manfred Steyer
The Price of Micro Frontends … and Your Alternatives @bastacon 2025 in Frankfurt
manfredsteyer
PRO
0
60
Your Architecture as a Crime Scene: Forensic Analysis @bastacon 2025 in Frankfurt
manfredsteyer
PRO
0
99
Modern Angular with Signals and Signal Store New Rules for Your Architecture @bastacon 2025 in Frankfurt
manfredsteyer
PRO
0
79
Effective Signals in Angular 19+: Rules and Helpers
manfredsteyer
PRO
0
840
Effective Signals in Angular 19+: Rules and Helpers @ngbe2024
manfredsteyer
PRO
0
480
Your Architecture as a Crime Scene: Improvements with Forensic Analysis
manfredsteyer
PRO
0
26
Micro Frontends Unmasked Opportunities, Challenges, Alternatives
manfredsteyer
PRO
0
440
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
280
Your Architecture as a Crime Scene: Improvements with Forensic Analysis @ijs Munich 2024
manfredsteyer
PRO
0
390

Featured

See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1.1k
A better future with KSS
kneath
238
17k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.2k
Facilitating Awesome Meetings
lara
53
6.3k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
11
1.3k
Adopting Sorbet at Scale
ufuk
75
9.2k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
How to Think Like a Performance Engineer
csswizardry
22
1.4k
Become a Pro
speakerdeck
PRO
26
5.2k
GitHub's CSS Performance
jonrohan
1030
460k

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