🌈 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
-
Create a directory for your new website
-
Initialize your package.json with
yarn init
-
Install gatsby, react, react-dom and the theme
yarn add gatsby react react-dom gatsby-theme-prismic-starter
-
Add a
gatsby-config.js
file to activate and controll the theme:module.exports = {__experimentalThemes: [{resolve: "gatsby-theme-prismic-starter",options: {// SITE METADATAsiteUrl: "http://localhost:8000/", // Important for gatsby-plugin-sitemaptitle: "gatsby-theme-prismic-starter",author: "Dennis Kossowski",description: "A GatsbyJS Theme With Headless CMS Prismic.",// MANIFEST OPTIONSname: "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 OPTIONSrepositoryName: "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"}}]}; -
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