You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: documentation/guides-grapql.asciidoc
+31-9Lines changed: 31 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -40,7 +40,7 @@ For example, on a regular API a get by id method would return something like:
40
40
----
41
41
But if we want to get *only* the wind data we have to create another endpoint that returns the specified data.
42
42
43
-
But instead with graphQL we can get different information without creating new endpoints, in this case we only want the wind data so:
43
+
But instead with graphQL we can get different information without creating new endpoints, in this case we only want the wind data so it would return:
44
44
45
45
[source, json]
46
46
----
@@ -67,10 +67,9 @@ This tutorial uses the schema first method.
67
67
68
68
We assume you have already a functioning TODO module / app.
69
69
70
-
If not you can use https://github.com/devonfw/devon4node/wiki/samples#devon4node-samples[Devon4node TODO sample]
70
+
If not you can use https://github.com/devonfw/devon4node/tree/develop/samples/graphql[Devon4node GraphQL sample]
71
71
====
72
72
73
-
74
73
First we need to import GraphQLModule to our `app.module.ts`.
75
74
76
75
[source,typescript]
@@ -100,8 +99,14 @@ The `definitions` indicates the file where the typescript definitions will autom
100
99
101
100
=== Schema
102
101
102
+
Graphql is a typed language with `object types`, `scalars`, and `enums`.
103
+
104
+
We use `querys` to define the methods we are going to use for fetching data, and `mutations` are used for modifying this data, similar to how `GET` and `POST` work.
105
+
103
106
Let's define the elements, querys and mutations that our module is going to have.
104
107
108
+
For that we have to create a graphql file on our module, on this case we are going to name it "schema.graphql".
109
+
105
110
[source,typescript]
106
111
----
107
112
type Todo {
@@ -120,11 +125,14 @@ type Mutation {
120
125
}
121
126
----
122
127
128
+
For more information about Types go to the official https://graphql.org/learn/schema/[graphQL documentation]
129
+
130
+
123
131
=== Resolver
124
132
125
133
Resolvers has the instructions to turn GraphQL orders into the data requested.
126
134
127
-
To create a resolver we go to our module and then create a new `todo.resolver.ts` file, import the decorators needed and set our resolver.
135
+
To create a resolver we go to our module and then create a new `todo.resolver.ts` file, import the decorators needed and set the resolver.
128
136
129
137
[source,typescript]
130
138
----
@@ -166,7 +174,7 @@ export class TodoResolver {
166
174
167
175
Here we have also an argument decorator `@Args` which is an object with the arguments passed into the field in the query.
168
176
169
-
By default we can access the query or mutation using it's name, for example:
177
+
By default we can access the query or mutation using the method's name, for example:
170
178
171
179
For the `deleteTodo` mutation.
172
180
@@ -199,9 +207,9 @@ Learn more about resolvers, mutations and their argument decorators on the https
199
207
200
208
=== Playground
201
209
202
-
The playground allow us to test or resolvers, we can access by default on `http://localhost:3000/graphql`.
210
+
To test our backend we can use tools as Postman, but graphql already gives us a playground to test our resolvers, we can access by default on `http://localhost:3000/graphql`.
203
211
204
-
We can call a query this way:
212
+
We can call a query, or several querys this way:
205
213
206
214
[source,typescript]
207
215
----
@@ -249,7 +257,7 @@ mutation{
249
257
250
258
And the output
251
259
252
-
[source,typescript]
260
+
[source,json]
253
261
----
254
262
{
255
263
"data": {
@@ -260,4 +268,18 @@ And the output
260
268
}
261
269
----
262
270
263
-
In this case we return just one item so there is no array, we also got just the `task data` but if we want the `id too, we just have to add it on the request.
271
+
In this case we return just one item so there is no array, we also got just the `task data` but if we want the `id` too, we just have to add it on the request.
272
+
273
+
To make the playground unavailable we can add an option to the app.module import:
274
+
275
+
[source,typescript]
276
+
----
277
+
...
278
+
GraphQLModule.forRoot({
279
+
...
280
+
playground: false,
281
+
}),
282
+
...
283
+
----
284
+
285
+
For further information go to the official https://docs.nestjs.com/graphql/quick-start[NestJS documentation]
0 commit comments