interleap
Published in

interleap

Transform REST to GraphQL: Graphql Mesh

TLDR: Graphql-Mesh allows you to transform existing APIs and datasources like REST, SOAP, or even Database to GraphQL directly without rewriting any of your APIs.

Sometimes, there are REST APIs that you want to translate into GraphQL. It could possibly be for a simple BFF, or maybe we want different clients to have responses in different formats, but don’t want to rewrite the entire API.

How should we do it? One way is doing it manually. It should be really simple. But it’s tedious and repetitive. Which tells us that this should be a job best done using automation.

This is where GraphQL Mesh comes into the picture. GraphQL Mesh allows you to translate APIs from multiple different specs into GraphQL.

Here is a statement from their README —

The goal of GraphQL Mesh is to let developers easily access services that are written in other APIs specs (such as gRPC, OpenAPI/Swagger, OData, SOAP/WSDL, Apache Thrift, Mongoose, PostgreSQL, Neo4j, and also GraphQL) with GraphQL queries and mutations.

Instead of going into any more theory, we’ll start with a practical example.

Installation

  • Create a project folder
  • Initialise an npm project
npm init
  • Add graphql and graphql-mesh dependencies
npm install graphql @graphql-mesh/runtime @graphql-mesh/cli @graphql-mesh/openapi --save

Creating The Mesh Configuration

  1. Add a Graphql Mesh Configuration file under your project root
touch .meshrc.yaml

This configuration file tells Graphql Mesh what sources we’re going to consume.

2. Open .meshrc.yaml using your favourite editor and add the following contents

sources:
- name: Weatherbit.io
handler:
openapi:
source: https://www.weatherbit.io/static/swagger.json
- name: Github
handler:
openapi:
source: https://api.apis.guru/v2/specs/github.com/1.1.4/openapi.yaml

NOTE: By the time you read this blog, APIs Guru might have changed the version of the github open api spec file. So search there for github and copy the url to the OpenAPISpec file.

This adds an Open API spec for Twitter and Weatherbit to the project. GraphQL Mesh should be able to create GraphQL APIs based on this specification.

APIs Guru contains hundreds of Open API Specs for various projects, which you can browse and use.

Run the Project

  • First, use the following command to generate a graphql schema for your OpenAPI spec.
npx graphql-mesh dump-schema --output ./githubweather.graphql

This creates a graphql schema which you can open and verify. Open the schema and search for the following text —

type Query

This will give you a list of all the queries available for you. Some examples that we can see are queries like orgsGet, and getCurrentCityequalToCityCountryCountry. The latter name is auto-generated by Graphql Mesh, and the former is what is given in operationId. So specifying operationId can help you drastically improve the usability of the generated APIs.

  • Run the project
npx graphql-mesh serve
  • Browse to the following URL to explore the project
http://localhost:4000
  • Try viewing some data —
query {
orgsGet(org:"Interleap") {
id
url
}
getCurrentCityequalToCityCountryCountry(city:"Atlanta", country:"US",
key:"<FREE API KEY - REGISTER ONLINE AND PASTE IT HERE>"
) {
data {
cityName
weather {
description
}
temp
}
}
}

This gives you 2 different pieces of data, the Interleap organisation on Github, and the weather in Atlanta.

You can get the API key by registering online. While it says that it takes 30 minutes to provision the key, in reality it just takes 2 minutes.

Summary

This is a really simple example of how we managed to convert 2 different REST APIs into GraphQL. This solves 2 different problems for us — converting REST / DB / Any other Data Source into GraphQL, and second, combining multiple services into one.

This is an introductory example, and GraphQL Mesh allows you to handle far more complex usecases too.

--

--

--

Interleap makes interactive, focused tech courses on niche technologies that help you upskill with the latest technologies and processes. Learn more at https://interleap.co

Recommended from Medium

Feeling handicapped without backend skills ?— Try Firebase!

Can somebody know my IP address if I accept a WhatsApp Voip Call?

csg: subtracting solids in webgl

Native, Hybrid Or Web Apps? Choose the Best for You

OrangeNES Mini — Weekend Project

Explorations in Generative Art

🌀Configuration of docker 🐳using ansible 💻

PHP: A noob explanation for Dependency Injection and DI Container

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Abhinav

Abhinav

Educator, Founder @ Interleap

More from Medium

Database Replication for the developers

Data Modeling for Speed At Scale

(Source: Photo by NASA on Unsplash )

Problem Solving with JavaScript-Part 1 (Anagram)

Anagram strings are two strings built up by the same set of characters, where the order of characters is the only difference in the strings.

Active database and Triggers