Skip to main content

Quick Start

This guide will walk you through setting up Grats in a new project.

Install dependencies

Grats can be used with many different GraphQL servers, but this example uses graphql-yoga.

npm install graphql-yoga
npm install --dev typescript @types/node grats

Initialize TypeScript

Create a tsconfig.json in your project root. Note that this config file also contains your Grats config:

/tsconfig.json
{
"grats": {
// See Configuration for all available options
},
"compilerOptions": {
"strictNullChecks": true,
"module": "NodeNext"
}
}

Create your server

/server.ts
import { createServer } from "node:http";
import { createYoga } from "graphql-yoga";
import { getSchema } from "./schema"; // Will be generated by Grats

/** @gqlType */
type Query = unknown;

/** @gqlField */
export function hello(_: Query): string {
return "Hello world!";
}

const yoga = createYoga({ schema: getSchema() });
const server = createServer(yoga);

server.listen(4000, () => {
console.log("Running a GraphQL API server at http://localhost:4000/graphql");
});

Build your schema

Next we run Grats to generate our schema. This will create our ./schema.ts and ./schema.graphql files.

npx grats

Start your server

# Build your project
npx tsc
# Run your server. NOTE: This is the generated `.js` file adjacent to your `.ts` file.
node ./server.js

Execute a query

You should now be able to visit http://localhost:4000/graphql and see the GraphiQL interface! Try running a query:

query MyQuery {
hello
}

You should see the following response:

{
"data": {
"hello": "Hello world!"
}
}

Success!

If you get stuck while getting started, you can check out our example projects for working examples. If that doesn't get you unstuck, stop by our Discord server to ask for help! We're happy to help you get started.

You can also check out this video in which Michael Staib from ChilliCream sets up a new Grats project:

Next steps

Once you have Grats working in your code, you can:

  • Learn about all the docblock tags that Grats supports in Docblock Tags.
  • Read about Configuration to learn about all the configuration options available to you.
  • Read about Workflows to learn how to integrate Grats into your development workflows.