Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Using Aliases to Rename Fields3:37 with Isaac Lee Morris
Fields can overlap when you are querying the same field with different arguments. In this video we will discuss the syntax for aliasing a field and show a query with the same field aliased twice.
(Apollo's Launchpad has been deprecated, so your screen will look different)
- Fragment - Reusable sets of fields that can be included in multiple queries; saves time from needing to manually include the same fields over and over in many places
GraphQL Fragments are the Best Match for UI Components by Samer Buna
Up until this point, when we want to include a field in our response, 0:00 we specify each field individually. 0:05 Now this is fine for experimenting, but when building an actual project, 0:08 there's a good chance we'll need to grab the same fields in multiple places. 0:13 Fortunately GraphQL makes this possible with a concept called fragments. 0:18 A fragment is simply a block of code 0:24 that specifies a group of fields that you want to include in your response. 0:27 To see how this works let's jump back in the Launchpad for an example. 0:32 For this example, we'll be using the movie by ID in point again, 0:36 aliased under movieOne and movieTwo. 0:41 Just like in the last video, we'll start with our query declaration. 0:44 Then we'll go ahead and write the first call the movieById, 0:49 which will be aliased under movieOne. 0:53 For this one, we'll use the movieId of movie_0, 0:58 then in our response we'll include the id, 1:04 title, tagline, and revenue fields. 1:09 Now let's go ahead and repeat the same thing for movieTwo. 1:14 Again, we've got the alias of movieTwo calling movieById. 1:18 The movieId we'll use for this one is movie_1. 1:25 And we'll go ahead and include those same fields again, 1:32 id, title, tagline and revenue. 1:37 Right now when we want to include the same fields for 1:41 each movie, we have to manually type those fields out inside of each end point call. 1:43 Now go ahead and run the query. 1:50 As expected it works fine, we have both of our movies, but 1:55 it was a little repetitive to type it all out. 1:58 You can probably see how this could get tedious pretty quickly. 2:02 This is exactly where fragments come in handy. 2:06 To define a new fragment we'll start with the fragment key word. 2:09 This fragment we'll call movie details. 2:14 We then need to tell GraphQL which type this fragment can be used on 2:20 using the on keyword followed by the Movie type. 2:25 After that, it's just like any other query. 2:31 Inside of the curly brackets we'll go ahead and 2:33 copy paste the fields we used from our query above. 2:37 Now let's modify those queries a bit. 2:52 Inside of the curly brackets, go ahead and delete those fields. 2:55 Now, instead of typing them all out, we can just include our new fragment. 3:04 To do this type in three dots followed by the fragment name, 3:09 which in this case is movieDetails. 3:13 I did the same thing for movieTwo. 3:19 Now go ahead and run that query. 3:24 As you can see, it works like a charm. 3:27 Using fragments when we need to retrieve the same information 3:30 can save us quite a bit of time and quite a bit of typing. 3:33
You need to sign up for Treehouse in order to download course files.Sign up