gatsby-theme-prismic-starter

    0.1.0 • Public • Published

    🌈 gatsby-theme-prismic-starter

    ⚠️ Gatsby Themes are currently experimental ⚠️

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

    License: MIT npm version


    🚀 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

    Install

    npm i gatsby-theme-prismic-starter

    DownloadsWeekly Downloads

    10

    Version

    0.1.0

    License

    MIT

    Unpacked Size

    36.1 kB

    Total Files

    12

    Last publish

    Collaborators

    • kozo