Storyblok Stories App

This is a sample project showing how to modify content that is stored within Storyblok

Table of Contents

• Description
• Getting Started
  • Requirements
• Running the project
  • Clone the project
  • Installation
  • Adding the environment variables
  • Running the server
  • Viewing the stories
• Deployment
• Author
• License

Description

The project is built with Node.js which serves the backend environments. And Storyblok space is used for storing the stories. In this project, I used Storyblok's API to create a webapp that searches and replaces a string in all stories and publishes the changes in a Storyblok space.

You can search and replace strings in a story by adding the strings in an input field and submitting with the submit button, the changes will be published on Storyblok space and on the frontend for the user.

Getting Started

Requirements

• Create a Storyblok space (here) ensure that the space has content loaded on it.
• Node.js installed on your machine
• Storyblok Account

Running the project

Clone the project

git clone https://github.com/iamfortune/storyblok-search-and-replace-app.git

Installation

The dependencies are in the package.json file. After cloning, run the following command to install the dependencies:

cd storyblok-search-and-replace-app
npm install

Adding the environment variables

In the .env.local.example, you can find the environment variables needed for the project. They are:

AUTH_TOKEN=
PREVIEW_TOKEN=

Copy all of these environment variables to .env and replace the values with your own.

• You can get the AUTH_TOKEN and PREVIEW_TOKEN from the Storyblok User Account Dashboard

Running the server

npm start

The src/client directory contains the user interface which can be accessed on localhost:5001/ The src/server directory contains the API endpoints which can also be accessed on localhost:5001/api.

And the application can be run on localhost:5001.

Viewing the stories

When you open your Storyblok space to view the stories, the space will have your Home and About pages. You can click on either page and populate the page with data. You can also go ahead and populate the other pages with more data.

Deployment

You can deploy the application to Heroku. For your Storyblok stories, you can create a space on Storyblok. From Storyblok, you can get your auth tokens and use that in your environment variable.

Author

Fortune Ikechi

License

This project is licensed under the MIT License - see the LICENSE.md file for more information.