[GraphQL] Serve a GraphQL Schema as Middleware in Express

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.

 

Install:

yard add express express-graphql graphql

 

const express   = require('express');
const graphqlHttp = require('express-graphql');

const server = express();
const port   = process.env.PORT || 3000;

const { graphql, buildSchema } = require('graphql');

const schema = buildSchema(`
    type Video {
        id: ID,
        title: String,
        duration: Int,
        watched: Boolean
    }
    
    type Query {
        video: Video,
        videos: [Video]
    }
    
    type Schema{
        query: Query
    }
`);

const videos = [
    {
        id       : '1',
        title    : 'react',
        duration : 180,
        watched  : true
    },
    {
        id       : '2',
        title    : 'relay',
        duration : 230,
        watched  : false
    }
];

const resolvers = {
    video  : () => ({
        id       : '1',
        title    : 'bar',
        duration : 180,
        watched  : true
    }),
    videos : () => videos
};

server.use('/graphql', graphqlHttp({
                                     schema,
                                     graphiql  : true, // use graphiql interface
                                     rootValue : resolvers
                                 }));

server.listen(port, () => {
    console.log(`Listening on http`)
})

 

We use 'graphql' middleware, once we visit http://localhost:3000/graphql and enter the query:

{
  videos {
    id
    title
    duration
    watched
  }
}

Then we can get the result.