A next-generation tool to create blazing-fast documentation sites
API
created:8/18/2020
,
updated:8/18/2020

Below, we go over how to add a component-controls documentation site to both new and existing gatsby projects.

You can find a git repo and a live site.

New project

Create a new folder:

mkdir my-gatsby-project && cd my-gatsby-project

Initialize the project:

yarn init

Add gatsby and its dependencies:

yarn add gatsby react react-dom

package.json

"scripts": {
"build": "gatsby build",
"start": "gatsby develop"
},

The remaining steps are the same as for an existing gatsby project.

Existing Gatsby project

Add component-controls theme

yarn add @component-controls/gatsby-theme-stories

Configure theme

Create a gatsby-config.js file in your project's home directory:

gatsby-config.js

module.exports = {
plugins: [
{
resolve: '@component-controls/gatsby-theme-stories',
options: {
configPath: '.config',
},
},
],
};

Create your documentation site

Check our create a documentation site tutorial