Skip to content

Commit 09c255c

Browse files
committed
docs(general): add readme
1 parent 46f1b7e commit 09c255c

File tree

5 files changed

+87
-78
lines changed

5 files changed

+87
-78
lines changed

.vscode/settings.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"spellright.language": [
3+
"en"
4+
],
5+
"spellright.documentTypes": [
6+
"markdown",
7+
"latex",
8+
"plaintext"
9+
]
10+
}

README.md

Lines changed: 2 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -1,76 +1,3 @@
1-
# AngularArchitects
1+
# @angular-architects/ddd -- DDD Plugin for Nx
22

3-
This project was generated using [Nx](https://nx.dev).
4-
5-
<p align="center"><img src="https://raw.githubusercontent.com/nrwl/nx/master/nx-logo.png" width="450"></p>
6-
7-
🔎 **Nx is a set of Extensible Dev Tools for Monorepos.**
8-
9-
## Adding capabilities to your workspace
10-
11-
Nx supports many plugins which add capabilities for developing different types of applications and different tools.
12-
13-
These capabilities include generating applications, libraries, etc as well as the devtools to test, and build projects as well.
14-
15-
Below are some plugins which you can add to your workspace:
16-
17-
- [React](https://reactjs.org)
18-
- `npm install --save-dev @nrwl/react`
19-
- Web (no framework frontends)
20-
- `npm install --save-dev @nrwl/web`
21-
- [Angular](https://angular.io)
22-
- `npm install --save-dev @nrwl/angular`
23-
- [Nest](https://nestjs.com)
24-
- `npm install --save-dev @nrwl/nest`
25-
- [Express](https://expressjs.com)
26-
- `npm install --save-dev @nrwl/express`
27-
- [Node](https://nodejs.org)
28-
- `npm install --save-dev @nrwl/node`
29-
30-
## Generate an application
31-
32-
Run `nx g @nrwl/react:app my-app` to generate an application.
33-
34-
> You can use any of the plugins above to generate applications as well.
35-
36-
When using Nx, you can create multiple applications and libraries in the same workspace.
37-
38-
## Generate a library
39-
40-
Run `nx g @nrwl/react:lib my-lib` to generate a library.
41-
42-
> You can also use any of the plugins above to generate libraries as well.
43-
44-
Libraries are sharable across libraries and applications. They can be imported from `@angular-architects/mylib`.
45-
46-
## Development server
47-
48-
Run `nx serve my-app` for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
49-
50-
## Code scaffolding
51-
52-
Run `nx g @nrwl/react:component my-component --project=my-app` to generate a new component.
53-
54-
## Build
55-
56-
Run `nx build my-app` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
57-
58-
## Running unit tests
59-
60-
Run `nx test my-app` to execute the unit tests via [Jest](https://jestjs.io).
61-
62-
Run `nx affected:test` to execute the unit tests affected by a change.
63-
64-
## Running end-to-end tests
65-
66-
Run `ng e2e my-app` to execute the end-to-end tests via [Cypress](https://www.cypress.io).
67-
68-
Run `nx affected:e2e` to execute the end-to-end tests affected by a change.
69-
70-
## Understand your workspace
71-
72-
Run `nx dep-graph` to see a diagram of the dependencies of your projects.
73-
74-
## Further help
75-
76-
Visit the [Nx Documentation](https://nx.dev) to learn more.
3+
see [libs/ddd/readme.md](libs/ddd/README.md)

libs/ddd/README.md

Lines changed: 74 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,30 @@
11
# @angular-architects/ddd -- DDD Plugin for Nx
22

3+
This plugin installs some schematics which automate slicing your Nx workspace into domains and layers according to Nrwl's best practices and our ideas about [client-side DDD with Angular](https://www.softwarearchitekt.at/aktuelles/sustainable-angular-architectures-1/):
4+
5+
![domains and layers](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/ddd.png?raw=true)
6+
7+
The generated access restrictions prevent unwanted access between libraries respecting layers and domains:
8+
9+
![access restrictions](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/linting-2.png?raw=true)
10+
11+
## Features
12+
13+
- 🗺️ Generating domains with domain libraries including a facades, models, and data services
14+
- ⚙️ Generating feature libraries including a feature components using the facades
15+
- 🙅‍♂️ Adding linting rules for access restrictions between domains as proposed by Nrwl
16+
- 🙅‍♀️ Adding linting rules for access restrictions between layers as proposed by Nrwl
17+
18+
## Usage
19+
20+
Add this plugin to an Nx workspace:
21+
322
```
4-
npm i
23+
ng add @angular-architects/ddd
524
```
625

26+
Add domains and features:
27+
728
```
829
ng g @angular-architects/ddd:domain booking
930
ng g @angular-architects/ddd:domain boarding
@@ -12,6 +33,57 @@ ng g @angular-architects/ddd:feature cancel --domain booking --app flight-app
1233
ng g @angular-architects/ddd:feature manage --domain boarding --app flight-app
1334
```
1435

36+
This example assumes that you have an app ``flight-app`` in place.
37+
38+
These schematics also wire up the individual libs. To see the result, create a dependency graph:
39+
1540
```
1641
npm run dep-graph
17-
```
42+
```
43+
44+
![dependency graph](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/ddd.png?raw=true)
45+
46+
To see that the skeleton works end-to-end, call the generated feature component in your ``app.component.html``:
47+
48+
```html
49+
<booking-search></booking-search>
50+
```
51+
52+
You don't need any TypeScript or Angular imports. The plugin already took care about that. After running the example, you should see something like this:
53+
54+
![Result proving that the generated skeleton works end-to-end](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/result.png?raw=true)
55+
56+
## Generated Structure
57+
58+
The included schematics generate a folder for each domain. This folder contains feature libs as well as a library with the domain logic:
59+
60+
![Folder per Domain](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/ddd-libs.png?raw=true)
61+
62+
The domain layer is subdivided into three parts:
63+
64+
![Structured Domain Layer](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/domain-layer.png?raw=true)
65+
66+
### Generated Structure for Domain Library
67+
68+
- **application:** Contains application services. This is a DDD term for what we call facades in Angular nowadays. They orchestrate everything for a use case given so that a feature component only needs to communicate with one such facade. Also, it hides details for state management. While the generates facades just use a ``BehaviorSubject``, feel free to add a library like NGRX underneath. As such a modifications changes nothing from the component's perspective, you can use facades to introduce NGRX later on demand.
69+
- **entities:** Client-side data model including logic operating on it (like validations).
70+
- **infrastructure:** Services for communicating with the backend.
71+
72+
## Consider Automatically Checking Access Restrictions
73+
74+
As the access restrictions defined with Nx use linting, you can check against them at the command line too. Hence, you might consider including this into your automated build process.
75+
76+
![Access restrictions via linting](https://github.com/angular-architects/nx-ddd-plugin/blob/master/libs/ddd/assets/linting-3.png?raw=true)
77+
78+
## Example Application
79+
80+
see https://github.com/angular-architects/ddd-demo
81+
82+
## Credits
83+
84+
- [Nx](https://nx.dev/web)
85+
- [Nrwl's eBook about monorepos and best practices](https://go.nrwl.io/angular-enterprise-monorepo-patterns-new-book)
86+
- [Recording of session about this architecture](https://www.youtube.com/watch?v=94HFD391zkE&t=1s)
87+
- [Article series about DDD with Angular](https://www.softwarearchitekt.at/aktuelles/sustainable-angular-architectures-1/)
88+
- [Our eBook about this architecture](https://leanpub.com/enterprise-angular)
89+
- [Thomas Burlison's article about facades in Angular](https://medium.com/@thomasburlesonIA/push-based-architectures-with-rxjs-81b327d7c32d)

libs/ddd/assets/ddd.png

-142 KB
Loading

libs/ddd/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@angular-architects/ddd",
3-
"version": "1.0.0",
3+
"version": "1.0.1",
44
"author": "Manfred Steyer",
55
"description": "Nx plugin for structuring a monorepo with domains and layers",
66
"repository": {

0 commit comments

Comments
 (0)