Gatsby default starter

A starter for building websites with Pismic and Gatsby

Getting started

Requirements

Create codebase

Click on "Use this repository" button to create your own repository from this template.

Create content in Prismic

  1. Goto Prismic and create an account and repository if you do not already have one.
  2. Copy the subdomain name of the repository to the process.env.PRISMIC_REPO_NAME environment variable. In this example the url.
  3. Create a custom type, by copy the schemas from src/schemas in to the JSON editor and save.
  4. Do this for each of the custom-types in the src/schemas directory then return to the repository dashboard and navigate to content and create some content for each of the custom-types.
  5. Click save -> publish -> publish now.

Preview a release

  1. Select some content to edit and make a change and click save -> publish -> publish it during a release
  2. This will walk you though creating a new release.
  3. Once the release is created go back to the repository dashboard and click on the name of the release name in the top bar navigation.
  4. The release id can now be found in the url. in this example the release-id is XtdZ4BIAACMANi0x.
  5. Add this id to the environment variables in gatsby-config.js as process.env.PRISMIC_RELEASE_ID.
  6. Create a preview in Prismic settings -> previews -> create a preview set the name to local-release the domain to http://localhost:8000 and set the preview path to /previews.
  7. Add this preview path to gatsby-config.js as process.env.PRISMIC_PREVIEW_PATH.
  8. To see the preview build run GATSBY_CLOUD=true npm start

Gatsby cloud

  1. Go to gatsby.com and log-in with github and select create a new site.
  2. Select I have a gatsby site.
  3. Select the repository that this template has been used in.
  4. For integrations choose skip this step.
  5. Set the environment variables in gatsby cloud.
  6. Click save and create site

Webhooks

Create two webhooks one for gatsby's production build and preview builds in prismic by following the prismic user guide and the urls that can be found for the project on gatsby.com underneath _site settings -> webhooks,