How we built our blog as a full-static site with Nuxt, Storyblok and TailwindCSS
This is not just a guide for learning how to create a blog with modern technologies such as Nuxt, Storyblok and TailwindCSS. It's also not another tutorial where the author creates a random pet project to show concepts out of the blue.
This is a story. The story that tells how we built VueDose 2.0, this very site you're reading on. In other words, a production-ready and finely thought out website from design to development.
You'll go through this story yourself by creating step by step NarutoDose: a smaller and funnier version of VueDose but themed with Naruto characters. You'll learn to:
- Use Nuxt in it's brand new full-static mode for best SEO and max performance
- Organize UI components in Vue based on a Design System
- Structure and work with the blog articles, authors and data using Storyblok
- And much more!
Psst: this story wouldn't have been written without the help of Storyblok, a beloved VueDose sponsor 💚
Read the articles in this guide:
- Setting Up a Full Static Nuxt Site
- Creating UI Components based on a Design System in Vue.js
- Setting up the blog content structure in Storyblok
- Show the Blog Content in Nuxt Using Storyblok API
- Tags and Search Functionality in Nuxt Using Storyblok API
- Optimize SEO and Social Media Sharing in a Nuxt blog
- Generate and deploy the blog as a full static Nuxt site
Sponsors
VueDose is proudly supported by its sponsors. If you enjoy it, consider supporting it to ensure the project maintainability.