Top 5 GraphQL Tools at GraphQL Europe

GraphQL has grown a lot as a technology since it was released in 2015, and at the moment of writing this article, it has been adapted in 20 different programming languages and has been used in production by many companies across the world.

If you want to know why this has happened, you can read a short explanation why Github decided to move to GraphQL and read our in-depth article on the topic here.

With the rapid growth of GraphQL, the first worldwide events dedicated to the technology became only a matter of time. On 21 May 2017, Europe’s GraphQL very first conference took place, and I just had to attend it to see how the community is developing best practices around this specification. One of the most common topics mentioned by GraphQL Europe’s speakers were the tools used for such purposes as, for example, enhancing API development process. Here are five of the tools mentioned at GraphQL Europe that you probably don’t want to miss.

Apollo Launchpad

Apollo Launchpad is a next-generation tool for presenting GraphQL code in very accessible, easy to reason about way. It had been released only a week before this article was written, and it is basically Codepen or JS Bin for Node.js-based GraphQL APIs. Here is Apollo Launchpad’s description from its creators’ blog: “Launchpad is an in-browser GraphQL server playground. You can write a GraphQL schema example in JavaScript, and instantly create a serverless, publicly-accessible GraphQL endpoint”. Apollo Launchpad uses GraphiQL IDE for API testing. I made an example using it by recreating our Getting Starter with GraphQL and Node.js Made Simple tutorial.

GraphQL schema tested in the browser using Apollo Launchpad.

Source: https://launchpad.graphql.com/4nqqqmr19

My Apollo Launchpad demo has been featured in awesome-launchpad, and you can see how easy it is to use Launchpad.

Apollo Optics

Apollo Optics was made to allow analyzing GraphQL APIs performance in a consistent way. It provides a high-level understanding of how an API is used, which fields require optimizations and how performance trends look like. One of GraphQL Europe speakers Brooks Swinnerton said that Github will be using Apollo Optics to provide metrics for Github’s GraphQL API.

Example optics visualization of performance distribution. Source: http://www.apollodata.com/optics/

GraphQL Voyager

GraphQL Voyager takes documenting API to a whole new level. It uses a GraphQL schema to present data structure in a form of interactive graph. It requires no setup before use nor any specific programming language, because it works on any GraphQL API. GraphQL Voyager sports an interface that is incredibly easy to use. It provides information about field types, their descriptions, and connections, facilitating high-level analysis of graph data.

Visual Representation Of Our GraphQL Profile API.

Graphcool

Graphcool is the platform for creating production ready GraphQL backends. It has a user-friendly and feature-rich console for designing schema. It is integrated with services such as Auth0 and AWS Lambda and supports subscriptions out of the box.

Editing schema using Graphcool’s console.

Graphcool creators made many tutorials showing how to use a GraphQL backend on top of many frontend frameworks such as React or Angular. This makes getting an application up and running really easy and cheap, and it might even be used just for providing a prototype of the backend in an early development phase. GraphQL is free to use during development, and its cost is eventually calculated based on the amount of requests made against the API.

GraphiQL

The last tool on our list also happens to be the most popular one. GraphiQL is a free, easy to use React-based IDE for testing and documenting GraphQL APIs. GraphiQL allows its users to test and present GraphQL APIs by providing a graphic interface that facilitates performing queries and mutations. There’s more to GraphiQL, though! It uses schema to provide information about data structure and types, and it also supports autocompletion. This open-source tool was quickly noticed by Facebook and is now mainly developed by Lee Byron, one of GraphQL’s co-creators and the main creator of Immutable.js.

Wrapping up

When you are reading this, even more amazing tools will have been under serious development, and we should note two especially interesting services: GraphQL Language Service, which provides an interface for building GraphQL language services for IDEs, and GraphQL Lodash, which allows performing Lodash data manipulations inside queries. Even Daniel Schafer, one of Facebook’s developers responsible for creating GraphQL, admitted they didn’t know how would their technology grow or what would tooling for it look like. One thing is certain: GraphQL has gained serious traction, and it will be interesting to see how it will have evolved by GraphQL Europe 2018.