Storyblok Raises $80M Series C - Read News

Skip to main content

The Storyblok Astro Ultimate Tutorial

Try Storyblok

Storyblok is the first headless CMS that works for developers & marketers alike.


On May 13th, 2024, Storyblok started gradually rolling out a new design for its Visual Editor. Therefore, the Visual Editor product screenshots depicted in this resource may not match what you encounter in the Storyblok App. For more information and a detailed reference, please consult this FAQ on the new Visual Editor design.

The Storyblok Astro Ultimate Tutorial

Section titled Welcome to the Ultimate Tutorial Series for Astro!

In this tutorial series, you will learn how to build a full-blown, multilingual website using Storyblok and Astro. Taking it one small step at a time, we will start with the fundamental integration of Storyblok in Astro and 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 website built with Astro, from scratch.

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 Astro.

Are you ready to get started?

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


Manuel Schröder

Manuel Schröder

Manuel is a front-end engineer who loves crafting beautiful and fast websites. International Relations graduate turned WordPress expert, he ultimately developed a passion for the Jamstack. His favorite technologies include Vue, Astro, Tailwind, and Storyblok. These days, Manuel works as a Developer Relations Engineer at Storyblok.

Dipankar Maikap

Dipankar Maikap

Dipankar is a seasoned Developer Relations Engineer at Storyblok, with a specialization in frontend development. His expertise spans across various JavaScript frameworks such as Astro, Next.js, and Remix. Passionate about web development and JavaScript, he remains at the forefront of the ever-evolving tech landscape, continually exploring new technologies and sharing insights with the community.