Express integration in GraphQL - Mini Project: Build & Apply

GraphQL Express Integration

📖 Scenario: You are building a simple web server that uses GraphQL to handle requests. This server will run on Express, a popular web framework for Node.js. You want to set up a GraphQL endpoint where clients can send queries and get data about books.

🎯 Goal: Create a basic Express server with a GraphQL endpoint at /graphql. Define a simple GraphQL schema with a Book type and a query to get a list of books. Connect the schema to the Express server using the express-graphql middleware.

📋 What You'll Learn

Create an Express server instance

Define a GraphQL schema with a Book type having id, title, and author fields

Create a root query type with a books field returning a list of books

Use express-graphql middleware to connect the schema to the Express server at /graphql

Provide a sample list of books as data

💡 Why This Matters

🌍 Real World

Many modern web applications use GraphQL with Express to create flexible APIs that clients can query for exactly the data they need.

💼 Career

Understanding how to integrate GraphQL with Express is a valuable skill for backend developers building APIs for web and mobile apps.

1

Set up Express server and sample data

Create an Express server by importing express and calling express(). Then create a constant called books that is an array of objects with these exact entries: { id: '1', title: '1984', author: 'George Orwell' } and { id: '2', title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' }.

GraphQL

# Import express and create an app
# Create the books array with two book objects
# Your code here

Hint

Use require('express') to import Express and call express() to create the app. Define books as an array with two objects exactly as shown.

2

Define GraphQL schema with Book type and Query

Import buildSchema from graphql. Create a constant called schema using buildSchema with this exact schema string: a Book type with id, title, and author fields all of type String!, and a Query type with a books field that returns a list of Book objects.

GraphQL

const express = require('express');
const app = express();

const books = [
  { id: '1', title: '1984', author: 'George Orwell' },
  { id: '2', title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' }
];

// Import buildSchema and create schema
// Your code here

Hint

Use buildSchema to define the GraphQL schema string exactly as described. Include the Book type and the Query type with the books field.

3

Create root resolver with books query

Create a constant called root that is an object with a books function. This function should return the books array defined earlier.

GraphQL

const express = require('express');
const app = express();

const books = [
  { id: '1', title: '1984', author: 'George Orwell' },
  { id: '2', title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' }
];

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

const schema = buildSchema(`
  type Book {
    id: String!
    title: String!
    author: String!
  }

  type Query {
    books: [Book]
  }
`);

// Create root resolver with books function
// Your code here

Hint

Define root as an object with a books function that returns the books array.

4

Connect GraphQL schema to Express with express-graphql

Import graphqlHTTP from express-graphql. Use app.use to add middleware at '/graphql' with graphqlHTTP passing an object with schema, rootValue set to root, and graphiql set to true. Finally, call app.listen on port 4000.

GraphQL

const express = require('express');
const app = express();

const books = [
  { id: '1', title: '1984', author: 'George Orwell' },
  { id: '2', title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' }
];

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

const schema = buildSchema(`
  type Book {
    id: String!
    title: String!
    author: String!
  }

  type Query {
    books: [Book]
  }
`);

const root = {
  books: () => books
};

// Import graphqlHTTP and add middleware
// Start server on port 4000
// Your code here

Hint

Import graphqlHTTP from express-graphql. Use app.use to add the GraphQL middleware at /graphql. Pass the schema, rootValue, and enable graphiql. Finally, start the server on port 4000.