Articles

Learn Vue through example packed articles

The Beginners Guide to Template Refs

Vue Template Refs give our JavaScript code a reference to easily access the template. For example, if we needed quick access to a component or HTML element, template refs is the perfect solution.

Why You Need This Library for Vuex in Vue 3

Vuex is a state-management system following the Flux pattern. It lets us create a global store and a unidirectional data flow across our Vue 3 app.

Improve Vue Performance with v-once + v-memo

Rendering performance is a vital metric for frontend developers. For every second your page takes to render, the bounce rate increases.

5 VueUse Library Functions That Can Speed Up Development

VueUse is an open-source project by Anthony Fu that provides Vue developers with a huge collection of essential Composition API utility functions for both Vue 2 and Vue 3.

Lazy Load Components in Vue with defineAsyncComponent

Using Vue 3’s defineAsyncComponent feature lets us lazy load components. This means that they’re only loaded from the server when they’re needed.

Building Your Own Vue 3 Plugin - A Full Guide

Plugins are a great way to add reusable functionality to your Vue apps. With tons of existing plugins for components, routing, and more, the ecosystem for Vue has solutions for many common use cases.

A Vue Firebase Authentication Tutorial - Vue 3 and Firebase

Allowing users to create their own profiles is a common use case for many modern web apps. Trying to set this up on your own custom database can a little tricky – dealing with persistence, O-Auth, and encryption.

Explaining the Vue Context Argument - A Composition API Tutorial

When working in the Vue 3 Composition API, there are brand new ways to access component functionality. In this article, we’ll be taking a look at the setup function’s context argument.

How to Use Vue CSS Variables - Reactive Styles RFC

The Single File Component Styles RFC gives us Vue developers a way to use a component’s reactive data as CSS variables.

A Guide to Vue $emit - How to Emit Custom Events in Vue

Many Vue patterns involve passing data from a parent component to its children using props. But what if we need a child to affect its parent?

Explaining The New script setup Type in Vue 3 - RFC Takeaways

If you’ve been working in Vite and Vue 3 recently, you’ll notice that when you start a new project, your script section looks like this with this script syntax in your Vue components.

Get Kanye West Quotes w/ Vue and Axios - Beginner’s Guide to APIs

Axios is one of the most popular HTTP request libraries for JavaScript, and it’s commonly used to call APIs inside of Vue apps.

Building a Vue 3 Desktop App with Vite and Electron

In this article, we’re going to be taking a look at how to Vue 3 Desktop Project from a Vite app.

v-if vs. v-show - Vue Conditional Rendering

In Vue, there are two ways to conditionally render parts of your app: v-ifand v-show.

4 Awesome Examples of Vue Router Transitions

Vue Router transitions are a quick and easy way to add some flair to Vue app. They allow you to add smooth animations/transitions between different pages of your app.

Write Beautiful Documentation Quickly with VitePress

Any project that is going to be used by fellow developers is going to need some amazing documentation.

What you should know about Vue v-model

How to use v-model for two-way data binding between two components.

The Best VS Code Extensions For Vue Developers

Adding the right VS Code Extensions to Visual Studio can make your life as a developer so much easier.

Creating Your First Vue 3 Project - A Vue Tutorial

Vue 3 is officially here! In this announcement by Evan You, he announces the biggest changes in the new framework and talks about the amazing work the whole Vue team has done.

A Complete Guide to Vue Lifecycle Hooks - with Vue 3 Updates

Lifecycle hooks in both Vue 2 and Vue 3 work very similarly – we still have access to the same hooks and we still want to use them for the same use cases.

An Introduction to Vue Teleport - A New Feature in Vue 3

One of the new features of Vue 3 that has been talked about for a while is the idea of Portals – or ways to move template HTML to different parts of the DOM. Portals, which are a common feature in React, were available in Vue2 under the portal-vuelibrary.

How To Deploy Your Vue App to GitHub Pages

GitHub Pages is a great free option to deploy your Vue application. It’s a static site hosting service that takes files straight from a repository on GitHub.

A Quick Vue 3 Infinite Scrolling Component

If you’ve ever caught yourself on social media for way too long, chances are the site you were on was using an infinite scrolling component.

An Introduction to Vue Props

Props are an essential part of any modern JavaScript framework.