Find out how to use Nuxt with Storyblok
Learn how to develop your own Nuxt applications that use Storyblok APIs to retrieve and manage content.
-
The Ultimate Tutorial
In this tutorial series, you will learn how to build a full-blown, multilingual website using Storyblok and Nuxt 3.
-
Nuxt Module
To quickly integrate Storyblok with Nuxt use our Nuxt module and you are done in seconds.
Your learning journey with Storyblok starts here
Helpful resources
-
Storyblok Discord
Join our supportive community of Storyblok and Nuxt developers in the #nuxtjs channel of our Discord server.
-
Official SDK
Learn how to make the most out of @storyblok/nuxt. Feel free to share your feature requests, issues, or code contributions.
-
Learning Hub
Comprehensive developer guides, API documentation, technology hubs and more.
-
Part 1
Add a headless CMS to Nuxt 3 in 5 minutes
-
Part 2
Render Storyblok Stories Dynamically in Nuxt
-
Part 3
Create Dynamic Menus in Storyblok and Nuxt
-
Part 4
Create Custom Components in Storyblok and Nuxt
-
Part 5
Create and Render Blog Articles in Storyblok and Nuxt
-
Part 6
Manage Multilingual Content in Storyblok and Nuxt
-
Part 7
Create a Preview Environment for Your Nuxt 3 Website
-
A 5-minute video on Nuxt & Storyblok
The well-known YouTube channel, LearnVue, created this quick overview of how they use Nuxt + Storyblok to manage their website content.
-
Build a BLOG with Nuxt 3 & Storyblok
A hands-on tutorial, from our ambassador Alexander Gekob, on how to build a blog using our Nuxt SDK.
-
Nuxt, Shopify, and Storyblok Crash Course
Jakub shows us how to build a Composable Commerce from scratch and deploy it to Vercel.
-
Complete series on how to connect Storyblok with Nuxt 3
A video playlist of tutorials, by Alvaro Dev Labs, on how to create a sushi recipes site from scratch 'till deployment using the Storyblok Nuxt SDK.
-
Storyblok Nuxt Module
This module adds the Storyblok API client and Storyblok JS Bridge to your Nuxt.js project.
-
Storyblok Rich-Text Renderer Module
Our ambassador, Marvin, created a rich text renderer module for you that is lightweight and convenient.
-
TS types generator for Storyblok Blocks
Dohomi created a tool to generate TypeScript interface types based on Storyblok component schemas.
-
Extend Storyblok with this App Starter
A Nuxt 3, blok.ink and Tailwind Storyblok App Starter created by our partner Virtual Identity.
-
Nuxt.js 2 Storyblok Queries
Nuxt.js 2 module to simplify queries to the Storyblok API.
-
Nuxt.js 2 Storyblok Router
Nuxt.js 2 module to use storyblok routes instead of pages/directory.
-
Part 1: Full Static Nuxt Site
Setting up a full static nuxt site.
-
Part 2: UI Components
Creating UI components based on a Design System in Vue.js.
-
Part 3: Blog Structure
Setting up the blog content structure in Storyblok.
-
Part 4: Using the Storyblok API
Show the Blog Content in Nuxt.js Using Storyblok API.
-
Part 5: Adding a Search
Adding Tags and Search functionality in Nuxt.js using Storyblok API
-
Part 6: SEO & Social Sharing
Optimize SEO and Social Media Sharing in a Nuxt.js blog
-
Part 7: Generate & Deploy
Generate and deploy the blog as a full static Nuxt.js site
-
Generate routes for Nuxt v3 & v2 with Storyblok
Nuxt.js allows you to export your application as a statically generated website. To do so, it will need to know every route available.
-
Build a Storefront with BigCommerce & Nuxt
Learn in a detailed step-by-step guide how to create your storefront with Nuxt 3 & BigCommerce.
-
Integrate with VueStorefront - Docs
Learn directly in the VueStorefront documentation how to use Storyblok with VueStorefront, Vue 2, without hassle.
-
Routing in Nuxt
Nuxt has a file-system-based router built on the concept of pages.
-
Configuring the Storyblok Bridge in TypeScript
Katie Adams explains how to use Storyblok Bridge with TypeScript.
-
How to deploy Nuxt SPA to Netlify
This guide describes how to configure & deploy your single page application (SPA) built with Nuxt and Storyblok to Netlify.
-
Our API Documentation Journey with Nuxt.js 2, Netlify, and Github
A story behind the Storyblok documentation and how we use Storyblok internally for it.
-
How to Create a Custom App for Storyblok with Nuxt 2
This guide explains how to create a custom application in the context of a Storyblok UI using the Nuxt.js framework and OAuth2 for authentification.
-
How to schedule content with Nuxt.js 2 and Storyblok using Releases
Gary Siladi and Peter Guzma wrote down a short guide on how to schedule the bundle of changes using the Storyblok's Releases App and Nuxt.js.
-
How to create dynamic forms with custom validation in Storyblok v1 and Nuxt.js 2
In this article we’ll show you how to easily set-up dynamic forms with custom validation using Storyblok, Nuxt.js, Vuelidate & TailwindCSS.
-
How to build a shop with Nuxt 2, Storyblok and Snipcart
In this tutorial, we will implement a Product detail and Product Overview using Nuxt.js and Storyblok. To let you buy your products, we will integrate Snipcart buy buttons and cart.
Basic topics
Perfect for anyone just getting started with Nuxt.js.
The Storyblok Nuxt Ultimate Tutorial
In this tutorial series, you will learn how to build a full-blown, multilingual website using Storyblok and Nuxt 3.
Videos
Watch our recordings and discover how your project could work and look like.
Tools & Modules
From developers for developers, extend and add functionalities to your Storyblok project.
A complete guide to build the VueDose blog
We collaborated with VueDose to create a full series of tutorials on how to create a fully static site using Nuxt 2 & Storyblok v1 for you.
Advanced Topics
This guide is for developers who want to learn about using Nuxt.js and Storyblok together.
Experts Topics
These are the articles for the experienced Nuxt.js & Storyblok developers.
Made with Storyblok and Nuxt
With customers in nearly every industry and country, Storyblok helps thousands of people to manage their content.
Case Studies
Build a Storefront
with Nuxt and BigCommerce
Learn in detailed step by step guide how to create your own storefront with Nuxt & BigCommerce.