After using GraphQL’s BFF for microservices, let’s look at how to build a GraphQL server

1. Environmental

Node.js is installed on your system

2. Create a directory

mkdir graphql-server
Copy the code

3. Install the server environment

3.1 Build package.json file

Then go to the root of your project and run the following command to quickly build the package.json file.

graphql-server> npm init -y Wrote to ... \graphql-server\package.json: {"name": "graphql-server"."version": "1.0.0"."description": ""."main": "index.js"."scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": []."author": ""."license": "ISC"
}
Copy the code

3.2 Installing three NPM Software Packages

  • Express: Create a simple Node.js server
  • GraphQL: Node.js GraphQL server library
  • Express-graphql: Express middleware for creating GraphQL servers

Run the following command to install these packages together.

graphql-server> npm install express graphql express-graphql npm notice created a lockfile as package-lock.json. You Should commit this file. NPM WARN [email protected] No description NPM WARN [email protected] No repository field. + [email protected] + [email protected] + [email protected] added 58 packages from 37 ficOL3 and Audited 58 packagesin3.85 s found vulnerabilitiesCopy the code

4. After installation, build the GraphQL server

4.1 Create a file named data.js in the root directory

First, create a static data store and export it. Create a file named data.js in the root directory of your project and paste the following code:

/* data.js */

const Users = [
  {
    id: 1.name: "Fikayo Adepoju".email: "[email protected]".posts: [{id: 1.title: "Debugging an Ionic Android App Using Chrome Dev Tools".published: true.link:
          "https://medium.com/@coderonfleek/debugging-an-ionic-android-app-using-chrome-dev-tools-6e139b79e8d2".author: 1
      },
      {
        id: 2.title: "Hosting a Laravel Application on Azure Web App".published: true.link:
          "https://medium.com/@coderonfleek/hosting-a-laravel-application-on-azure-web-app-b55e12514c46".author: 1}]}, {id: 3.name: "Jane Paul".email: "[email protected]".posts: []}];module.exports = {
  Users
};
Copy the code

This file exports a collection of user data and articles for each user.

4.2 Create a file named schema.js in the root directory

The architecture is then built and exported. Create a file named schema.js in the root directory of your project and paste the following code:

/* schema.js */

const { buildSchema } = require("graphql");

const schema = buildSchema(` type Query { users: [User!] ! , user(id: Int!) : User! } type User { id: ID! name: String! email: String posts: [Post!]  } type Post { id: ID! title: String! published: Boolean! link: String author: User! } `);

module.exports = schema;
Copy the code

This file uses the buildSchema method in node.js’s GraphQL library to set the schema. Create two custom types, user and publication, to expose the user and the user query point in the query definition.

4.3 Create a file named resolvers. Js in the root directory

Next, create a parser to handle these queries. Create a file called resolvers.js in the root directory of your project and paste the following code:

/* resolvers.js*/

const {Users} = require('./data')

const resolvers = {
  users: async(_) = > {return Users;
  },
  user: async ({ id }, context) => {
    return Users.find((user) = > user.id == id)
  }
};

module.exports = resolvers;
Copy the code

This file imports the Users collection from data.js and then returns the appropriate data to the user and the parser at the user’s query point.

Then connect the schema to the parser and expose the GraphQL endpoint.

4.4 Create a file named index.js in the root directory

Create a file named index.js in the root directory of your project and paste the following code:

/* index.js */

const express = require("express");
const graphqlHTTP = require("express-graphql").graphqlHTTP;
const schema = require("./schema");
const resolvers = require("./resolvers");


const app = express();

app.use(
  "/graphql",
  graphqlHTTP({
    schema,
    rootValue: resolvers,
    graphiql: true}));const port = process.env.PORT || 4200;

app.listen(port);

console.log(` 🚀 Server ready ` at http://localhost:4200/graphql);
Copy the code

This file creates an ExpressJS application, connects the schema to the parser using the Express-GraphQL middleware package, and then exposes the GraphQL API on the endpoint/GraphQL.

Set the third parameter graphiQL to true. You can use this tool with GraphiQL. GraphiQL (did you notice the inclusion of I) is the Web-based GUI for testing GraphQL queries. The tool is included in the GraphQL package.

Finally, configure the server to listen on port 4200.

5 Run the GraphQL server

After completing the steps so far, it’s time to run the GraphQL server. Start the server by running the following command in the root directory of your project

Node index. Js � Server ready at http://localhost:4200/graphqlCopy the code