Building Advanced Vue.js Applications

Read articles about building advanced applications with Vue.js and Vuex. The articles are mostly about advanced Vue.js techniques like Vuex best practices, renderless components, and other advanced techniques for structuring large scale Vue.js applications.

If you want to learn even more about advanced Vue.js techniques, you can sign up for the Newsletter of my upcoming book.

$refs and the Vue 3 Composition API

If you’re used to working with Vue 2 $refs and switch to the Vue 3 Composition API, you might wonder how to use $refs inside the new setup() method. In this article, we find out how to use the new ref() function as a replacement for static and dynamic HTML element references...

Read more

Cut Your Nuxt.js generate Build Time in Half with context.payload

One of my freelancing projects is a Nuxt.js project powered by the headless CMS Storyblok. Because performance is critical, I decided to use Nuxt.js in generate mode outputs static HTML files for each page at build time. But because Nuxt.js needs to generate 1.000+ pages, the build time got long...

Read more

Vue.js Functional Base Components Powered by CSS Modules

In one of my earlier articles, I wrote about how to use functional Vue.js components so that they inherit attributes such as classes and styles. This way, functional components are perfect for creating simple base components. In this article, we take a look at how we can simplify and generalize the process of creating new functional base components by automatically creating new Vue.js components from CSS files...

Read more

Lazy Resolving Observable API Services with Vue.js

Although GraphQL is pretty cool and powerful, I also like the simplicity of good old REST API endpoints. Also, we often can't use GraphQL for everything because there is no GraphQL endpoint available. In this article, we take a closer look at how we can replicate one of the core features of GraphQL, which makes it possible only to load what is absolutely necessary, in a classic REST API-based application...

Read more

Vuex Data Model and Feature Module Strategy Part 2: Feature Modules

In this article, we extend the functionality of our very simple demo application from the previous article to display multiple paginated lists for the same content type. The paginated list feature module does not fetch any data itself but instead connects to the data model module. Doing so makes it possible to cache requests with the same query across feature modules to reduce the number of requests to your API and make your app feel snappy...

Read more