Skip to content

Commit 08533d0

Browse files
author
monica.lopez-gris
committed
update doc
1 parent 2631956 commit 08533d0

1 file changed

Lines changed: 107 additions & 74 deletions

File tree

‎documentation/guides-grapql.asciidoc‎

Lines changed: 107 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,40 @@ toc::[]
1717

1818
= GraphQL on Devon4Node
1919

20-
GraphQL is a query lenguage that gets exactly the data that we ask for instead of static predefined responses.
20+
GraphQL is a query language that gets exactly the data that we ask for instead of static predefined responses.
21+
22+
For example, on a regular API a get by id method would return something like:
23+
24+
[source, json]
25+
----
26+
{
27+
"location": {
28+
"lon": 00.14,
29+
"lat": 54.11
30+
},
31+
"station": "dsrEE3Sg",
32+
"visibility": 5000,
33+
"wind":{
34+
"speed": 6.2,
35+
"deg": 78
36+
},
37+
"logs": [...]
38+
...
39+
}
40+
----
41+
But if we want to get *only* the wind data we have to create another endpoint that returns the specified data.
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:
44+
45+
[source, json]
46+
----
47+
{
48+
"wind":{
49+
"speed": 6.2,
50+
"deg": 78
51+
}
52+
}
53+
----
2154

2255
To install it:
2356

@@ -27,9 +60,16 @@ yarn add @nestjs/graphql graphql-tools graphql apollo-server-express
2760
----
2861

2962
== Schema first
63+
64+
[NOTE]
65+
====
3066
This tutorial uses the schema first method.
3167
32-
We assume you have already a functioning TODO service on a module
68+
We assume you have already a functioning TODO module / app.
69+
70+
If not you can use https://github.com/devonfw/devon4node/wiki/samples#devon4node-samples[Devon4node TODO sample]
71+
====
72+
3373

3474
First we need to import GraphQLModule to our `app.module.ts`.
3575

@@ -58,79 +98,9 @@ The `typePaths` indicates the location of the schema definition files.
5898

5999
The `definitions` indicates the file where the typescript definitions will automatically save, adding the `outputAs: 'class'` saves those definitions as classes.
60100

61-
=== Playground
62-
63-
Once we have imported GraphQL we can access it's playground by default on `http://localhost:3000/graphql`.
64-
65-
The playground allow us to test or resolvers, we can call a query this way:
66-
67-
[source,typescript]
68-
----
69-
{
70-
findAll{
71-
id,
72-
task
73-
}
74-
}
75-
----
76-
77-
And the output will look something like:
78-
[source,typescript]
79-
----
80-
{
81-
"data": {
82-
"findAll": [
83-
{
84-
"id": "5fb54b30e686cb49500b6728",
85-
"task": "clean dishes"
86-
},
87-
{
88-
"id": "5fb54b3be686cb49500b672a",
89-
"task": "burn house"
90-
}
91-
]
92-
}
93-
}
94-
----
95-
96-
As we can see, we get a json "data" with an array of results.
97-
98-
And for our mutations it's very similar, in this case we create a todo with task "rebuild house" and we are going to ask on the response just for the task data, we don't want the id.
99-
100-
[source,typescript]
101-
----
102-
mutation{
103-
createTodo (
104-
task: "rebuild house"
105-
){
106-
task
107-
}
108-
}
109-
----
110-
111-
And the output
112-
113-
[source,typescript]
114-
----
115-
{
116-
"data": {
117-
"createTodo": {
118-
"task": "rebuild house"
119-
}
120-
}
121-
}
122-
----
123-
124-
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.
125-
126-
[NOTE]
127-
====
128-
We need to have resolvers to try this.
129-
====
130-
131101
=== Schema
132102

133-
Let's define de elements, querys and mutations that our module is going to have.
103+
Let's define the elements, querys and mutations that our module is going to have.
134104

135105
[source,typescript]
136106
----
@@ -227,4 +197,67 @@ Also if we go back to the `schema.graphql`, we will see how we define the query
227197
Learn more about resolvers, mutations and their argument decorators on the https://docs.nestjs.com/graphql/resolvers#schema-first[NestJS documentation].
228198

229199

230-
Now start the server and go to `http://localhost:3000/graphql` you should see a playground, here you can test your resolvers.
200+
=== Playground
201+
202+
The playground allow us to test or resolvers, we can access by default on `http://localhost:3000/graphql`.
203+
204+
We can call a query this way:
205+
206+
[source,typescript]
207+
----
208+
{
209+
findAll{
210+
id,
211+
task
212+
}
213+
}
214+
----
215+
216+
And the output will look something like:
217+
[source,typescript]
218+
----
219+
{
220+
"data": {
221+
"findAll": [
222+
{
223+
"id": "5fb54b30e686cb49500b6728",
224+
"task": "clean dishes"
225+
},
226+
{
227+
"id": "5fb54b3be686cb49500b672a",
228+
"task": "burn house"
229+
}
230+
]
231+
}
232+
}
233+
----
234+
235+
As we can see, we get a json "data" with an array of results.
236+
237+
And for our mutations it's very similar, in this case we create a todo with task "rebuild house" and we are going to ask on the response just for the task data, we don't want the id.
238+
239+
[source,typescript]
240+
----
241+
mutation{
242+
createTodo (
243+
task: "rebuild house"
244+
){
245+
task
246+
}
247+
}
248+
----
249+
250+
And the output
251+
252+
[source,typescript]
253+
----
254+
{
255+
"data": {
256+
"createTodo": {
257+
"task": "rebuild house"
258+
}
259+
}
260+
}
261+
----
262+
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.

0 commit comments

Comments
 (0)