Step 1 — Create an Apollo GraphQL server
Apollo is an open source framework for GraphQL, we are using Apollo 2.0 in this tutorial.
This is directly from their tutorial:
Step 1: NPM init
First, create a folder called graphql-server-example
using the mkdir
command.
mkdir graphql-server-example
Enter the directory, so the remaining work will take place within that directory.
cd graphql-server-example
Initialize the new directory as a Node.js project using the Node.js package manager, npm
.
npm init --yes
Step 2: NPM Install
Install dependencies:
npm install --save apollo-server graphql
Step 3: Create the server
Create an index.js file in the root directory and copy and paste this code into it:
const { ApolloServer, gql } = require('apollo-server');
// This is a (sample) collection of books we'll be able to query
// the GraphQL server for. A more complete example might fetch
// from an existing data source like a REST API or database.
const books = [
{
title: 'Harry Potter and the Chamber of Secrets',
author: 'J.K. Rowling',
},
{
title: 'Jurassic Park',
author: 'Michael Crichton',
},
];
// Type definitions define the "shape" of your data and specify
// which ways the data can be fetched from the GraphQL server.
const typeDefs = gql`
# Comments in GraphQL are defined with the hash (#) symbol.
# This "Book" type can be used in other type declarations.
type Book {
title: String
author: String
}
# The "Query" type is the root of all GraphQL queries.
# (A "Mutation" type will be covered later on.)
type Query {
books: [Book]
}
`;
// Resolvers define the technique for fetching the types in the
// schema. We'll retrieve books from the "books" array above.
const resolvers = {
Query: {
books: () => books,
},
};
// In the most basic sense, the ApolloServer can be started
// by passing type definitions (typeDefs) and the resolvers
// responsible for fetching the data for those types.
const server = new ApolloServer({ typeDefs, resolvers });
// This `listen` method launches a web-server. Existing apps
// can utilize middleware options, which we'll discuss later.
server.listen().then(({ url }) => {
console.log(`🚀 Server ready at ${url}`);
});
Step 4: Start the server
Enter the following in your terminal to start the server:
node index.js
You should see the following:
🚀 Server ready at http://localhost:4000/
Open up your browser and go to the following url: http://localhost:4000/:
You should see the following ‘Playground’ app in your browser.
Using the GraphQL Playground
- The request (on the left)
- The response (on the right)
- The documentation (available using the green “SCHEMA” button on the far right side)
Copy and paste the following into the left hand side of the playground and click the play button.
{
books {
title
author
}
}
You should see the following results in the GraphQL Playground window.
If you click on the green ‘schema’ button on the right you can see the schema in this example:
Schema Definition Language
To make it easy to understand the capabilities of a server, GraphQL implements a human-readable schema syntax known as its Schema Definition Language, or “SDL”. The SDL is used to express the types available within a schema and how those types relate to each other.
type Book {
title: String
author: Author
}
type Author {
name: String
books: [Book]
}
We can define multiple independent queries which are available on a server:
type Query {
getBooks: [Book]
getAuthors: [Author]
}
In this Query
type, we define two types of queries which are available on this GraphQL server:
getBooks
: which returns a list ofBook
objects.getAuthors
: which returns a list ofAuthor
objects.
Customizing our GraphQL Apollo server for JSON-AI
Step 1: create objects
var agents = [
{
id: "Apollo",
description: "JSON-AI Server",
request: {
timestamp: "Nov 3 2018",
url:"localhost:8001",
method:"GraphQL",
query:"/api",
data: "JSON goes here"
}
}
];
Step 2: Define the typeDefs using SDL
const typeDefs = gql` type Query {
agents: [Agent]
} type Agent {
id: String!
description: String!
request: Request
}
type Request {
timestamp: String
url: String
method: String
query: String
data: String
}`;
Step 3: Verify in GraphQL Playground
Congratulations! You have successfully created an Apollo server and added custom fields which you can now query.