One of the best tools in your Vue unit testing toolbelt is stubbing as it allows you to test a component in isolation. In this article, I'll explain key ideas behind stubbing and show you scenarios where you may need to selectively "unstub" ... more
If your Vue single-file components have dependencies, you'll need to handle those dependencies in unit tests. In this article, you'll learn how to mock dependencies in Jest by replacing them in the component's dependency graph. ... more
The most common question about testing Vue components I see out there is: what exactly should I test? In this article, I'll share with you some guidelines I use for that ensure I don't spend forever writing tests, but provide enough coverage to keep me ... more
If you want to run automated browser tests on a server without a dedicated GUI, you'll need to run Chrome in headless mode. Here's how to do it with the Nightwatch Vue CLI 3 plugin. ... more
Did you know that the validation errors in your Vue.js forms might not be heard by screenreader users? Learn how to create accessible validation errors with Vue.js and ARIA. ... more
If you're looking to make a scalable Vue or Nuxt app, you might consider using Vuex ORM. I've recently used it in a project, and in this article, I'll share with you how it works and why I think you'll like it too. ... more
JSON Web Token is the current state-of-the-art technology for API authentication. Let's see if I can explain how JWT can secure your API without crossing your eyes! ... more
What's the difference between unit and E2E testing for Vue apps? Do you need one, or the other, or both? This article will provide a useful comparison. ... more
Source files in a Vue CLI 3 project are contained in the folder src. This article discusses whether or not you should change the folder name and how you can do it using the CLI config file. ... more
If you're creating a full-stack app with Vue, you may still want the advantages of Vue CLI 3. But how do you integrate a Node server into the CLI scaffold? ... more
Making component libraries renderless can help developers of all experience levels to use them, and better serve developers who have their own design system. ... more
Vue 2.6 features an ES Module Browser Build, allowing you to write modular Vue apps that can run in the browser without a build step. This article will delve into the background of this feature and explore possible uses. ... more
Vue is a simple, elegant framework, but it also contains some advanced methods and features. nextTick() is one of those, and in this post we explore what's its purpose and how to deal with it. ... more
If you're processing CSVs, resizing images, or doing other time-consuming tasks in your web app, consider this architecture to keep users happy while your tasks complete. ... more
It's hard to provide good UX when an iframe fails to load, as iframes don't provide an error event. Here's a rough way of detecting a failed iframe and providing a fallback using Vue.js. ... more
This article provides a high-level map of the key areas of knowledge about Vue, from the core features to essential ecosystem tools. Use this map this to target areas for learning in 2019! ... more
If you want your company to add Vue to their stack, you may need to convince the decision makers to give it a try. This post will arm you with some compelling arguments that you can use to make the case for Vue. ... more
Modern frameworks like Vue.js do a ton for you. They manage DOM updates, maintain component lifecycles, and more. Layer on higher level frameworks like Nuxt.js and even more is taken care of you. The plugin system lets you mix in behavior into all of ... more
Vue is famed for its ease of use and simplicity. It achieves these qualities, in part, by having a focused and small API without too many extraneous features. That said, users and maintainers are always thinking about potentially useful new features. ... more
If you try to create a Vue template without a root node, such as this: <template> <div>Node 1</div> <div>Node 2</div> </template> You’ll get a compilation and/or runtime error, as templates must have a single root ... more
React vs Vue - a favorite talking point among developers. Many people pick a framework and stick to it, never really getting to know the library they left behind. That’s mainly due to time; the only way to really get to know the ins and outs of a system ... more
Thanks to Vue’s reactivity model, it’s really easy to roll your own form validations. This can be done with a simple method call on the form submit, or a computed property evaluating input data on each change. Using your form validation can quickly become ... more
A prop can take any form, from a simple string or number to a complex object. And even a Function. This is exactly the idea behind Callback Props : a Function that gets passed as prop to a child component, so the child component can execute it whenever ... more
Nuxt’s very opinionated when it comes to code structure. Its conventions can save you a lot of time making decisions. After one year using it on large codebases though, I’m glad there’s considerable wiggle room for customization. In this article, I lay ... more
Many, not all, mobile applications act as a client for viewing remote data that might typically appear within a web application. The most common way to consume and transmit data is through HTTP requests that communicate to remote web services or RESTful ... more
Very few people write Vue components originally intending them to be open-sourced. Most of us start out writing components for ourselves - we have a problem, and then decide to solve it by building a component. Sometimes we find ourselves wanting to ... more
Have you ever worked on a project that got away from you? It’s easy to start with a project, only to find yourself overwhelmed with new skills and challenges. Prototypes help keep projects small, and help developers decide if they’re worth pursuing. ... more