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

Sustainable Angular Architectures: Strategic De...

Avatar for Manfred Steyer Manfred Steyer
PRO
November 10, 2020
Programming
1
350

Sustainable Angular Architectures: Strategic Design with Nx Monorepos

Free eBook about this topic:
https://www.angulararchitects.io/book/
Avatar for Manfred Steyer

Manfred Steyer
PRO

November 10, 2020
Tweet

More Decks by Manfred Steyer

See All by Manfred Steyer
Reactive Thinking with Signals, Resource API, and httpResource @Devm.io Angular 20 Launch Party
Avatar for Manfred Steyer manfredsteyer
PRO
0
37
JavaScript as a Crime Scene Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
30
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @jax2025 in Mainz, Germany
Avatar for Manfred Steyer manfredsteyer
PRO
0
63
Premier Disciplin for Micro Frontends Multi Version/ Framework Scenarios
Avatar for Manfred Steyer manfredsteyer
PRO
0
37
Your Architecture as a Crime Scene Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
39
Live Coding: Migrating an Application to Signals
Avatar for Manfred Steyer manfredsteyer
PRO
0
110
The Missing Link in Angular’s Signal Story: Resource API and httpResource
Avatar for Manfred Steyer manfredsteyer
PRO
0
150
Strategic Design (DDD) for the Frontend @DDD Meetup Stuttgart
Avatar for Manfred Steyer manfredsteyer
PRO
0
200
Module Boundaries and Architecture with Forensic Analysis @NxSummit Amsterdam 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
120

Other Decks in Programming

See All in Programming
バイラテラルアップサンプリング
Avatar for Fadis fadis
3
620
はじめてのPDFKit.pdf
Avatar for shoma.kato shomakato
0
110
Designing Your Organization's Test Pyramid ( #scrumniigata )
Avatar for teyamagu teyamagu
PRO
5
1.7k
オープンソースコントリビュート入門
Avatar for katsuma _katsuma
0
150
fieldalignmentから見るGoの構造体
Avatar for kuro kuro_kurorrr
0
140
Cursor/Devin全社導入の理想と現実
Avatar for Ryoichi Saito saitoryc
29
22k
音声プラットフォームのアーキテクチャ変遷から学ぶ、クラウドネイティブなバッチ処理 (20250422_CNDS2025_Batch_Architecture)
Avatar for Koki Senda thousanda
0
440
実践Webフロントパフォーマンスチューニング
Avatar for しーぴー cp20
45
10k
VibeCoding時代のエンジニアリング
Avatar for どすこい daisuketakeda
0
260
Instrumentsを使用した アプリのパフォーマンス向上方法
Avatar for hinakko hinakko
0
250
インプロセスQAにおいて大事にしていること / In-process QA Meetup
Avatar for MEDLEY, INC. medley
0
190
2025年のz-index設計を考える
Avatar for TAK tak_dcxi
13
4.9k

Featured

See All Featured
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
220k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
29
940
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
91
6k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
273
40k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.3k
How GitHub (no longer) Works
Avatar for Zach Holman holman
314
140k
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
14
1.5k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
187
11k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
10
810
Fontdeck: Realign not Redesign
Avatar for Paul Robert Lloyd paulrobertlloyd
84
5.5k
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
349
20k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
24
2.7k

Transcript

  1. @ManfredSteyer ManfredSteyer Manfred Steyer, ANGULARarchitects.io Sustainable Angular Architectures: Strategic Design

    with Nx Monorepos

  2. @ManfredSteyer

  3. @ManfredSteyer

  4. @ManfredSteyer

  5. @ManfredSteyer Methodology for bridging the gap b/w requirements and architecture/

    design

  6. @ManfredSteyer Monolith? Flight System Flight System

  7. @ManfredSteyer Booking Booking Check-in Check-in Boarding Boarding Luggage Luggage Sub-Domains

  8. @ManfredSteyer

  9. @ManfredSteyer

  10. @ManfredSteyer Manfred Steyer

  11. @ManfredSteyer

  12. @ManfredSteyer Monorepo Structure

  13. @ManfredSteyer Advantages Everyone uses the latest versions No version conflicts

  14. @ManfredSteyer Two Flavors • Like Workspaces/Solutions in different IDEs Project

    Monorepo • E. g. used at Google or Facebook Company-wide Monorepo

  15. @ManfredSteyer Moving back and forth Npm Registry

  16. @ManfredSteyer Tooling & Generator https://nrwl.io/nx

  17. @ManfredSteyer Visualize Module Structure

  18. @ManfredSteyer Creating a Workspace with NX npm install -g @angular/cli

    npm init nx-workspace myworkspace cd workspace ng generate app my-app ng generate lib my-lib ng serve --project my-app ng build --project my-app

  19. @ManfredSteyer

  20. @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 Enterprise Monorepo Patterns, Nrwl 2018: https://tinyurl.com/y2jjxld7 @ManfredSteyer Smart Comp. Dumb Comp.

  21. @ManfredSteyer Booking Booking Boarding Boarding Shared Shared Feature Feature API

    API 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

  22. @ManfredSteyer Booking Booking Boarding Boarding Shared Shared Feature Feature API

    API 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

  23. @ManfredSteyer

  24. @ManfredSteyer • • •

  25. @ManfredSteyer

  26. @ManfredSteyer Distributed Cache 1) npm install @apployees-nx/level-task-runner -D 2) npm

    install mongodown -D 3) Configure @apployees-nx/level-task-runner in nx.json

  27. @ManfredSteyer

  28. @ManfredSteyer Works with Several Databases MongoDB Redis MySQL PostgreSQL …

  29. @ManfredSteyer Where‘s the Catch? Inofficial Solution Official Solution: Nx Cloud

    Nx Cloud: Far more possibilities

  30. @ManfredSteyer Free eBook https://ANGULARarchitects.io/book

  31. @ManfredSteyer

  32. • • •

  33. None

  34. @ManfredSteyer d Slides & Examples Public: Frankfurt, Munich, Vienna In-House:

    everywhere http://softwarearchitekt.at/workshops