https://github.com/irangarcia/graphcms-blog

https://github.com/irangarcia/graphcms-blog

Last synced: 9 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/irangarcia/graphcms-blog
• Owner: irangarcia
• License: 0bsd
• Created: 2022-02-17T02:26:08.000Z (almost 3 years ago)
• Default Branch: master
• Last Pushed: 2022-02-17T02:28:26.000Z (almost 3 years ago)
• Last Synced: 2024-11-16T07:16:52.237Z (2 months ago)
• Language: JavaScript
• Size: 479 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# gatsby-starter-graphcms-blog

> A [Gatsby](httsp://gatsbyjs.com) starter for creating a basic blog with [GraphCMS](https://graphcms.com)

• [Demo](https://gatsby-starter-graphcms-blog.vercel.app) • [`gatsby-source-graphcms`](https://github.com/GraphCMS/gatsby-source-graphcms)

## Quick start

1. **Create a new Gatsby project via the [Gatsby CLI](https://www.npmjs.com/package/gatsby-cli)**

```shell

gatsby new graphcms-blog https://github.com/GraphCMS/gatsby-starter-graphcms-blog

```

2. **Provide your GraphCMS project keys**

> In order to use this starter, you'll need to have created a new GraphCMS project using our `Blog Template`.

Navigate into your new site’s directory and copy the `.env.sample` file.

```shell

cd graphcms-blog

cp .env.sample .env

```

Inside of your newly created `.env` file, provide values for each variable. These variables can be found in the [project settings UI](https://graphcms.com/docs/guides/concepts/apis#working-with-apis).

```env

GRAPHCMS_ENDPOINT=""

GRAPHCMS_TOKEN=""

```

3. **Start building!**

Install the dependencies and start the gatsby dev server:

```shell

yarn

yarn dev

```

## Features

- Use [`gatsby-image`](https://www.gatsbyjs.org/packages/gatsby-image) with your GraphCMS image assets.

- MDX support via [`gatsby-plugin-mdx`](https://www.gatsbyjs.org/packages/gatsby-plugin-mdx) on GraphCMS `RichText` fields.

- Built with [Tailwind CSS](https://tailwindcss.com/).