Skip to content

A public repo to be used during Gatsby workshop.

License

Notifications You must be signed in to change notification settings

senadmaljici/gatsby-workshop

 
 

Repository files navigation

👋 Welcome!

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.

🚀 Quick start

  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!

About

A public repo to be used during Gatsby workshop.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • CSS 59.6%
  • JavaScript 40.4%