🌈 gatsby-theme-prismic-starter

⚠️ Gatsby Themes are currently experimental ⚠️

A Gatsby Starter Theme with Headless CMS Prismic. Based on gatsby-starter-default.

🚀 Instructions

Quick Start

1. Create a directory for your new website

2. Initialize your package.json with yarn init

3. Install gatsby, react, react-dom and the theme yarn add gatsby react react-dom gatsby-theme-prismic-starter

4. Add a gatsby-config.js file to activate and controll the theme:

   module.exports = {
   __experimentalThemes: [
    {
      resolve: "gatsby-theme-prismic-starter",
      options: {
        // SITE METADATA
        siteUrl: "http://localhost:8000/", // Important for gatsby-plugin-sitemap
        title: "gatsby-theme-prismic-starter",
        author: "Dennis Kossowski",
        description: "A GatsbyJS Theme With Headless CMS Prismic.",
   
        // MANIFEST OPTIONS
        name: "Gatsby Theme Prismic Starter",
        short_name: "Prismic Theme",
        start_url: "/",
        background_color: "#663399",
        theme_color: "#663399",
        display: "minimal-ui",
        // icon: `src/images/gatsby-icon.png`,
   
        // PRISMIC OPTIONS
        repositoryName: "your-prismic-repository-name",
        // It's highly recommended to define your Prismic API access token trough a .env file
        // Just create a .env in your root directory with following content: "API_KEY="your-key-here"
        // If you want to define the access token in this options you can do it (at your own risk):
        //accessToken: "your-access-token",
   
        // TYPOGRAPHY OPTIONS
        // To configure your own typography just add a "config" directory with typography.js
        // pathToConfigModule: "config/typography.js"
      }
    }
    ]};

5. run gatsby develop and build your site!

After you started the develop server, open localhost:8000/ for further information how this theme works!

🤔 What's inside

Dependencies:

• @emotion/core
• @emotion/styled
• emotion-theming
• gatsby-plugin-emotion
• @mdx-js/mdx
• @mdx-js/react
• @mdx-js/tag
• dotenv
• gatsby-image
• gatsby-plugin-compile-es6-packages
• gatsby-plugin-manifest
• gatsby-plugin-page-creator
• gatsby-plugin-react-helmet
• gatsby-plugin-sharp
• gatsby-plugin-sitemap
• gatsby-plugin-typography
• gatsby-source-filesystem
• gatsby-source-prismic
• gatsby-transformer-sharp
• mkdirp
• prop-types
• react-helmet
• react-typography
• typography

emotion for styling typography for easy font-theming gatsby-plugin-sitemap for sitemap support mdx-plugin for JSX in Markdown gatsby-source-prismic for pulling data into Gatsby from prismic.io repositories

Components:

• seo.js

Include the SEO component import { SEO } from 'gatsby-theme-prismic-starter'

🔄 Changelog

All notable changes to this project will be documented in this file.

[0.1.0] – 2019-05-03

⚠️ Removed

Dependencies:

• @fortawesome/fontawesome-svg-core
• @fortawesome/free-solid-svg-icons
• @fortawesome/react-fontawesome
• gatsby-plugin-netlify
• react-grid-system

Removed this packages to make the theme more flexible if you want to use other similar dependencies.

If you have used this packages just reinstall them in your project.

[0.0.8] – 2019-05-01

Added

• NEW: mdx support ✨ Just add a .mdx file in your pages folder