Skip to content

Commit 96b67bd

Browse files
committed
docs(nx): misc docs changes
1 parent 35498d1 commit 96b67bd

File tree

10 files changed

+90
-68
lines changed

10 files changed

+90
-68
lines changed

docs/fundamentals/full-stack-development.md renamed to docs/fundamentals/build-full-stack-applications.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Building Full-Stack Applications using Angular and Nest
1+
# Building Full-Stack Applications
22

33
In this guide you will build a full-stack application using Angular and Nest.
44

@@ -151,7 +151,7 @@ export interface Ticket {
151151

152152
@Injectable()
153153
export class AppService {
154-
getTodos(): Ticket[] {
154+
getTickets(): Ticket[] {
155155
return [
156156
{ id: 1, title: 'Fix my computer!' },
157157
{ id: 2, title: 'Fix my desk' }
@@ -171,8 +171,8 @@ export class AppController {
171171
constructor(private readonly appService: AppService) {}
172172

173173
@Get('tickets')
174-
getTodos(): Ticket[] {
175-
return this.appService.getTodos();
174+
getTickets(): Ticket[] {
175+
return this.appService.getTickets();
176176
}
177177
}
178178
```
@@ -253,7 +253,7 @@ import { Ticket } from '@tuskorg/data';
253253

254254
@Injectable()
255255
export class AppService {
256-
getTodos(): Ticket[] {
256+
getTickets(): Ticket[] {
257257
return [
258258
{ id: 1, title: 'Fix my computer!' },
259259
{ id: 2, title: 'Fix my desk' }
@@ -262,7 +262,7 @@ export class AppService {
262262
}
263263
```
264264

265-
After this refactoring, the backend and the frontend will not get out of sync. Being able to factor code into a lot of small libraries with well-defined public API, which you can then use across both the backend and the frontend, is one of key features of Nx. You can read more about it [here](./building-like-google.md).
265+
After this refactoring, the backend and the frontend will not get out of sync. Being able to factor code into a lot of small libraries with well-defined public API, which you can then use across both the backend and the frontend, is one of key features of Nx. You can read more about it [here](develop-like-google.md).
266266

267267
## Nx is Smart
268268

@@ -272,7 +272,7 @@ But Nx can do a lot more than that. In Nx, your libraries, node applications, An
272272

273273
![Full Stack Dependencies](./full-stack-deps.png)
274274

275-
If you change the data library, Nx will know that both the backend and the frontend can be affected by the change. This is what makes Nx a powerful full-stack development environment that scales. You can read more about this Nx capability in [Building Like Google](./building-like-google.md).
275+
If you change the data library, Nx will know that both the backend and the frontend can be affected by the change. This is what makes Nx a powerful full-stack development environment that scales. You can read more about this Nx capability in [Building Like Google](develop-like-google.md).
276276

277277
## Summary
278278

docs/fundamentals/building-like-google.md renamed to docs/fundamentals/develop-like-google.md

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Building like Google: Monorepos and Automation
1+
# Developing Like Google: Monorepos and Automation
22

33
In this guide you will look at one of the most interesting parts of Nx. The part that make so many things so much easier, that it has a transformative effect on a team and even on an organization.
44

@@ -251,11 +251,11 @@ You rarely have to look at `nx.json`, but it is still important to understand wh
251251
},
252252
"myapp": {
253253
"tags": ["shared"],
254-
"implicitDependencies": ["myapp-e2e"]
254+
"implicitDependencies": []
255255
},
256256
"myapp-e2e": {
257257
"tags": [],
258-
"implicitDependencies": []
258+
"implicitDependencies": ["myapp"]
259259
}
260260
}
261261
}
@@ -283,7 +283,11 @@ In this example, any change to `package.json` will only affect `mylib`.
283283
{
284284
"myapp": {
285285
"tags": ["shared"],
286-
"implicitDependencies": ["myapp-e2e"]
286+
"implicitDependencies": []
287+
},
288+
"myapp-e2e": {
289+
"tags": [],
290+
"implicitDependencies": ["myapp"]
287291
}
288292
}
289293
```

docs/fundamentals/modernizing-dev-workflow.md renamed to docs/fundamentals/use-modern-tools.md

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Modernizing Your Dev Workflow
1+
# Using Modern Tools
22

33
Using Nx, you can add Cypress, Jest, Prettier, and Nest into your dev workflow.
44

@@ -69,10 +69,6 @@ Adding a Nest app will also add Nest schematics to the workspace, which you can
6969
ng generate @nestjs/schematics:controller mycontroller --sourceRoot=apps/nestapp/src --path=app
7070
```
7171

72-
The best way to discover what schematics Nest provides is by using Angular Console:
73-
74-
SCREENSHOT
75-
7672
Read more about Nest at [nestjs.com](https://nestjs.com).
7773

7874
### Using Express

docs/getting-started/getting-started.md

Lines changed: 14 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,34 @@
11
# Getting Started
22

3-
<iframe src="https://player.vimeo.com/video/237418773" width="100%" height="360" frameborder="0" allowfullscreen></iframe>
3+
## Installing Angular CLI
44

5-
## Installing Nx
6-
7-
Nx is just a set of power-ups for Angular CLI, **so an Nx workspace is an Angular CLI workspace**. This means that it will be handy to have the Angular CLI installed globally, which can be done via npm or yarn as well.
5+
Nx is just a set Angular CLI power-ups, **so an Nx workspace is an Angular CLI workspace**. This means that it will be handy to have the Angular CLI installed globally, which can be done via npm or yarn.
86

97
```bash
108
npm install -g @angular/cli
119
```
1210

13-
or
11+
## Creating an Nx Workspace
1412

15-
```bash
16-
yarn global add @angular/cli
17-
```
13+
### Creating an Nx Workspace Using Npx
1814

19-
After you have installed the Angular CLI, install `@nrwl/schematics`.
15+
Using [Npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) you can create a new workspace without installing any packages.
16+
17+
Simply run:
2018

2119
```bash
22-
npm install -g @nrwl/schematics
20+
npx -p @nrwl/schematics create-nx-workspace myworkspace
2321
```
2422

25-
or
23+
### Creating an Nx Workspace Without Npx
24+
25+
Install `@nrwl/schematics`.
2626

2727
```bash
28-
yarn global add @nrwl/schematics
28+
npm install -g @nrwl/schematics
2929
```
3030

31-
## Nx Workspace
32-
33-
### Creating an Nx Workspace
34-
35-
To create an Nx workspace, run:
31+
Then run:
3632

3733
```bash
3834
ng new myworkspace --collection=@nrw/schematics
@@ -116,7 +112,7 @@ All the files that the CLI would have in a new project are still here, just in a
116112

117113
Run `ng serve myapp` to serve the newly generated application!
118114

119-
## Use Angular Console
115+
## Using Angular Console
120116

121117
You can also create a new Nx project using Angular Console--UI for the CLI:
122118

docs/getting-started/nx-and-cli.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ Now, add the right proxy configuration:
4444
}
4545
```
4646

47-
Finally, you can run `ng serve backend` and `ng serve frontend`. There is a lot more to full-stack development in Nx, which you can read about [here](../fundamentals/full-stack-development.md).
47+
Finally, you can run `ng serve backend` and `ng serve frontend`. There is a lot more to full-stack development in Nx, which you can read about [here](../fundamentals/build-full-stack-applications.md).
4848

4949
## Use effective development practices pioneered at Google
5050

@@ -125,7 +125,7 @@ This is a hard requirement for monorepo-style development. Nx implements it.
125125

126126
In addition to using the monorepo, Google is also know for its use of automation and tooling. Nx adds powerful capabilities helping your team promote best practices and ensure consistency.
127127

128-
Read more about how Nx helps you develop like Google [here](../fundamentals/building-like-google.md).
128+
Read more about how Nx helps you develop like Google [here](../fundamentals/develop-like-google.md).
129129

130130
## Use Innovative Tools
131131

@@ -149,7 +149,7 @@ ng test myapp
149149
ng e2e myapp
150150
```
151151

152-
Read more about using innovative tools [here](../fundamentals/modernizing-dev-workflow.md).
152+
Read more about using innovative tools [here](../fundamentals/use-modern-tools.md).
153153

154154
## Summary
155155

docs/getting-started/resources.md

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
# Resources
2+
3+
### Learn Nx in 30 Minutes
4+
5+
<iframe width="560" height="315" src="https://www.youtube.com/embed/XZpp52IqD2A" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
6+
7+
### Books and Blogs
8+
9+
- [Angular Enteprise Monorepo Patters](https://go.nrwl.io/angular-enterprise-monorepo-patterns-new-book?utm_campaign=Book%3A%20Monorepo%20Patterns%2C%20Jan%202019&utm_source=Github&utm_medium=Banner%20Ad)
10+
- [Nx blog posts](https://blog.nrwl.io/nx/home)
11+
12+
### Videos
13+
14+
- [Video course on using Nx Workspaces](https://angularplaybook.com/p/nx-workspaces)
15+
16+
### Talks
17+
18+
- [Angular at Large Organizations](https://www.youtube.com/watch?v=piQ0EZhtus0)
19+
- [Nx: The New Way to Build Enterprise Angular Apps](https://www.youtube.com/watch?v=xo-1SDmvM8Y)
20+
- [Supercharging the Angular CLI](https://www.youtube.com/watch?v=bMkKz8AedHc)
21+
- [Hands on Full Stack development with Nx and Bazel](https://www.youtube.com/watch?v=1KDDIhcQORM)
22+
- [Modern Development with Angular CLI & Nrwl Nx](https://www.youtube.com/watch?v=tE8sUAfKI3g)
23+
24+
### Podcasts and Shows
25+
26+
- [ngAir 140: Nx for Enterprise Angular Development](https://www.youtube.com/watch?v=qYNiOKDno_I)
27+
- [ngHouston: NX Demo](https://www.youtube.com/watch?v=E_UlU2Yv4G0)
28+
29+
## Misc
30+
31+
- [nx-examples](https://github.com/nrwl/nx-examples) repo has branches for different nx comments to display expected behavior and example app and libraries. Check out the branch (workspace, ngrx...) to see what gets created for you. More info on readme.
32+
- [xplat - Cross-platform tools for Nx workspaces](https://nstudio.io/xplat/)

docs/getting-started/what-is-nx.md

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
# Nx
22

3-
Nx is a set of Angular CLI power-ups that transform the CLI into a powerful tool for full-stack development.
3+
Angular CLI power-ups for modern development.
4+
5+
<iframe width="560" height="315" src="https://www.youtube.com/embed/XZpp52IqD2A" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
46

57
With Nx, you can:
68

7-
- Build full-stack applications using Angular and Nest
9+
- Use modern tools like Cypress and Jest
10+
- Build full-stack applications using Angular and Node.js
811
- Use effective development practices pioneered at Google
9-
- Use innovative tools like Cypress and Jest
1012

1113
## Getting Started
1214

@@ -15,15 +17,11 @@ With Nx, you can:
1517

1618
## Learn Nx
1719

18-
- [How to build full-stack applications using Angular and Nest?](../fundamentals/full-stack-development.md)
19-
- [How does Nx help you build like Google?](../fundamentals/building-like-google.md)
20-
- [How does Nx help you modernize your dev workflow?](../fundamentals/modernizing-dev-workflow.md)
21-
- [API docs](../api-schematics/application.md)
22-
23-
## Community
24-
20+
- [How Nx helps you use modern tools like Cypress, Jest, and Nest](../fundamentals/use-modern-tools.md)
21+
- [How Nx helps you build full-stack applications using Angular and Node.js](../fundamentals/build-full-stack-applications.md)
22+
- [How Nx helps you develop like Google](../fundamentals/develop-like-google.md)
2523
- [Books, talks, and blog posts about Nx](./resources)
2624

27-
## Contributing
25+
## Contribute
2826

2927
Looking to get started contributing to Nx? [Check the repository here](http://github.com/nrwl/nx).

docs/guides/monorepo-affected.md

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -141,19 +141,19 @@ Nx uses its advanced code analysis to construct a dependency graph of all applic
141141
"projects": {
142142
"client": {
143143
"tags": [],
144-
"implicitDependencies": ["client-e2e"]
144+
"implicitDependencies": []
145145
},
146146
"client-e2e": {
147147
"tags": [],
148-
"implicitDependencies": []
148+
"implicitDependencies": ["client"]
149149
},
150150
"admin": {
151151
"tags": [],
152-
"implicitDependencies": ["admin-e2e"]
152+
"implicitDependencies": []
153153
},
154154
"admin-e2e": {
155155
"tags": [],
156-
"implicitDependencies": []
156+
"implicitDependencies": ["admin"]
157157
},
158158
"client-feature-main": {
159159
"tags": [],
@@ -189,13 +189,9 @@ You can also specify dependencies between projects. For instance, if `admin-e2e`
189189

190190
```json
191191
{
192-
"client": {
193-
"tags": [],
194-
"implicitDependencies": ["client-e2e", "admin-e2e"]
195-
},
196-
"admin": {
192+
"admin-e2e": {
197193
"tags": [],
198-
"implicitDependencies": ["admin-e2e"]
194+
"implicitDependencies": ["client", "admin"]
199195
}
200196
}
201197
```

docs/guides/monorepo-tags.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,19 +23,19 @@ First, use `nx.json` to annotate your projects with tags. In this example, we wi
2323
"projects": {
2424
"client": {
2525
"tags": ["scope:client"],
26-
"implicitDependencies": ["client-e2e"]
26+
"implicitDependencies": []
2727
},
2828
"client-e2e": {
2929
"tags": ["scope:client"],
30-
"implicitDependencies": []
30+
"implicitDependencies": ["client"]
3131
},
3232
"admin": {
3333
"tags": ["scope:admin"],
34-
"implicitDependencies": ["admin-e2e"]
34+
"implicitDependencies": []
3535
},
3636
"admin-e2e": {
3737
"tags": ["scope:admin"],
38-
"implicitDependencies": []
38+
"implicitDependencies": ["admin"]
3939
},
4040
"client-feature-main": {
4141
"tags": ["scope:client"],

docs/map.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -22,16 +22,16 @@
2222
"id": "fundamentals",
2323
"itemList": [
2424
{
25-
"name": "Full Stack Development",
26-
"id": "full-stack-development"
25+
"name": "Building Full-Stack Applications",
26+
"id": "build-full-stack-applications"
2727
},
2828
{
29-
"name": "Building Like Google",
30-
"id": "building-like-google"
29+
"name": "Developing Like Google",
30+
"id": "develop-like-google"
3131
},
3232
{
33-
"name": "Modernizing Dev Workflow",
34-
"id": "modernizing-dev-workflow"
33+
"name": "Using Modern Tools",
34+
"id": "use-modern-tools"
3535
}
3636
]
3737
},

0 commit comments

Comments
 (0)