Gatsby Cockpit Advanced Layout

Example project to use Cockpit layout field with custom components in Gatsby. You can find some more on my Medium Post based on this project.

The Scope

• GatsbyJS: a Blazing-fast static site generator for React
• Cockpit Headless CMS: a self-hosted headless and api-driven CMS
• The Project: a simple portfolio page with pages and projects.

For an overview of the project structure please refer to the Gatsby documentation - Building with Components.

Cockpit

1. Run a PHP server on the cockpit folder.
2. Go to http://localhost/install (if Cockpit is running on localhost)
3. Generate a new API Key
4. Replace the API Key to gatsby-config.js

Website

Installation

npm install

Development

npm run develop

Production

npm run build