Building a GraphQL Mesh API Gateway

Published on: 2024-08-22

📝 Introduction

GraphQL Mesh is transforming how APIs are integrated. It allows developers to unify REST APIs, gRPC services, GraphQL APIs, databases, and other sources into a single GraphQL gateway – without writing resolvers manually.

This article covers:

• What GraphQL Mesh is
• Why it’s useful for modern backends
• How it differs from Apollo Federation
• A minimal working example to try locally

🌐 What is GraphQL Mesh?

GraphQL Mesh is an open-source framework that:

• Generates GraphQL schemas automatically from existing APIs
• Supports REST, gRPC, SOAP, OpenAPI, GraphQL APIs, and databases
• Allows querying multiple sources via one GraphQL endpoint

✅ Key takeaway: GraphQL Mesh bridges legacy and modern services under a unified schema without manual schema stitching or resolver definitions.

🤔 Why Use GraphQL Mesh?

Benefit	Explanation
No manual resolvers	Auto-generates resolvers based on API definitions
Data unification	Integrates REST, gRPC, GraphQL, and DBs into one schema
Legacy bridging	Turns existing APIs into GraphQL for modern frontend consumption
Type safety	Generates TypeScript typings and SDKs automatically

🔍 GraphQL Mesh vs Apollo Federation

Feature	GraphQL Mesh	Apollo Federation
Purpose	Integrate any API/data source as GraphQL	Compose multiple GraphQL microservices
Data source support	REST, gRPC, SOAP, GraphQL, DBs	GraphQL services only
Resolver implementation	Auto-generated	Requires developer-defined schemas and resolvers
Best use case	API gateway over heterogeneous services	Federated GraphQL microservices

🔧 Minimal GraphQL Mesh Example

Here is a practical quickstart using Node.js and npm.

1. Initialize Project

mkdir mesh-gateway
cd mesh-gateway
npm init -y

2. Install GraphQL Mesh CLI

npx @graphql-mesh/cli init

✅ This creates:

• mesh.config.yaml (Mesh config file)
• Example handlers (REST or GraphQL)

3. Example mesh.config.yaml for REST API

sources:
  - name: JSONPlaceholder
    handler:
      openapi:
        source: https://jsonplaceholder.typicode.com/swagger.json
serve:
  port: 4000

This configuration:

• Loads the OpenAPI schema from JSONPlaceholder Swagger docs
• Generates GraphQL schemas and resolvers automatically
• Serves the endpoint at http://localhost:4000

4. Run GraphQL Mesh

npx mesh dev

✅ Visit http://localhost:4000 to access GraphiQL.

5. Sample Query

query {
  posts {
    id
    title
    body
  }
}

This fetches posts from JSONPlaceholder’s REST API via the auto-generated GraphQL schema.

🏗️ Architecture Diagram

🔄 TL;DR

GraphQL Mesh simplifies API integration by:

• Generating GraphQL schemas from any data source
• Acting as an API gateway to unify REST, GraphQL, gRPC, and databases
• Eliminating manual resolver complexity

For teams modernising backends or unifying multiple services into a single GraphQL endpoint, GraphQL Mesh offers a practical, production-ready solution.