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
Effective Signals in Angular 19+: Rules and Helpers
manfredsteyer
PRO
0
340
Effective Signals in Angular 19+: Rules and Helpers @ngbe2024
manfredsteyer
PRO
0
230
Your Architecture as a Crime Scene: Improvements with Forensic Analysis
manfredsteyer
PRO
0
17
Micro Frontends Unmasked Opportunities, Challenges, Alternatives
manfredsteyer
PRO
0
320
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
210
Your Architecture as a Crime Scene: Improvements with Forensic Analysis @ijs Munich 2024
manfredsteyer
PRO
0
220
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
140
Micro Frontends Unmasked: Opportunities, Challenges, Alternatives @w-jax 2024 München
manfredsteyer
PRO
0
140
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
1
150

Featured

See All Featured
Code Reviewing Like a Champion
maltzj
521
39k
A better future with KSS
kneath
238
17k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
3
340
Designing on Purpose - Digital PM Summit 2013
jponch
116
7k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
940
Designing Dashboards & Data Visualisations in Web Apps
destraynor
230
52k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Agile that works and the tools we love
rasmusluckow
328
21k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
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