About this training

A training workshop by Mediacurrent.

Getting Started

This repo will allow you to get the codebase to build a new Gatsby website which has been configured to pull its content from Drupal. Both Gatsby and Drupal run locally.

Requirements

Operating System:

  • macOS 10.13 or later

  • Windows 10 Pro+ or equivalent (eg Windows 10 Enterprise) with Hyper-V running

  • Linux with kernel version 4.x or higher

Software:

Instructions for installing NVM, Node & NPM on macOS or Windows.

1. Clone the repo

You can clone or download the repo anywhere in your computer (i.e. Sites, Downloads, Documents, Desktop, etc.)

git clone git@github.com:mariohernandez/gatsby_training.git

Install Gatsby CLI

Before you can run gatsby commands like gatsby develop, you need to install the Gatsby CLI globally.

  • Open your command line tool like Terminal (macOs), or PowerShell (Windows)

  • Run the following command:

    npm install -g gatsby-cli

3. Build the environments:

  • After cloning the repo, cd into the newly created directory:

NOTE: This is the default directory generated by cloning the repo. If you changed the directory name when cloning the repo, cd into that directory instead.

cd gatsby_training

Start Lando

lando start

This will build your Docker containers needed to run Gatsby and Drupal. NOTE: Docker needs to be running before running lando start.

Start Gatsby

Since Gatsby pulls data from Drupal, Drupal needs to be running by completing the previous step first.

cd gatsby
nvm use

If you get errors, you can try running: nvm install then nvm use. This will use the version of node specified inside .nvmrc

npm install

This will install all of Gatsby/node dependencies.

gatsby develop

This will start Gatsby which should immediately connect to Drupal to pull all content.

4. Access your Gatsby and Drupal sites

Gatsby:

http://localhost:8000/

GraphQL

http://localhost:8000/___graphql

Drupal:

https://nitflex.lndo.site

Login to Drupal: (switch to http if https is not working)

https://nitflex.lndo.site/user/login

Your credentials are: username: admin, password: admin

Last updated

Was this helpful?