gatsby-theme-prismic-starter v0.1.0
🌈 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 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" } } ]};
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 stylingtypography
for easy font-theminggatsby-plugin-sitemap
for sitemap supportmdx-plugin
for JSX in Markdowngatsby-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