We delved into the intricacies of building GraphQL APIs in the preceding chapters. To complement that knowledge, we now discuss how to consume a GraphQL API in diverse contexts. Commonly, a GraphQL API — or any API for that matter — is accessed by another server (e.g., for inter-service communication), a client-side application (e.g., for user-facing services), or server-side-rendered applications (e.g., web frameworks that facilitate backend rendering).
In this comprehensive lesson, we will uncover various techniques to consume a GraphQL API effectively. We will explore several popular options, such as simple fetch, URQL, Apollo Client, and Relay. By closely examining each alternative, we will weigh their advantages, disadvantages, and how they stack up against one another.
A GraphQL API is generally served through HTTP methods. That means, consuming a GraphQL API is as simple as a POST
request (with correct data passed, of course). Technically, some parts of a GraphQL API can be accessed through GET
requests as well. However, it is not as common to do so since it comes with suboptimal developer experience (e.g. the query needs to be in the query parameter) and limitations (e.g. we can't use variables or even mutations, only queries).
1. The simple but mighty Fetch
Thus, the most straightforward but really powerful way to consume a GraphQL API is doing a network call, for example, by using the fetch
API in JavaScript: