1
00:00:00,000 --> 00:00:04,428
[MUSIC]

2
00:00:04,428 --> 00:00:09,130
Welcome to the final stage of
Introduction to GraphicQL.

3
00:00:09,130 --> 00:00:11,690
So far, we've practiced retrieving and

4
00:00:11,690 --> 00:00:14,840
modifying data using
the GraphicQL query language.

5
00:00:15,900 --> 00:00:18,720
In this final stage,
I'll show you a couple tricks

6
00:00:18,720 --> 00:00:22,320
that will make your GraphicQL
queries cleaner and more reusable.

7
00:00:23,610 --> 00:00:27,012
The first concept we'll
go over is aliases,

8
00:00:27,012 --> 00:00:30,783
aliases are used to rename
the content of a query.

9
00:00:30,783 --> 00:00:35,339
This is great when we want to include the
results from multiple queries to the same

10
00:00:35,339 --> 00:00:37,930
endpoint in a single response.

11
00:00:37,930 --> 00:00:40,290
Let's head over to Launchpad
to see how it works.

12
00:00:41,360 --> 00:00:45,250
To better illustrate the need for
aliases, let's try querying for

13
00:00:45,250 --> 00:00:48,410
two movies using what we know so far.

14
00:00:48,410 --> 00:00:52,310
The end point we'll use is
the movie by ID end point.

15
00:00:52,310 --> 00:00:56,566
Let's start by taking a look
at the movie ID schema,

16
00:00:56,566 --> 00:01:00,352
in the back end editor pane,
under typeDefs.

17
00:01:00,352 --> 00:01:05,370
Looks like this endpoint just takes
a movie ID argument of type ID.

18
00:01:06,640 --> 00:01:08,680
Following that, after the colon,

19
00:01:08,680 --> 00:01:12,500
we can see that this endpoint
returns a movie object.

20
00:01:12,500 --> 00:01:16,413
Now that we know what we're working with,
we can go ahead and

21
00:01:16,413 --> 00:01:20,659
start writing our query, so
we'll start with the declaration.

22
00:01:24,003 --> 00:01:27,137
And we're querying movieById.

23
00:01:28,153 --> 00:01:35,222
And the movieId that we'll pass in,
we'll just use movie_0.

24
00:01:35,222 --> 00:01:39,958
As always, we need to pick some
fields to return, in this case,

25
00:01:39,958 --> 00:01:44,272
we'll just go with id and
title, go ahead and click Play,

26
00:01:46,360 --> 00:01:52,202
As we can see, this works fine, but
what happens when we add a second movie?

27
00:01:52,202 --> 00:01:57,366
Well, let's try it out, so
underneath the first query,

28
00:01:57,366 --> 00:02:04,170
we''ll add another movieById.

29
00:02:04,170 --> 00:02:08,581
This time,
the movieId we'll use is movie_1,

30
00:02:10,560 --> 00:02:17,693
Again, we'll specify that we want the id
and title fields returned, and click Play.

31
00:02:18,959 --> 00:02:23,580
Hm, looks like GraphQL didn't like that,
but why not?

32
00:02:23,580 --> 00:02:28,610
The reason this won't work is that there's
a name collision between the two calls.

33
00:02:28,610 --> 00:02:32,200
In other words, they both ask for
the same endpoint, and

34
00:02:32,200 --> 00:02:35,510
only one value can be returned for
each endpoint.

35
00:02:36,640 --> 00:02:41,090
So how do we solve this, well,
it's actually pretty simple.

36
00:02:41,090 --> 00:02:45,574
We just need to specify an alias for
each response to be nested under, so

37
00:02:45,574 --> 00:02:47,820
they no longer collide.

38
00:02:47,820 --> 00:02:51,965
So for the first movie,
we'll add an alias called movieOne.

39
00:02:51,965 --> 00:02:55,472
You can go ahead and add that alias
right in front of the end point name.

40
00:02:58,983 --> 00:03:03,272
Then for the second movie,
we'll give that an alias of movieTwo.

41
00:03:03,272 --> 00:03:07,300
Again, add a colon right in
front of the endpoint name,

42
00:03:07,300 --> 00:03:09,366
now go ahead and click Play.

43
00:03:11,338 --> 00:03:14,909
As you can see, this time we were
able to get the response, and

44
00:03:14,909 --> 00:03:17,735
it was nested under
the aliases that we created.