Subscription resolvers in GraphQL - Mini Project: Build & Apply

Building a GraphQL Subscription Resolver

📖 Scenario: You are creating a simple chat application where users can send messages and receive new messages in real-time.

🎯 Goal: Build a GraphQL subscription resolver that allows clients to listen for new chat messages as they arrive.

📋 What You'll Learn

Create a basic message data structure

Set up a PubSub system for message events

Write a subscription resolver for new messages

Complete the subscription setup to enable real-time updates

💡 Why This Matters

🌍 Real World

Real-time chat apps, live notifications, and collaborative tools use subscription resolvers to push updates instantly to users.

💼 Career

Understanding subscription resolvers is essential for backend developers working with GraphQL APIs that require real-time data updates.

1

DATA SETUP: Create the initial message array

Create an array called messages with these exact objects: { id: 1, content: "Hello!" } and { id: 2, content: "Welcome to the chat." }

GraphQL

# Your code here

Hint

Use const messages = [ ... ] to create the array with two message objects.

2

CONFIGURATION: Set up PubSub for subscriptions

Create a constant called PubSub by importing it from 'graphql-subscriptions' and then create a new instance called pubsub using new PubSub()

GraphQL

const messages = [
  { id: 1, content: "Hello!" },
  { id: 2, content: "Welcome to the chat." }
];

// Your code here

Hint

Use const { PubSub } = require('graphql-subscriptions') and then const pubsub = new PubSub().

3

CORE LOGIC: Write the subscription resolver for new messages

Create an object called Subscription with a field messageAdded that has a subscribe function returning pubsub.asyncIterator('MESSAGE_ADDED')

GraphQL

const messages = [
  { id: 1, content: "Hello!" },
  { id: 2, content: "Welcome to the chat." }
];

const { PubSub } = require('graphql-subscriptions');
const pubsub = new PubSub();

// Your code here

Hint

Define Subscription with messageAdded field and a subscribe function returning pubsub.asyncIterator('MESSAGE_ADDED').

4

COMPLETION: Publish new messages and export subscription

Add a function called addMessage that takes content, creates a new message with an incremented id, pushes it to messages, and calls pubsub.publish('MESSAGE_ADDED', { messageAdded: newMessage }). Then export Subscription and addMessage.

GraphQL

const messages = [
  { id: 1, content: "Hello!" },
  { id: 2, content: "Welcome to the chat." }
];

const { PubSub } = require('graphql-subscriptions');
const pubsub = new PubSub();

const Subscription = {
  messageAdded: {
    subscribe: () => pubsub.asyncIterator('MESSAGE_ADDED')
  }
};

// Your code here

Hint

Create addMessage to add and publish new messages, then export Subscription and addMessage.