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
All About Angular‘s New Signal Forms
Avatar for Manfred Steyer manfredsteyer
PRO
0
17
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
Your Architecture as a Crime Scene? Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
160
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
240
Your Architecture as a Crime Scene: Forensic Analysis
Avatar for Manfred Steyer manfredsteyer
PRO
0
110
Reactive Thinking with Signals and the new Resource API
Avatar for Manfred Steyer manfredsteyer
PRO
0
230
Rethinking Angular: The Future with Signal Store and the New Resource API @w-jax 2025, Munich
Avatar for Manfred Steyer manfredsteyer
PRO
0
98
Premier Disciplin for Micro Frontends Multi Version/ Framework Scenarios
Avatar for Manfred Steyer manfredsteyer
PRO
0
150
The Missing Link in Angular's Signal Story: Resource API and httpResource
Avatar for Manfred Steyer manfredsteyer
PRO
0
180

Other Decks in Programming

See All in Programming
AIの誤りが許されない業務システムにおいて“信頼されるAI” を目指す / building-trusted-ai-systems
Avatar for Yuya Matsumura yuya4
7
4.3k
Grafana：建立系統全知視角的捷徑
Avatar for Blueswen blueswen
0
280
インターン生でもAuth0で 認証基盤刷新が出来るのか
Avatar for takumi taku271
0
150
Navigation 3: 적응형 UI를 위한 앱 탐색
Avatar for Sungyong An fornewid
1
540
Go コードベースの構成と AI コンテキスト定義
Avatar for ANDPAD inc andpad
0
160
ゆくKotlin くるRust
Avatar for TATSUNO Yasuhiro exoego
1
200
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
Avatar for MomokoShirakawa momok47
0
170
チームをチームにするEM
Avatar for hitode909 hitode909
0
450
The Art of Re-Architecture - Droidcon India 2025
Avatar for Sid Patil siddroid
0
160
Kotlin Multiplatform Meetup - Compose Multiplatform 외부 의존성 아키텍처 설계부터 운영까지
Avatar for Suhyeon Kim wisemuji
0
170
LLM Çağında Backend Olmak: 10 Milyon Prompt'u Milisaniyede Sorgulamak
Avatar for Selçuk Usta selcukusta
0
150
フルサイクルエンジニアリングをAI Agentで全自動化したい 〜構想と現在地〜
Avatar for Kaito Minatoya kamina_zzz
0
360

Featured

See All Featured
Prompt Engineering for Job Search
Avatar for Mfonobong Umondia mfonobong
0
140
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon szymonslowik
1
880
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.5k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
27k
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.1k
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
97
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
2
160
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.8k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
3.3k
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
550
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.9k
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
2
290

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