Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Maintainable Architectures with Angular, Monorepos and Strategic Design @GDG Reading
Search
Manfred Steyer
PRO
May 22, 2019
Programming
2
46
Maintainable Architectures with Angular, Monorepos and Strategic Design @GDG Reading
Manfred Steyer
PRO
May 22, 2019
Tweet
Share
More Decks by Manfred Steyer
See All by Manfred Steyer
Migrating to Signals: A Practical Workshop
manfredsteyer
PRO
0
290
Micro Frontends with Web Standards
manfredsteyer
PRO
0
220
The New NGRX Signal Store for Angular: 3+n Flavors
manfredsteyer
PRO
1
190
Leveraging the new NGRX Signal Store
manfredsteyer
PRO
0
150
Modern State Management in Angular: The 3+n Flavors of the NGRX Signal Store
manfredsteyer
PRO
0
95
NGRX Signal Store
manfredsteyer
PRO
0
200
signals-arc.pdf
manfredsteyer
PRO
0
220
Camel and Eye of a Needle: Integration of SPA-based Micro Frontends
manfredsteyer
PRO
0
91
Micro Frontends with Modern Angular
manfredsteyer
PRO
1
480
Other Decks in Programming
See All in Programming
Building a Smaller App Binary
kateinoigakukun
2
220
両面どころかインフラもTSでできるよ ~ 全方位TypeScriptによるプロダクト開発 ~
myfinder
9
2.5k
導入から5年が経って見えた Datadog APM 運用の課題
bgpat
2
540
Prepare for Jakarta EE 11 - Performance and Developer Productivity
ivargrimstad
0
530
コミュニティに参加したことで起きた変化
ohmori_yusuke
3
130
【KMC春合宿2024】実装視点で見るNeural Radiance Fields
runningoutrate
0
150
Honoとhtmx
yusukebe
6
1.2k
AppDeveloperCon 2024 EU: Building polyglot developer experiences in 2024
salaboy
0
380
Swiftの型推論を学ぼう | Let's Learn About Type Inference in Swift
omochi
2
770
もうすぐ新年度、Babylon.jsがお勧めな3個の理由
hideg
0
170
IntelliJ IDEA を知らなかった 自分に教えたい小ネタ集 / IntelliJ IDEA Hints for My Past Self
mackey0225
3
180
Go1.22からの疑似乱数生成器について/go-122-pseudo-random-generator
convto
1
160
Featured
See All Featured
The Brand Is Dead. Long Live the Brand.
mthomps
48
22k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
226
16k
Fashionably flexible responsive web design (full day workshop)
malarkey
397
65k
Building a Scalable Design System with Sketch
lauravandoore
455
32k
Imperfection Machines: The Place of Print at Facebook
scottboms
257
12k
Build your cross-platform service in a week with App Engine
jlugia
223
17k
The Language of Interfaces
destraynor
150
23k
Thoughts on Productivity
jonyablonski
57
3.8k
Building Better People: How to give real-time feedback that sticks.
wjessup
350
18k
Principles of Awesome APIs and How to Build Them.
keavy
119
16k
Building Effective Engineering Teams - LeadDev
addyosmani
25
1.8k
A designer walks into a library…
pauljervisheath
199
23k
Transcript
@ManfredSteyer Maintainable Architectures with Angular, Monorepos and Strategic Design Manfred
Steyer SOFTWAREarchitekt.at ManfredSteyer
@ManfredSteyer What do we need for a good architecture ?
Experience
@ManfredSteyer Sharing Experience for Architectures BEST PRACTICES PATTERNS METHODOLOGY
@ManfredSteyer Domain Driven Design
@ManfredSteyer How can we improve our frontend architectures with ideas
from DDD?
@ManfredSteyer How can we improve our frontend architectures with ideas
from DDD?
@ManfredSteyer Contents 1) Strategic Design 101 2) Angular Monorepos 3)
Nx Monorepos and DDD 4) DEMO
@ManfredSteyer About me… • Manfred Steyer SOFTWAREarchitekt.at • Angular Trainings
and Consultancy • Google Developer Expert (GDE) • Trusted Collaborator in the Angular Team Page ▪ 9 Manfred Steyer Public: Frankfurt, Vienna, Munich, Düsseldorf, Stuttgart In-House: everywhere http://softwarearchitekt.at/workshops
@ManfredSteyer Strategic Design in a nutshell
@ManfredSteyer Domain Driven Design Strategic Design Tactical Design Decomposing a
System Design Patterns & Practices
@ManfredSteyer Domain Driven Design Strategic Design Tactical Design Decomposing a
System Design Patterns & Practices
@ManfredSteyer This is what Strategic DDD prevents
@ManfredSteyer Example e-Procurement System
@ManfredSteyer Catalog Approval Specification Ordering Example Sub-Domains
@ManfredSteyer Request Product Specify Order Approve Order Send Order Request
Budget Approve Budget Budget Hierarchy Manager Manager Employee Expert Manager Buying Agent Product
@ManfredSteyer Catalog Approval Bounded Cotext Ubiquitous Language
@ManfredSteyer Catalog Approval Specification Ordering Context Map
@ManfredSteyer Approval Specification Context Map Catalog Catalog Shared Kernel
@ManfredSteyer Catalog Approval API
@ManfredSteyer Lots of additional approaches for cross-domain communication …
@ManfredSteyer 2) Monorepos
@ManfredSteyer Workspace
@ManfredSteyer Creating a Workspace npm install -g @angular/cli ng new
workspace cd workspace ng generate app my-app ng generate lib my-lib ng serve --project my-app ng build --project my-app
@ManfredSteyer Advantages Everyone uses the latest versions No version conflicts
No burden with distributing libs Creating new libs: Adding folder Experience: Successfully used at Google, Facebook, …
@ManfredSteyer Moving back and forth Npm Registry
@ManfredSteyer Tooling & Generator https://nrwl.io/nx
@ManfredSteyer Visualize Module Structure
@ManfredSteyer Nx Monorepos and Strategic Design
@ManfredSteyer Catalog Ordering Shared Feature Feature Feature Feature Feature UI
UI UI UI UI UI UI UI UI Domain Domain Domain Domain Domain Domain Util Util Util Util Util Util Enterprise Monorepo Patterns, Nrwl 2018: https://tinyurl.com/y2jjxld7 @ManfredSteyer Shared Kernel (if really needed) & other libs
@ManfredSteyer Catalog Ordering Shared Feature API Feature Feature Feature Feature
UI UI UI UI UI UI UI UI UI Domain Domain Domain Domain Domain Domain Util Util Util Util Util Util @ManfredSteyer
@ManfredSteyer Application Domain Infrastructure Isolate your domain! Domain Domain Infrastructure
e. g. data access Application Use case specific facades
@ManfredSteyer Alternatives to layering • e. g. Hexagonal Architecture, Clean
Architecture • Anyway: We need to restrict access b/w libraries
@ManfredSteyer DEMO
@ManfredSteyer Micro Apps? Short outlook
@ManfredSteyer Catalog Ordering Shared Feature Feature Feature Feature Feature …
… … … … … … … … @ManfredSteyer Catalog App Ordering App Option 1: One App per Domain
@ManfredSteyer Catalog Ordering Shared Feature Feature Feature Feature Feature …
… … … … … … … … @ManfredSteyer Catalog App Ordering App Option 2: One Monorepo per Domain Publish shared libs seperately via npm
@ManfredSteyer Summary Slicing into sub-domains Slicing into layers Non-strict layering
Finegrained libraries Enforce restrictions
@ManfredSteyer
@ManfredSteyer Contact and Downloads [mail]
[email protected]
[web] SOFTWAREarchitekt.at [twitter] ManfredSteyer
d Slides & Examples Public: Frankfurt, Vienna, Munich, Düsseldorf, Stuttgart In-House: everywhere http://softwarearchitekt.at/workshops