Skip to main content

DatoCMS

DatoCMS provides the Content Delivery API, giving you access to all the content & media hosted on the platform. This is a perfect use case of schema stitching, where we merge in their GraphQL schema into our own Gateway schema, and automatically delegate the resolution of DatoCMS provided operations to their API.

However, there a few points of customization on this process, and this article will address those.

Codegen​

Usually, GraphQL codegen tools are set in a way that they directly connect to external schemas for inference. The downsides of these are:

  • Editor tools have to keep fetching the schema for updates on the background;
  • The schema becomes a bit abstracted from the developers, as it's not found in code;
  • At any time, their APIs might be offline, and thus break our development/delivery workflows.

To circumvent these issues, we early import their schema manually into the ./datocms.graphql file, making it locally accessible for all codegen based operations.

In the application's scripts, you'll find one called codegen:graphql:dato. This script is responsible for introspecting the external DatoCMS schema and updating the aformentioned local file. Any time we have modifications to DatoCMS models, this script should be executed prior to consuming the new data.

This process is controlled by the graphql.config.datocms.js configuration file.

Executor​

As DatoCMS provides a fully available GraphQL API, the executor makes use of a linkToExecutor method provided by the @graphql-tools/links package to convert an Apollo Link into a remote schema executor function. The link itself is a simple HTTP link – connects to a URL, with some header credentials.

Config​

As both the code generation and the executor make use of the same credentials to connect to DatoCMS API, and as the code generation is executed outside the bundling context (Babel/Webpack/TypeScript), the ./config.js file that describes the URL and authorization headers is written in plain JavaScript.