Gatsby Book Launch

“The missing guide to the modern web” launches on Thursday, Sep 29th: Modular: The Web’s New Architecture

ContactSign Up for Free
Community Plugin
View plugin on GitHub

A Gatsby theme for creating prototypes

Quick Start

mkdir my-site
cd my-site
yarn init
# install @scalble-design/gatsby-theme-prototype and it's dependencies
yarn add gatsby react react-dom @jonrirothwell/gatsby-theme-prototype

Then add the theme to your gatsby-config.js. We’ll use the long-form here for educational purposes.

module.exports = {
  plugins: [
    {
      resolve: '@jonrirothwell/gatsby-theme-prototype',
      options: {},
    },
  ],
};

That’s it, you can now run your gatsby site using

yarn gatsby develop

Note that this site doesn’t do anything, so you’re seeing a missing resources error. Create a simple page in src/pages/index.js to see a page on the root url.

import React from 'react';

export default function Home() {
  return <div>My Site!</div>;
}

Doing more with themes

You can use this as a place to start when developing themes. I generally suggest using yarn workspaces like the gatsby-theme-examples repo does, but using yarn link or npm link is a viable alternative if you’re not familiar with workspaces.

© 2022 Gatsby, Inc.