https://github.com/storyblok/gatsby-storyblok-boilerplate
Gatsby starter template with Storyblok's headless cms and true preview
https://github.com/storyblok/gatsby-storyblok-boilerplate
demo devrel dx gatsbyjs reactjs storyblok
Last synced: 3 months ago
JSON representation
Gatsby starter template with Storyblok's headless cms and true preview
- Host: GitHub
- URL: https://github.com/storyblok/gatsby-storyblok-boilerplate
- Owner: storyblok
- License: 0bsd
- Created: 2018-06-26T10:30:48.000Z (over 7 years ago)
- Default Branch: main
- Last Pushed: 2023-02-22T06:55:09.000Z (over 2 years ago)
- Last Synced: 2024-05-01T16:39:19.966Z (over 1 year ago)
- Topics: demo, devrel, dx, gatsbyjs, reactjs, storyblok
- Language: JavaScript
- Homepage: https://www.storyblok.com/tp/add-a-headless-cms-to-gatsby-5-minutes
- Size: 3.12 MB
- Stars: 36
- Watchers: 6
- Forks: 29
- Open Issues: 17
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Gatsby.js Storyblok Boilerplate
This repository is a Gatsby.js [Storyblok](https://www.storyblok.com/) starter template used in following [5 minute tutorial](https://www.storyblok.com/tp/add-a-headless-cms-to-gatsby-5-minutes).
## Requirements
To use this project you have to have a Storyblok account. If you don't have one yet you can register at [Storyblok](https://www.storyblok.com/), it's free.
## How to get started?
Read the [Gatsby.js tutorial](https://www.storyblok.com/tp/add-a-headless-cms-to-gatsby-5-minutes) about connecting Storyblok and Gatsby.js
### 1. Clone the repo
```
git clone https://github.com/storyblok/gatsby-storyblok-boilerplate.git
```
### 2. Install all dependecies
```
yarn # or npm install
```
### 3. Adding the Access token
Create a new empty Space and exchange the preview token with your own in gatsby-config.js.
```js
// in gatsby-config.js
module.exports = {
plugins: [
{
resolve: 'gatsby-source-storyblok',
options: {
accessToken: 'YOUR-PREVIEW-TOKEN',
version: 'draft',
localAssets: true,
// languages: ['de', 'at'] // Optional parameter. Omission will retrieve all languages by default.
}
}
],
}
```
### 4. Run your project
Set the preview domain in Storyblok to http://localhost:8000/
```
# to run in developer mode
yarn develop # or npm run develop
```
```
# to build your project
yarn build # or npm run build
```
## Resources
- [Gatsby.js docs](https://www.gatsbyjs.com/docs/)
- [Storyblok Tutorial](https://www.storyblok.com/tp/add-a-headless-cms-to-gatsby-5-minutes)
[
](https://www.gatsbyjs.com/dashboard/deploynow?url=https://github.com/gatsbyjs/gatsby-starter-default)