Create Data Relationships

[00:00:00]
>> So let's take that a step further, let's do the same thing for our books. And so, I'm gonna actually just, I think I can do a lot of this just really quickly like that. And just double check that I don't need to change any of these, nope, those should all be good.

[00:00:21]
So we've got ourselves books now going in the same way that our authors did. So let's save, stop, and restart. We now see that we also have book. So if I go in, I can query the ID, ISBN. Let's get the name, the author. I am missing my series info, though, which is a little bit odd.

[00:00:54]
There's no book slug is why, that's what I get for copy pasting. Let's try this one more time. Jeez, okay. So let's try that again, and now there it is, there's our series, and series order, and we get all of our books. So here's each of the books and we can see down here that the series order went null, all right?

[00:01:18]
All right, so, we now have custom data inside of our Gatsby layer. But there's a problem here, which is that for my author, I'm getting this but what if I wanna be able to display the author's name, right? I would like to be able to dig into that and get the author name, and so in order to do that, we're gonna have to create relationships between these nodes.

[00:01:45]
So let's first talk about how this will actually function. So if you imagine your data as being in a REST API, what you get is you're kind of specifying what's called foreign keys. If you've know anything about data normalization, then you may have heard of that term before.

[00:02:09]
If you haven't, don't worry about it, it basically means in both objects there's something that matches. So if we look at our author and get the nodes, so here we go, the name and the slug. I stopped the, okay, instead of starting that again, I'm just gonna go over here and we're gonna look at the authors.

[00:02:31]
So the authors have a slug and this value here matches the value of author here, right? So these slugs are a unique identifier for each author, this is what's called the foreign key. So this is our foreign key relationship with the author data. So to create one of these in Gatsby, we're gonna use what is called the createTypes API.

[00:03:01]
And if you are running Gatsby, underneath GraphQL is what's called a schema. And the schema is what gives us the ability to generate these queries out here, the fact that all this is done, this is all built off of the schema. So looking at the query, this is what the schema looks like under the hood.

[00:03:24]
So as you can see this is pretty intimidating, there's quite a bit in here, but we don't need to care about any of that. What we need to care about is specifically the thing we're trying to accomplish, which is that we wanna add a relationship between these two types of data.

[00:03:37]
So I'm just gonna write a little bit of GraphQL schema right in here, and the first thing that we wanna do is we're gonna touch our author. Every data type in Gatsby is a node, so we have to implement the node interface and then Gatsby gives us some convenience where it doesn't require us to redeclare every field.

[00:03:57]
Gatsby does something called inference where it will look at the data that comes in and generate fields based on that data. Most of the time this is fine, sometimes you'll have to do a little bit of messing around in here and that's where this createTypes comes in very handy.

[00:04:12]
So what I wanna do is I want my author to have a list of their books, and I want books to have access to the author object. So for each author I wanna add a field called books, and I want this to be an array of their books and I want this to be required.

[00:04:30]
So you can either get an empty array or you'll get an array of books, but you can't get an array of null and you can't get the value null, that's what these exclamation points here mean. And I want to link this, so the way that linking works is it's gonna say we need to link from a field and we need to link by another field.

[00:04:51]
So I, in my from field, have what my foreign key is. So in author my foreign key is the slug. And in the book we're gonna put this inside of the author itself, so the book object will actually be book.author.name. So when I want to link inside of the name, it's gonna be author.slug, so the name and slug will live inside of the author field on book.

[00:05:21]
So that's how we link that one and then let's do the same thing in reverse for the book, so that one's also gonna implement the node interface. And this one gets an author, we're just gonna override the author field and I'm gonna do that by using the author type.

[00:05:39]
And then this one links, it's gonna link from author which is the the field that's got the slug in it, and it's gonna link by slug on the author type. So we're basically telling Gatsby this is what I want to happen, I want when I search for authors to get a books field that has information about the books written by this author.

[00:06:01]
And then if I'm on the book type, I want access to information about the author of those books, and I'll show you why this is cool in a second. I mean actually that's it, that's all we have to do. So why don't we start it and I'll show you what's cool about it right now.

[00:06:14]
So when we're allowing for our books to have authors and our authors to have books, we could recurse this, right? We could just go deeper, and deeper, and deeper, and yeah, actually it's kinda cool, it's a cool way to be able to do that sort of development. So now that we've got this set up, if I'm looking at my author here and I pull open books, I can now find the name and ISBN of every book they've written.

[00:06:45]
Let me get the book out for a second so we can see this more easily. So here's our author query, and we've got NK Jemisin and here are all the books in this database by NK Jemisin. That is pretty dang cool, right? But let's go the other way on this, and so now I'm gonna say I wanna look at all my books, and for my books, I want the author to pull out their name, but then I also wanna pull out their other books.

[00:07:18]
So I'm gonna pull out all the books that they've written with the ISBN, so we can get, here's The Fifth Season, it was written by NK Jemisin, and here are all the other books by NK Jemisin. So this is so much easier than having to write a series of nested REST calls and doing the async await dance of making sure all those promises have resolved before I move on.

[00:07:45]
This felt like a game changer to me, this is when I finally went I get why GraphQL matters, cuz I spent a long time looking at it, going, I don't know, it just feels like complicated REST, right? This is why it matters, this convenience, this ability to say hey, as a front end developer, you don't need to string together tons of HTTP calls.

[00:08:04]
You can say what you want and GraphQL will abstract away all the complexity of linking up that data. So this is the real power of how this stuff works.