Dipping my toes in Drupal GraphQL

Pasan Gamage
3 min readMar 31, 2022

--

Introduction

GraphQL is a new topic for me. I started to work and learn as I go about it just an over a week ago. And as I work with it, I got the opportunity to understand how it works internally.

In this blog post I’m going to share my learning experience with you so that we can build a conversation around what to follow and what to avoid.

What is GraphQL

Before we start, I will try to explain what is GraphQL in the simplest possible way. It is a query language that lets you expose data out of a system (in this case Drupal) in JSON format.

There are a lot of online material out there in case you are interested to expand your knowledge. I will list a few at the end of the post.

Let's get started,

Planning the steps

First thing is to understand the components.

The best way to do this is to work with what we already have; which is the graphql contrib module code repository.

In Drupal, if we want to customise something, we need to get it done through a custom module. And the Drupal graphql contrib module generously included some examples for us — in which I had a hard time to understand. And that’s why putting extra time and effort to read other material in important.

https://github.com/drupal-graphql/graphql/tree/8.x-4.x/examples

There are 3 main parts to GraphQL processing

graphqls

As you can see in the module, you need to follow specific folder structures and file extensions to build the query you want.

In this case, app/modules/contrib/graphql/examples/graphql_example/graphql folder contains the graphqls files.

Example snippet;

type MyContentType implements Node {
projectArea: ProjectArea
}
type ProjectArea implements Paragraph {
id: Int!
type: String!
geoShapeData: [String]
shapeFile: File
}
type File {
id: Int!
type: String
url: String!
fullUrl: String!
uri: String!
size: String
mimetype: String
}

You may notice the use of some special characters, such as ! And []

These in order indicates a required field and an array.

The above snippet is from a bit of an advance use case. But we will discuss it in detail in a following post.

These .graphqls contains the data structure in which we want to expose the data. Defining the data structure here will let you explore it in the Admin UI under http://example.com/admin/config/graphql/servers/manage/default/explorer

DataProducers

At this point, GraphQL do not know how to match and resolve the data for the above fields. And that’s where the data producers come in. Below are some build in data producers that will help you to understand their capabilities and use.

https://github.com/drupal-graphql/graphql/tree/8.x-4.x/src/Plugin/GraphQL/DataProducer

Schemas

And going over the example module, we can see that we are going to need a Schema to resolve the data and map it to the field names defined in the .graphqls files.

https://github.com/drupal-graphql/graphql/blob/8.x-4.x/examples/graphql_example/src/Plugin/GraphQL/Schema/ExampleSchema.php

TBH GraphQL can be quite intimidating, but it will get to be more familiar the more you try to use it.

Useful Resources

https://drupal-graphql.gitbook.io/graphql/

https://www.drupal.org/docs/8/modules/graphql/other-resources

https://github.com/drupal-graphql/graphql

--

--

Pasan Gamage
Pasan Gamage

Written by Pasan Gamage

Backend Developer | Motorbike enthusiast

No responses yet