Skip to main content

Getting Started

GraphQL is a query language for APIs which can be consumed over http. In contrast to "normal REST API", with GraphQL a client has the ability to ask for exactly the data it needs. Just think of an API which has to serve to multiple types of clients, like web and mobile. As you usually have a larger screen size available on the web you might want to show more information than on the mobile version of your app.

Also with GraphQL data is represented as a graph (objects with relations) as opposed to the traditional (isolated) resource. You can use GraphQL with any kind of database (graph, document or relational). Another positive feature of GraphQL is that it comes with an always up-to-date documentation (schema) out-of-the-box so you don't have to create, maintain and host a swagger for example. For all these reasons GraphQL gets more and more popular these days (see [1]).

Note: GraphQL is a specification and not tied to any backend or frontend technology or framework.

To get started, all you need is a GraphQL server like Apollo Server or GraphQL Yoga and a GraphQL client, like Apollo Client, Relay or Urql. The GraphQL server can be understood as a GraphQL runtime which enables the client to query for data with the GraphQL query language. So the GraphQL server knows how to resolve the client's query and respond with the desired data.

Note: GraphQL Yoga seems not to be maintained anymore.

My setup would be Apollo Server with Apollo Client or Urql and for sure Prisma 2 as next-gen ORM. Apollo Client is more popular (see [2]) than Relay, probably because it is not opinionated, hence more flexible. And Prisma boosts your productivity.

Intro

GraphQL was developed internally by Facebook in 2012 before being publicly released in 2015 (see [3]). It supports reading, writing (mutating), and subscribing to changes to data and is available for multiple languages. Specifications are located here; latest is from June 2018.

The biggest difference between this approach of fetching data is that the client has full control over the data that gets returned, as opposed to the traditional REST API approach. So whenever the client needs a different set of data all you need to do is to adjust the query (given the data is available on the server-side).

Also, the clients are extremely powerful, e.g. they can cache your data automatically and provide you with the error and loading state out of the box, so that you don't have to manually write boilerplate code to track that. So you get (remote) state management out of the box, but can also manage you local state as well. The Apollo Client is really super convenient to use and will make your application less complex.

You can easily integrate GraphQL with express.

GraphQL Playground

If you want a quick taste of GraphQL then either get the app (e.g. for MacOs run: brew cask install graphql-playground) or go to the web version. It is kind of the pendant to Postman.

References

  1. npm trends - axios vs apollo
  2. npm trends - apollo vs relay
  3. Wikipedia