menu
announcement

Spectrum is now read-only. Learn more about the decision in our official announcement.

gatsby-drupal-wg

Gatsby Working Group: Drupal - Drupal module: https://www.drupal.org/project/gatsby - Gatsby source plugin: https://www.gatsbyjs.org/packages/gatsby-source-drupal/

Channels
Team

Preview, limited testing available to the WG

June 10, 2019 at 1:35pm

Preview, limited testing available to the WG

June 10, 2019 at 1:35pm

How to get started with the Drupal + Gatsby preview

You will need to sign up for a gatsby cloud preview beta account, so this is a meta beta. More information on the gatsby blog.
The gatsby source plugin is available on npm under the package name gatsby-source-drupal-preview. Setup is exactly the same as the Drupal source plugin, however, you now have a preview flag to turn on in the options object:
module.exports = {
plugins: [
{
resolve: `gatsby-source-drupal-preview`,
options: {
baseUrl: `...`,
preview: true
}
}
]
};
Once that flag is turned on the gatsby plugin is now listening for changes at a specific URL. In your gatsby cloud instance, you'll need to copy the preview URL. Once you have that, the Gatsby side is set up to receive updates.
First things first, in your Drupal instance enable JSON API. Then get the Gatsby Preview module at this link on drupal.org.
Install it and enable it on your Drupal instance. Configuring the Drupal module is straightforward, under ‘Configuration > System’ you now have the option for ‘Gatsby Live Preview Settings’. The URL you copied earlier can be pasted into the ‘Gastby Preview Server URL’ and give that a save.
Now you're all set up to use preview! Make a change to your content, press save (keystroke by keystroke updates are not available yet), and watch as Gatsby updates before Drupal even notifies you that your changes have been saved.

June 10, 2019 at 1:54pm