A boilerplate project designed to demonstrate the benefits of using Jamstack and the easy configuration of a project with NuxtJS and Storyblok.

In this section we are going to look at how to define the component schemas needed for this project in our Storyblok space. What properties, type of fields, we have in each one and, finally, we will see an example of using these components to create a new page.

Go to app.storyblok.com, select Sign up and create an account. When it's ready, create an empty space and follow the next steps.

Content type

Nestable Molecules

Color single-option definition:

Nestable Organisms

Heading	Benefits

Heading	Benefits

For the homepage we will fill in the title field and choose the organisms we want in the body.

In this example, as in the live demo, we'll add Benefits and Tech Stack organisms.

And this is how the home Config tab will look like:

For the organisms, let's see which blocks to add to them:

# install dependencies
$ yarn install

# serve with hot reload at localhost:3000
$ yarn dev

# build for production and launch server
$ yarn build
$ yarn start

# generate static project
$ yarn generate

For detailed explanation on how things work, check out Nuxt.js docs.