Creating an Event Bus in Vue

There are times when building a Vue application that you realize that the standard parent-child model of intra-component communication just isn’t cutting it anymore. Everything gets too ridged and it gets harder and harder to add more layers to the application. Parent-child just doesn’t scale once you’re really working with a real-world project. Who is in control of the data when the components are nested five layers deep? One way to handle this—coming along with its own pros and cons—is using an Event Bus.
Read more →

How to format dates in Vue 3

If you’ve used Vue for any length of time, you soon find that it doesn’t have a lot of the fancy formatting options that some of the other frameworks seem to have out of the box. I get the feeling that Vue is very focused on minimalism and adding features that aren’t core to the framework is not something they want to do. One of those features, however, is formatting dates.
Read more →

What are services in Vue?

You might have heard the term “service” in relation to a Vue application. But looking through the Vue documentation, you might find that there isn’t any mention of what a service is at all. So when someone says “Just put that in a service”, what is that supposed to mean and what are you supposed to do about it? What is a service? When someone mentions adding a service to an application, that just means that you are going to create a JavaScript file that will export something for you to use in your application.
Read more →

How do you maintain multiple loading states in Vuex?

One of the best ways to improve the user experience in a dynamic application is by setting up loading icons for data coming into your Vuex store. But if you’ve ever tried to set this up on a page with a lot of components that are loading different dynamic data. How do you show the user that data is being loaded when that data might be coming from different, parallel API calls?
Read more →

An amazing demo playground for JavaScript - RunJS

Recently, I was wanting to try out some of the functions in Lodash to see how they worked. I went to Repl.it at first because that’s been my go-to sandbox to play around in. But Repl.it, as nice as it is, is a little too big for a quick script to play around in. But that’s when I found RunJS - A playground for JavaScript and TypeScript. This little application (for Windows, Mac, and Linux) lets you run a full Node environment with NPM support in a small, clean application.
Read more →

Why does changing my copy change the original!

Have you ever been working on your JavaScript code and changing the value of an object you were sure that you made a safe copy of only to have the original object change too? And then you looked up why the heck that was happening, you read a blog post saying “Use Object.assign() instead”. But you do that and it still freaken happens? Then someone says that you have to download lodash and use the cloneDeep() method?
Read more →

How to Load Vue Components on Non-SPA Sites

There are times when you want to use Vue components, but the application you’re working on is still in the age of jQuery. Is there a way to start using Vue without switching everything to Vue and making a single page application? Can we get all of that beautiful, juicy component action without breaking everything else that’s currently on the site? Also, can we add Vue components without having to rewrite the entire website to use Vue?
Read more →

Learning Programming is All About Learning Concepts

One of the main pieces of advice that people give in learning programming is that you should pick a language and learn it. Just pick the language that you think you’ll most want to do, get a couple of classes or tutorials on it, and learn programming! I think that that’s pretty bad advice. Someone who knows nothing about programming, picking up a language, and trying to learn that language is an extremely inefficient and slow way of learning how to program.
Read more →

A Common Roadblock Going from Junior to Mid-level

Have you ever worked on a coding problem and have to constantly stop to look up syntax? You’re almost at the solution to a problem and you know exactly what you need to do, you just don’t know exactly how to do it? It’s a super common and frustrating issue and is a really good sign that you’re progressing faster in your ability to think about problems than you are in your ability to memorize less used syntax or tools.
Read more →

Should I use created() or mounted() in Vue?

All in all, the Vue lifecycle methods are fairly straight forward. There’s even a helpful Vue lifecycle chart that describes when the various methods are called. All of that is super helpful. Until you want to use them. If I want to load in data from an API, which method should I use? Why does my component crash sometimes when I try to update DOM elements in created()? Which method should I use for what?
Read more →