Articles
57 articlesThe new Provide and Inject in Vue 3
Getting stuck into the prop drilling? Learn how provide/inject can make your components more flexible and independent in this short tutorial.
Jul 18, 2022
The 101 guide to Script Setup in Vue 3
Don't you know about Script Setup yet? Check out this short article now and learn the nicest way to define a Vue component right now!
Jun 20, 2022
Hybrid Rendering: the secret way to smoothly test Vue.js components
Find out how to combine Deep and Shallow Rendering in order to achieve a flexible solution to test your Vue.js combining the best of both worlds.
Mar 7, 2022
How to use script setup in Nuxt 2
If you love Vue script setup and want to use it in your current Nuxt 2 project, the Nuxt team has made it possible to start using it today!
Feb 14, 2022
When to use a Vue Render Function
When should I use a render function in Vue.js? We’re going to cover some advanced Vue.js patterns when you need to use render functions.
Jan 27, 2022
Nuxt 3 + Storyblok for a Sushi Recipes Website
Have you used Nuxt 3 with Storyblok? Learn how to build a real-world recipes website from scratch (includes a video so you can see all the process)
Dec 15, 2021
Testing Vue.js Components with Jest
A concise guide to testing Vue.js components using Jest and the official library vue-test-utils
Going 3D with Trois.js and Vue 3
Learn about Trois.js, a JS library to render 3D scenes in Vue. In this article, we're learning the basics of using Trois.js in a Vite + Vue 3 app
Nov 16, 2021
Introduction to Render Functions
What is a render function? Let's see a simple example and the comparison with Vue compiled code and its counterpart template compiled code.
Sep 28, 2021
Achieve Max Performance loading your images with v-lazy-image
Don't you know what to do to improve your web performance? Learn Progressive Image Loading, a technique used by Spotify, Medium and Netflix.
Aug 30, 2021
Use Responsive Images with v-lazy-image
Is Web Performance a priority for you? Then read this article! You'll learn how to lazy load images with srcset and picture tag using v-lazy-image.
Aug 23, 2021
How to test Web Workers with Jest
Do you know the best part of Web Workers? They can speed up heavy tasks on your UI. But, have you tried testing them? Is not that easy... until now.
Oct 20, 2020
How to use the new Fetch in Nuxt.js
The Nuxt team is on fire, releasing new stuff every week! In this tip Samuel shows you a feature that might've gone unnoticed... till now.
Sep 7, 2020
Generate and deploy the blog as a full static Nuxt site
Your site is ready for the world. Wait, where and how do I publish it? You only need 5 minutes to learn how to deploy a Nuxt.js site in Netlify.
Aug 25, 2020
Optimize SEO and Social Media Sharing in a Nuxt blog
Do you want your blog to reach an audience? Then you should have SEO in your mind. Learn two techniques you can easily apply to your Nuxt blog.
Aug 18, 2020
Advanced i18n in Nuxt using Interpolations
Internationalization it's necessary in a multi-language site. Learn how to do i18n the right way in Nuxt and Vue using the nuxt-i18n module.
Aug 17, 2020
Tags and Search Functionality in Nuxt Using Storyblok API
Don't confuse your users! Learn how to provide them with great navigation using categories, tags and search so they can find your content easily.
Aug 11, 2020
Creating UI components based on a Design System in Vue.js
Don't you know the benefits of using a Design System? Not sure how to structure your Vue.js components in an app? Read the article and find it out.
Jul 21, 2020
Setting up a full static Nuxt site
Overwhelmed by too many options to create a blog? Chill and use Nuxt, Storyblok and TailwindCSS to make it simple, beautiful and incredibly performant
Jul 14, 2020
Use Composition API to easily handle API requests in Vue.js
Not sure how to organize your API client in Vue.js? Learn this simple technique on how to do it using the new Composition API and make it easy.
Jul 6, 2020
Build a Game in Vuejs with Phaser
Love video games and Vue.js? Then check this tutorial and learn how to build a game using Phaser, the javascript game engine for the web.
Jun 22, 2020
Create Dynamic Titles and Favicons with Nuxt
Thinking on showing a timer on the browser tab? Or different favicons depending on a state? Learn to use vue-meta in your Vue.js apps in this tutorial
Jun 18, 2020
Auto Load Vuejs Components in Nuxt
Tired of writing imports all over your code? Read this tutorial to learn how to use Nuxt components module to automatically import your components
Jun 17, 2020
How to structure a Vue.js app using Atomic Design and TailwindCSS
Unsure about how to organize your Vue.js components? Learn in this tutorial how to do it using Atomic Design methodology. Examples and demos included!
Jun 16, 2020
Go async in Vue 3 with Suspense
Learn Suspense, one of the most exciting Vue 3 features used to make async request easy and interactive. Don't miss this tutorial with code snippets!
Jun 15, 2020
Use Web Workers in your Vue.js Components for Max Performance
Learn how to get up to 20x performance improvement of Vue.js components that rely on heavy tasks so they render and load faster
Mar 31, 2020
Deep vs Shallow Rendering in Vue.js Tests
A short article on how to use deep and shallow rendering in Vue.js and what I suggest to use most of the cases using vue test utils.
Mar 3, 2020
Create a i18n Plugin with Composition API in Vue.js 3
A example on how to use the inject and provide functions to create a i18n plugin using Composition API in Vue.js 3.
Feb 17, 2020
Access template refs in Composition API in Vue.js 3
Quick tip on how to access the old this.$refs by using ref() in the new Composition API in Vue.js 3 components.
Dec 9, 2019
Use old instance properties in Composition API in Vue.js 3
Learn how to use this.$emit, this.$attrs and more in the new Composition API, where you have no this instance in your Vue.js Components.
Nov 26, 2019
Easily switch to Composition API in Vue.js 3
A step by step guide on how to migrate a Vue.js component from the traditional Object API to the modern Composition API, easy and in a cheatsheet format.
Nov 19, 2019
Theming using CSS Custom Properties in Vue.js Components
Learn in this article how to theme your applications and components by leveraging the power of CSS Custom Properties in your Vue.js components
Nov 5, 2019
The most modern Pie Chart component using CSS Conic Gradient and Vue.js
Build a Pie Chart component using one of the modern CSS features Conic Gradient
Oct 21, 2019
The most modern Carousel component using CSS Scroll Snap and Vue.js
Build a Carousel by using one of the latest CSS features called scroll-snap and bundle it into a Vue.js component
Oct 6, 2019
Sep 24, 2019
Using Scoped Slots in Vue.js
Quick example on how to use scoped slots for component reusability in vuejs
Sep 15, 2019
Quick Content Testing using Snapshots in Vue.js
Useful tip about how to use snapshot testing in Vue.js the right way and have consistent and coherent tests in your applications
May 28, 2019
Style inner elements in scoped CSS using /deep/ selector in Vue.js
Learn how you can use /deep/ to deeply style your Vue.js components using scoped CSS.
May 12, 2019
The importance of scoped CSS in Vue.js
Vue.js tutorial on how to us scoped CSS to avoid style collision in your Vue.js and Nuxt.js applications.
May 7, 2019
How to create a Geolocated Currency with MaxMind in Vue.js
Learn in this tutorial how to use content that depends on the language and location of the user and apply true i18n in Vue.js
Apr 22, 2019
Debugging Templates in Vue.js Components
Guide to debug component templates using the browser dev tools.
Apr 18, 2019
Simple transition effect between pages and layouts in Nuxt.js
In Nuxt.js, the Vue.js framework, it's very easy to apply transitions between pages and layouts on route changes. This tutorial explains how to.
Apr 17, 2019
Lazy load images using v-lazy-image Vue.js component
Learn to improve the web performance of your vue.js application
Apr 16, 2019
Dynamic Imports in Vue.js for better performance
Tutorial on code splitting using dynamic import in vue.js applications in order to have better performance.
Apr 15, 2019
Testing logic inside a Vue.js watcher
Tutorial on how to test the logic of a vue.js component watcher instead of testing the framework
Apr 14, 2019
Handle and redirect 404 responses in Nuxt.js
Learn how to redirect a user to the home page in case it navigates to a page that doesn't exists
Apr 7, 2019
Run watchers when a Vue.js component is created
Tutorial on how to make a watcher run instantly when a Vue.js component is created
Mar 31, 2019
Mar 24, 2019
Listen to lifecycle hooks on third-party Vue.js components
A quick tip on how to avoid repeating a double emit call and listen to lifecycle hooks externally
Mar 17, 2019
The power of Snapshot Testing in Vue.js
Learn why using Jest's snapshots testing for you Vue.js components can make testing much easier and quicker
Mar 10, 2019
Two less known facts about Vuex
A short tutorial on how to use watch and subscribeAction methods of Vuex in order to handle side effects, integrate external code and extend your store in Vue.js applications
Mar 3, 2019
Create an ImageSelect component on top of vue-multiselect
Build an ImageSelect Vue.js component using the popular vue-multiselect package following the Adaptive Components pattern.
Feb 24, 2019
Creating a Store without Vuex in Vue.js 2.6
Tip on creating a simple store in Vue.js 2.6 by using the new Observable API
Feb 17, 2019
Adaptive components using v-bind and v-on
Learn to use v-bind and v-on in order to proxify props and events for building a wrapper component in Vue.js.
Feb 10, 2019
How to use the new v-slot directive in Vue.js
Simplify the use of scoped slots with the new v-slot syntax introduced in Vue.js 2.6.0 beta 3
Feb 3, 2019
Remove unused CSS with PurgeCSS
Use PurgeCSS to remove dead CSS that is not used, reduce the size of the generated CSS and improve performance of a Vue.js application
Jan 27, 2019
Measure runtime performance in Vue.js apps
Short tutorial on how to measure web performance in Vue.js applications
Jan 20, 2019
Improve performance on large lists in Vue.js
Learn how to use Object freeze to improve performance on list rendering in Vue.js by creating a non-reactive array.
Jan 13, 2019
Sponsors
VueDose is proudly supported by its sponsors. If you enjoy it, consider supporting it to ensure the project maintainability.
Silver
Learning Partner
