Save 37% off PRO during our Black Friday Sale! »

Enterprise Angular: Frontend Moduliths with Nx @iJS München 2021

Enterprise Angular: Frontend Moduliths with Nx @iJS München 2021

15934fa2aa7b2ce21f091e9b7cffa856?s=128

Manfred Steyer
PRO

November 11, 2021
Tweet

Transcript

  1. @ManfredSteyer ManfredSteyer Manfred Steyer, ANGULARarchitects.io Enterprise Angular: Frontend Moduliths with

    Nx
  2. @ManfredSteyer

  3. @ManfredSteyer

  4. @ManfredSteyer Booking App Booking App Check-in App Check-in App Boarding

    App Boarding App Luggage App Luggage App
  5. @ManfredSteyer

  6. @ManfredSteyer

  7. @ManfredSteyer

  8. @ManfredSteyer

  9. @ManfredSteyer

  10. @ManfredSteyer Manfred Steyer

  11. @ManfredSteyer

  12. @ManfredSteyer Booking App Booking App Check-in App Check-in App Boarding

    App Boarding App Luggage App Luggage App
  13. @ManfredSteyer Shared Shared Booking Booking Boarding Boarding Repository n Repository

    2 Repository 1 Strict Borders
  14. @ManfredSteyer Shared Shared Booking Booking Boarding Boarding Repository n Repository

    2 Repository 1 Strict Borders
  15. @ManfredSteyer

  16. @ManfredSteyer Shared Shared Booking Booking Boarding Boarding Published via npm:

    Pain! SPA: Download to the Client Version Mismatches?
  17. @ManfredSteyer

  18. @ManfredSteyer Monorepo Structure

  19. @ManfredSteyer Everyone uses the latest versions No version conflicts Sharing

    Libs: Easy
  20. @ManfredSteyer Npm Registry

  21. @ManfredSteyer https://nrwl.io/nx

  22. @ManfredSteyer Visualize Module Structure

  23. @ManfredSteyer

  24. @ManfredSteyer

  25. @ManfredSteyer

  26. @ManfredSteyer "booking": { "tags": ["domain:booking", "type:app"] }, "booking-feature-search": { "tags":

    ["domain:booking", "type:feature"] },
  27. @ManfredSteyer "booking": { "tags": ["domain:booking", "type:app"] }, "booking-feature-search": { "tags":

    ["domain:booking", "type:feature"] },
  28. @ManfredSteyer { "sourceTag": "domain:booking", "onlyDependOnLibsWithTags": ["domain:booking", "domain:shared"] }

  29. @ManfredSteyer DEMO

  30. @ManfredSteyer

  31. @ManfredSteyer

  32. @ManfredSteyer

  33. @ManfredSteyer DEMO

  34. @ManfredSteyer

  35. @ManfredSteyer

  36. @ManfredSteyer Booking Booking Boarding Boarding Shared Shared Feature Feature Feature

    Feature Feature Feature Feature Feature Feature Feature UI UI UI UI UI UI UI UI UI UI UI UI UI UI UI UI UI UI Domain Domain Domain Domain Domain Domain Domain Domain Domain Domain Domain Domain Util Util Util Util Util Util Util Util Util Util Util Util @ManfredSteyer Smart Comp. Dumb Comp.
  37. @ManfredSteyer Automate

  38. @ManfredSteyer Usage

  39. @ManfredSteyer DEMO

  40. @ManfredSteyer

  41. @ManfredSteyer Shared Shared Booking Booking Boarding Boarding Access Restrictions Separate

    Apps/ Separate Deployment
  42. @ManfredSteyer Deploy all changed apps in release branch together!

  43. @ManfredSteyer µFrontend SPA µFrontend SPA µFrontend SPA

  44. @ManfredSteyer µService µFrontend µFrontend µFrontend Shell Webpack Module Federation

  45. @ManfredSteyer More on this …

  46. @ManfredSteyer Free eBook ANGULARarchitects.io/book

  47. @ManfredSteyer • • • • •

  48. @ManfredSteyer

  49. @ManfredSteyer d Slides & Examples Remote and In-House http://softwarearchitekt.at/workshops