next-graphql

next-graphql is an easy to use Next.js library for creating performant GraphQL endpoints on top of Next.js API Routes.

Start building GraphQL servers with Next.js.

Features

• built using Envelop and Helix - stackable and easy to extend architecture
• supports Vercel Edge functions

Install

npm install next-graphql

pnpm add next-graphql

yarn add next-graphql

Usage

next-graphql uses Next.js API Routes. Create the pages/api/graphql.js with the following content:

with graphql

import { createGraphQLHandler } from "next-graphql";
import {
  GraphQLObjectType,
  GraphQLSchema,
  GraphQLString,
} from "graphql";

const schema = new GraphQLSchema({
  query: new GraphQLObjectType({
    name: "Query",
    fields: () => ({
      hello: {
        type: GraphQLString,
        resolve: () => "world",
      },
    }),
  }),
});

const handler = createGraphQLHandler({ schema });
export default handler;

with @graphql-tools

Add @graphql-tools/schema

pnpm add @graphql-tools/schema

In pages/api/graphql.ts define your handler as shown below:

import { createGraphQLHandler } from "next-graphql";
import { makeExecutableSchema } from "@graphql-tools/schema";

export const schema = makeExecutableSchema({
  typeDefs: /* GraphQL */ `
    type Query {
      hello: String!
    }
  `,
  resolvers: {
    Query: {
      hello: () => 'World',
    },
  },
});

const handler = createGraphQLHandler({ schema });
export default handler;

with Pothos