Build a GraphQL Server

57 minutes

In this course we take a look at a new data query language and runtime called GraphQL. GraphQL was designed and built at Facebook to help product developers request and receive the data they need for their mobile and web applications. GraphQL sits on top of your application’s data access layer, providing clients with the ability to explicitly specify their data requirements, and the guarantee that this data won’t change.

GraphQL manages these kind of guarantees through a mixture of it’s Type System and Query semantics, both of which are pieces of GraphQL that we’ll look at in this series. We’ll also take a look at Mutations, and how to make our GraphQL Servers Relay-compliant using Nodes, Edges, and Connections.

pro-course-rss-logo

PRO RSS Feed

Create a GraphQL Schema

Use GraphQL Primitive Types

P

Use GraphQL's Object Type for Basic Types

P

Use GraphQL's List Type for Collections

P

Serve a GraphQL Schema as Middleware in Express

P

Write a GraphQL Schema in JavaScript

P

Use Arguments in a GraphQL Query

P

Use GraphQLNonNull for Required Fields

P

Use GraphQLList with GraphQLObject Types

P

Write a GraphQL Mutation

P

Create an Input Object Type for Complex Mutations

P

Add an Interface to a GraphQL Schema

P

Add a Relay Node Interface to a GraphQL Schema

P

Convert GraphQL List Type to a Relay Connection Type

P

Use Relay’s Input Object Mutations

P
js tutorial about Create a GraphQL Schema

Create a GraphQL Schema

4:16 js

In this video, we’ll take a look at the GraphQL Language and write out our first GraphQL Schema. We’ll use the graphql package available to us through npm to parse our graphql language file and resolve our initial query.

js tutorial about Use GraphQL Primitive Types

Use GraphQL Primitive Types

1:57 js PRO

GraphQL’s Type System has support for a number of Primitive Types that we can use in our GraphQL Schema definitions. In this video, we’ll take a look at String, Boolean, Int, Float, and ID and how to incorporate them into a GraphQL Schema Definition.

js tutorial about Use GraphQL's Object Type for Basic Types

Use GraphQL's Object Type for Basic Types

2:13 js PRO

We can create the most basic components of our GraphQL Schema using GraphQL's Object Types. These types allow us to group related fields together under a specific type, such as a Video or a User, and then allows us to fetch these types when we query our schema. In this video, we'll learn how to write GraphQL Object Types in GraphQL's Schema language, as well as how to create resolvers for them, and ultimately how to query them.

js tutorial about Use GraphQL's List Type for Collections

Use GraphQL's List Type for Collections

2:25 js PRO

In order to handle collections of items in a GraphQL Schema, GraphQL has a List Type. In this video, we’ll learn the syntax for specifying a List of items in a GraphQL Schema.

js tutorial about Serve a GraphQL Schema as Middleware in Express

Serve a GraphQL Schema as Middleware in Express

4:03 js PRO

If we have a GraphQL Schema expressed in terms of JavaScript, then we have a convenient package available to us that let’s us easily serve up our schema on any endpoint in an Express Server. In this video, we’ll use the express-graphql package to serve up our GraphQL Schema as middleware, and also learn how to enable the GraphiQL tool in order to query our GraphQL Schema.

js tutorial about Write a GraphQL Schema in JavaScript

Write a GraphQL Schema in JavaScript

5:38 js PRO

Writing out a GraphQL Schema in the common GraphQL Language can work for simple GraphQL Schemas, but as our application grows, or when we start using more complex types like interfaces or unions, we find that we can’t use a GraphQL Language file in the same way as before. In this video, we’ll learn how to translate a GraphQL Schema written in GraphQL into a GraphQL Schema written in JavaScript.

js tutorial about Use Arguments in a GraphQL Query

Use Arguments in a GraphQL Query

3:58 js PRO

In GraphQL, every field and nested object is able to take in arguments of varying types in order to do common operations like fetching an object by it's ID, filtering, sorting, and more. In this video, we'll update a field to take in an id argument and then learn how to use that argument in our resolve method to fetch a video by its id.

js tutorial about Use GraphQLNonNull for Required Fields

Use GraphQLNonNull for Required Fields

2:05 js PRO

While certain fields in a GraphQL Schema can be optional, there are some fields or arguments that are necessary in order to either fulfill a query, or to provide a guarantee to people using the Schema that some field exists. In this video, we'll take a look at turning an argument in a NonNull argument by applying the GraphQLNonNull type in order to guarantee that the given argument is supplied in the query.

js tutorial about Use GraphQLList with GraphQLObject Types

Use GraphQLList with GraphQLObject Types

1:54 js PRO

When working with collections of things in GraphQL, we'll always reach out for the GraphQLList Type. In this video, we'll learn how to use GraphQLList from the graphql package in combination with a GraphQLObject Type to create a field that returns a collection in our Schema.

js tutorial about Write a GraphQL Mutation

Write a GraphQL Mutation

5:14 js PRO

In order to change the data that we can query for in a GraphQL Schema, we have to define what is called a mutation in GraphQL. Mutations allow us to specify ways to create, update, and delete data. It also provides a way to fetch information after the mutation occurs. In this video, we’ll learn how to create a Mutation Type in GraphQL and specify the information we want returned.

js tutorial about Create an Input Object Type for Complex Mutations

Create an Input Object Type for Complex Mutations

2:29 js PRO

When we have certain mutations that require more complex input parameters, we can leverage the Input Object Type in GraphQL. In this video, we’ll learn how to create an Input Object Type and how to add it to a GraphQL Mutation Type.

js tutorial about Add an Interface to a GraphQL Schema

Add an Interface to a GraphQL Schema

5:18 js PRO

As we start building out more complex GraphQL schemas, certain fields start to repeat across different types. This is a perfect use-case for the Interface Type made available to us through GraphQL’s Type System. In this video, we’ll go over how to create an Interface Type and how to add it to an existing type in a GraphQL Schema.

js tutorial about Add a Relay Node Interface to a GraphQL Schema

Add a Relay Node Interface to a GraphQL Schema

7:00 js PRO

The GraphQL Relay Specification requires that a GraphQL Schema has some kind of mechanism for re-fetching an object. For typical Relay-compliant servers, this is going to be the Node Interface. In this video, we’ll add in the Node interface to a GraphQL Schema by using the helpers available in the graphql-relay npm package.

js tutorial about Convert GraphQL List Type to a Relay Connection Type

Convert GraphQL List Type to a Relay Connection Type

4:12 js PRO

In order to properly traverse through collections, Relay-compliant servers require a mechanism to page through collections available in a GraphQL Schema. In this video, we’ll create a Connection type from an existing GraphQL List Type and learn how to access edge information from each collection.

js tutorial about Use Relay’s Input Object Mutations

Use Relay’s Input Object Mutations

4:59 js PRO

In order to support mutations in Relay, there is a requirement that the GraphQL Server exposes mutation fields in a standardized way. This standard includes a way for mutations to accept and emit an identifier string, allowing Relay to track mutations and responses. In this video, we’ll learn how to use a helper available to us through graphql-relay to create Mutation fields that accept clientMutationId’s.

Presented by:

Josh Black

Front-End Developer for IBM Watson. Overly excited about all things web-related.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?