Gatsby Source Keep It Simple Plugin

Gatsby source plugin for building websites using Keep It Simple as a data source.

Installation

Install plugin with:

  yarn add gatsby-source-keepitsimple

or

  npm i gatsby-source-keepitsimple

Plugin Reference

Plugin options

| Options | Type | Description | | :------- | :------- | :------------------------------------------------ | | prefix | string | Required. Your Keep It Simple project prefix. |

Example

module.exports = {
  plugins: [
    // other gatsby plugins
    // ...
    {
      resolve: "gatsby-source-keepitsimple",
      options: {
        prefix: "your-project-prefix",
      },
    },
  ],
};

Peer Dependencies

• gatsby
• gatsby-plugin-image
• gatsby-source-filesystem

Usage/Examples

How to query keep it simple cms project Pages data:

import { useStaticQuery, graphql } from "gatsby";

export const useKisLandingPageData = () => {
  const { data } = useStaticQuery(graphql`
    query MyQuery {
      data: kisLandingPagePage {
        header {
          headline {
            html
          }
          image {
            alt
            image {
              childImageSharp {
                gatsbyImageData
              }
            }
          }
        }
        ...
      }
    }
  `);

  return data;
};

How to query keep it simple cms project Data Type data:

import { useStaticQuery, graphql } from "gatsby";

export const useKisBlogPostArticlesData = () => {
  const { data } = useStaticQuery(graphql`
    query {
      data: allKisBlogArticles {
        nodes {
          author
          brief_description
          caption
          cover_image {
            alt
            image {
              childImageSharp {
                gatsbyImageData
              }
            }
          }
          date
          full_description {
            html
          }
          headline
          slug
        }
      }
    }
  `);

  return data.nodes;
};

Publishing to npm

1. Run yarn changeset and include the packages that you want to include in this new changeset.

2. Run yarn changeset version to bump the packages version numbers & update each corresponding CHANGELOGS.

3. You can now commit your changes.

4. Run yarn changeset publish to publish the changed packages to npm.

5. Debug any issues that occur during publising

Author

The Puzzlers - [email protected]