aruuska / gatsby-workshop Goto Github PK

This repository contains a demo gatsby site built for the "The great drupal + gatsby workflow" workshop held at Mountain Drupalcamp 2019 in Davos Switzerland.

Please note : The master branch is the starting point and does not have anything apart from the standard Gatsby setup. Progress through the branches to see stuff happening:

1. step-1 Adds the drupal gatsby source plugin: you will start seeing the drupal data in your grapiql playground.
2. step-2 Add a StaticQuery component to display a list of the recipes from drupal on the index page.
3. step-3 Adds a page for each recipe using gatsby's node api and links to the recipes from the index page
4. step-4 Adds CSS and Gatsby images for each recipe.

Checkout the production branch to see the "finished" product, or follow along by checking out the step-* branches.

1. Check out the gatsby's official guide to set up your local environment (git and Node.js)

2. Clone this repository

   git clone https://github.com/wunderio/gatsby-workshop.git
   

3. Start developing.

   Navigate into your new site’s directory and start it up. please note: We are using npm not yarn in this example.

   cd gatsby-workshop/
   npm install
   npm run develop
   

4. Open the source code and start editing!

   Your site is now running at http://localhost:8000!

   Note: You'll also see a second link: http://localhost:8000/___graphql. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.

   Open the gatsby-workshop directory in your code editor of choice and edit src/pages/index.js. Save your changes and the browser will update in real time!