Check out a free preview of the full Advanced GraphQL course:
The "Query Fragments" Lesson is part of the full, Advanced GraphQL course featured in this preview video. Here's what you'd learn in this lesson:

Scott introduces fragments, which reduce repetitive nature of asking for the same data in the same query.

Get Unlimited Access Now

Transcript from the "Query Fragments" Lesson

[00:00:01]
>> Scott Moss: Alright, so the next thing we're gonna do is we're gonna hop into unions, fragments, and interfaces. And how to use them and when to use them, that's what we're gonna do. So is anybody not familiar with unions, fragments, and interfaces? Okay, cool, alright, this is going to be fun then, this is awesome, this what I'm talking about.

[00:00:25] Alright, so what we're gonna do is, I'm gonna go to this other repo I have over here, there we go, so to lower the barrier. And we're gonna talk about field things, the first thing is let us talk about Fragments. So for the people who do know where fragments are, can you give me a definition of what a fragment is?

[00:00:45] Yes?
>> Speaker 2: It's a predefined set of fields on a tape that you want to return whenever you drop that tape.
>> Scott Moss: Yeah, that's exactly is, it's basically, yeah, it's like you can think of this like fragments are like a template of fields for a type. So you do not have to keep writing them over and over.

[00:01:03] I wanna group these fields together and reference it as this template and just reuse this template in my craze everywhere, that's what a fragment is. So they way that you would do that and I will try to come up with an example here that is not so trivial.

[00:01:19] As I say we had a person, I also had age, we had an ID, had like all these things. And I was going to write a query that was going to use, this person, these exact fields over and over and over again. What I can do is, instead of doing something like, let me start this.

[00:01:53]
>> Scott Moss: So, if I was going to ask for that person, let's make sure I resolve those so it doesn't break
>> Scott Moss: Name and age, all right let's do that.
>> Scott Moss: ID is 1, cool, all right, so that won't break. So if I was to say, all right I wanna grab that person.

[00:02:18] One person with an id of, doesn't matter, and I want to get the name, the age, refresh that.
>> Scott Moss: The name, the age,
>> Scott Moss: There we go, and the id. And let's say I was doing another one underneath here that says, otherPerson, that's also one person. And I was doing the exact same thing, this is a trivial example.

[00:02:52] And then I wanted these same things, I could copy this, right. With a fragment, fragment's gonna allow me not to have to do this twice. So I can actually just, you can do what's called inline fragment or you can do what's called a name fragment. Sometimes you have to do one over the other, in this case we can actually just do a name fragment on this type.

[00:03:14] All right, so the way you would do that is you would, let me see this right here. So you would do something like this, you would say fragment. And then you would give the fragment a name, I'm gonna call this person fields. Then you would say on and then you would say the type that this fragment is on.

[00:03:42] In this case it's on the, whatever they return type of this is, which is a person. So this is on a person, and then I'm just gonna copy these fields here, gotta place them all in here.
>> Scott Moss: And then now, instead of doing name, age and all this, I can actually just use the fragment in line like this, personFields, personFields.

[00:04:17]
>> Scott Moss: Right, so now if I ever wanted to change those fields, I only had to change them in one place. This is a terrific example, cuz I'm putting them all in one query, into one file. But when you're building a client side app, you'll probably have multiple queries everywhere and they all use similar fields.

[00:04:31] So then you would put fragments in many places and you would bring them in when you actually make the query. So it's a lot easier to think about when you have a separation or concerned multiple files. This one is like so simple, but yes, this is how you would do it and when you run it you get back the same stuff, so that is a fragment.

[00:04:50] So this is how you would make a fragment, this is a name fragment on the person field, with these fields. And this is how you would apply the fragment, this is how you would use it. Any questions on the fragments? Pretty simple. Yeah, they make your life so much easier, mostly for client-side stuff.

[00:05:11] Fragment is definitely a client-side thing, so it's not so much of a server-side thing. You notice we didn't even have to do any work on the server at all. It's mostly just for querying, helping you keep your things slim and stuff like that.
>> Speaker 3: There was one question from chat.

[00:05:26]
>> Scott Moss: I forgot chat.
>> Speaker 3: No, it's no problem.
>> Scott Moss: Okay.
>> Speaker 3: The question is can you use a fragment as an input?
>> Scott Moss: No, you can't, and the reason I said is because I tried so hard to do that before. [LAUGH] You can't do it, no, I wish you could.

[00:05:45] No, you can't use fragments inputs, you can only use them for querying.