Introduction to GraphQL GraphQL Basics & Starting the Server

Transcript from the "GraphQL Basics & Starting the Server" Lesson

[00:00:03]
>> Scott Moss: So the first thing we're gonna do is we're just gonna get a GraphQL server going. So what I want you to do is feel free to follow along on this one because I'm just gonna live code a very basic getting started GraphQL server and show you some basic stuff.

[00:00:16] But afterwards I'm gonna give you ten minutes to work it on yourself and I'll come back and see what you got. So if you wanna follow along, so what I'm gonna do is I'm gonna hop into the server JS file. There's a lot going on here but just to break it down, what's actually happening here is we're using a package called Apollo Server.

[00:00:33] Now, Apollo is, if you've ever heard of, who's ever heard of Meteor, Meteor JS? Okay, so Meteor JS, I think Meteor is still alive and kicking but they actually did a spin off, and they make this product called Apollo. Apollo is basically a whole bunch of tooling and products around GraphQL.

[00:00:51] They have some paid products that you can use. They also have tons of resource stuff. And Apollo Server is their implementation of creating GraphQL servers. After GraphQL's been out for awhile, they learned a lot about creating GraphQL servers and Apollo Server's what they created. This is the one that I like to use, there's tons of other ones out there.

[00:01:08] So the reason Apollo Servers actually create a GraphQL server, do a lot of work for us. And this other stuff is just gonna be the schemas and stuff that you'll be creating later on connected to the database, the configuration that I talked about, stuff like that. And then we have this function here where we're actually going to start a server.

[00:01:26] So here, what we're gonna do is we're just gonna create a hello world GraphQL server, and we're gonna try to query it using some type of tooling, and see what we get. So if we look inside of this start function, you'll see this thing called a rootSchema. And then we have this Apollo Server.

[00:01:42] Basically the root scheme is just gonna be your entry scheme, it's just gonna be the first part of the schema. Because if you think of a schema and like a tree, like a graph there has to be a root and this is it. This is the root, this is the entry point to our schema and then this is where we actually start the server.

[00:02:03] So what I'm gonna do is I'm just gonna come in here and I'm going to start typing stuff you've probably never seen before, but I just wanted to get the brain rolling and kinda see what I'm doing here. So what I wanna do is I just wanna be able to create a new type in GraphQL, remember GraphQL is kinda like a It's like a type script.

[00:02:23] It's like a typing interface. So what you first have to do is create a type and describe what that looks like. So what I'm gonna say is, I'm gonna create a type for a Cat. So I can just type in the word type Cat, like this. And I'm gonna say a Cat has a name.

[00:02:43] And that type is a string. So so far, we have a type that's called cat, and it has a field on it called name. And the type of that field is a string. So now I wanna be able to query for a cat. I wanna be able to retrieve a cat.

[00:03:05] So I created a type for a cat, but now I wanna be able to retrieve it. So in order to do that, I have to make a type called Query. Or I can call it whatever I want, but in this case we're gonna call it Query with a capital Q, that's just the convention.

[00:03:17] And then I have to create a field on this Query type that will allow me to query for cats. So I'm just gonna call this one myCat. Just gonna say myCat as the field name. And its type is gonna be a Cat. So what this is saying is I'm adding a field to the query type called myCat and its return type is going to be a cat.

[00:03:46] So, it's going to return something in the shape of this. Which is an object with a name on it. And, down below I've already told graphQL schema that my query type is going to be this type called Query with a capital Q. This is why I was like you can call this whatever you want as long as you change it down there.

[00:04:04] So you normally just call it query.
>> Scott Moss: So now that we created a schema what a cat type and we created a query that's capable of returning a cat type, we now have to create a resolver though actually resolve that cat type. And a resolver is very much like a controller and we'll talk about that later.

[00:04:23] So to do I'll just come down here to resolvers, and then what I need to do is, I need to resolve Query myCal. So what I'll this object down here I'll say, I wanna resolve Query which is an object, and I wanna resolve the myCal field, and we'll make a function for that.

[00:04:43] So for myCat, the only thing I have to do to satisfy GraphQL is have myCat return something in a cat shape, which is just an object with a name on it. So I'll do that, so I'll come out here and I'll say just return an object with a name properly on it, and a name, Garfield.

[00:05:05]
>> Scott Moss: So you can see, I have a, I'm creating a resolver for the query, myCat, and it needs to return its shape called Cat, which is a name. So I'm gonna do that. And then now what I'm gonna do is, I'm gonna go ahead and execute the dev command.

[00:05:21] And just to scroll down you can see what I'm doing here is I'm connecting to the database. And then I'm listening on the server with a passed in port that I'm logging. All of that is happening for us. So I can just go ahead and open this up.

[00:05:31] And if you haven't already, if you try to run this and it doesn't work don't forget to install your dependencies either using NPM or Yarn. So install those first otherwise none of this is going to work. So I am just gonna go ahead and run yarn def.
>> Scott Moss: And you can see I got a log here.

[00:05:53] GQL server ready at local host 3000.