React Europe and GraphQL

Recently myself plus a few of the Red Badger team packed our hair curlers and rolled out to Paris on the EuroStar for the React Europe conference hosted in Paris.


Recently myself plus a few of the Red Badger team packed our hair curlers and rolled out to Paris on the EuroStar for the React Europe conference hosted in Paris.

One of the big topics that I and the team were interested in was GraphQL which turns REST on it’s head slightly. Turns out Facebook have been using it for a good few years and Lee Byron has been working on it solidly for a good while.

React Europe Pass React Europe Pass

What is it?

“GraphQL consists of a type system, query language and execution semantics, static validation, and type introspection.”

With this we declare an APIs schema / capabilities (types) up front the API supports in which validation and introspection can be performed. This is coupled with a querying language that allows not only querying of data but also manipulating data using the notion of mutation queries. All this is done via single endpoint rather traditional REST APIs have urls for each resource combined with HTTP verbs and error codes for validation.

If you wish to check out more in regards to the schema and the full capabilities on how you can start creating your own GraphQL APIs Facebook released a draft spec at the conference over at http://facebook.github.io/graphql/. Additionally to this it is exciting to note that Lee Byron built graphql-js https://github.com/graphql/graphql-js/ an implementation as a reference for everyone to start using and hopefully build out GraphQL implementations in other languages.

In the talk at React Europe it really was a shout out to the community to get involved and really evolve GraphQL into something awesome. I really hope this happens it is a fantastic concept especially if you are working on large complex applications with many clients consuming your API or require multiple APIs to be merged into a single data source / API.

So let’s take a look at a simple example to take a look at what is possible. I am currently working on a project that requires some orchestration of Amazon services. So on that note I decided this is perhaps a good place to start to experiment.

AWS with GraphQL

To touch briefly on some the querying power of using GraphQL I decided to start an experiment in wrapping the Amazon AWS Node.js SDK with GraphQL. The main benefits of this is that we can coalesce operations across all of the Amazon services with some awesome GraphQL queries. I don’t really dig into the server code itself but you can take a look on github in how this works.

https://github.com/redbadger/graphql-aws

Querying

Let’s take a really simple query, let’s say we wish to list all of the message queues we have within our Amazon account, the GraphQL query (which are strings) would look something like:

Simple eh!? we can basically send a query of which ever resources we like (that the GraphQL schema has defined / supports) along with the attributes we wish to return to a single endpoint. In this case we just wish to return the url parameter of the queue. Similarly we can then request all of the topic I have within Amazon as below:

As the schema query is aware of both queue and topic types from a single API endpoint this is where the power of querying comes to light. Let’s say that we now want to return both queues and topics but decide that calling them “topics” and “queues” is not what our client prefers. We can use aliases to rename and combine the queries to return the structure of the data you require.

Mutations

Now let’s take a look at mutations, let’s say we now want to create a queue within Amazon in the same light we can create a simple mutation query that accepts arguments, the name of the queue. To create a message queue you simply do the following:

Because a queue is defined as a single type the GraphQL server knows about we can again simply tell GraphQL with attributes we wish to return once the queue is created. Lastly the same combination of multiple queries as above can be applied to mutations. Say I wish to create 2 queues, then 3 topics, check it out!

As you can see this could be quite powerful if you imagine that you could create a queue add permissions, provision servers…. all from describing the Amazon AWS API with GraphQL. I haven't touched on introspection or the awesome validation in this blog, it is more to give you a flavour of the querying power and open the eyes that there is now indeed a nicer alternative to REST.

If you enjoy using the latest tech like GraphQL, get in touch we are always looking for smart people interested in shiny new tech join us.

Similar posts

Are you looking to build a digital capability?