Skip to main content

Build a Multilingual website with Next.js and Storyblok

The ultimate step-by-step guide

Create your account now to start building content experiences better, faster, without limits.

Try For Free
Marketing Animation This animations shows a developer console making a request to the Storyblok API. After the request, we see an example response with a Storyblok space object. // use the universal js client to perform the request Example Request }) console .log(error) }).catch( error => { console .log(response) .then( response => { Storyblok.get( 'cdn/spaces/me' , {}) } } "name": "Space A" , "domain": "http://example.storyblok.com" , "version": 1541863983 "space": { { Example Response

Welcome to the Ultimate Tutorial Series for Next.js!

In this tutorial series, you will learn how to build a full-blown, multilingual website using Storyblok and Next.js from scratch. We will start with the basic integration of Storyblok and Next.js. Taking one small step at a time, we will then gradually add more and more functionalities, such as dynamic page rendering, dynamic menus, custom components, and much more. After having followed this tutorial, you will not only be very well-versed in Storyblok, but you will also have created a complete multilingual website built on Next.js.

This tutorial series aims to provide you with bite-sized, easy-to-follow content, live demos, and in-depth coverage of everything you need to become a master of modern web development using Storyblok and Next.js.


Are you ready to get started?

  1. Add a headless CMS to Next.js in 5 minutes
  2. Render Storyblok Stories Dynamically in Next.js
  3. Create Dynamic Menus in Storyblok and Next.js
  4. Create Custom Components in Storyblok and Next.js
  5. Create and Render Blog Articles in Storyblok and Next.js
  6. Manage Multilingual Content in Storyblok and Next.js
  7. Create a Preview Environment for Your Next.js Website (soon to be published)

Note: if you use Next.js 14+ with App Router, we released a new version of our React SDK fully supporting Server Components, with live editor enabled for developers.

The integration steps to use the latest version are slightly different, you can find a detailed guide in the README of our repo.

Key Benefits

Storyblok brings everything developers need to create the best digital experiences.

Composable

Build off your technology stack. Storyblok integrates with any technology.

Powerful APIs

Publish to any frontend or framework with API-driven flexibility.

Headless Performance

Deliver fully rendered content via APIs made even faster with Storyblok's image service and global CDN.

Enterprise Security

Industry leading ISO 270001 certified security and protection.

Endlessly Extendable

Customize Storyblok with free apps from our App Directory or build your own.

Cloud-Native CMS

Our cloud-based systems are regularly updated and upgraded with the latest technology.

🍪 Cookie Notice

We use cookies to learn how you interact with our content, and show you relevant content and ads based on your browsing history. You can adjust your settings below. Here's our policy.

Cookie settings