We’re back with This Month in Vue: Holiday Edition. Continue reading for some special Vue.js treats and surprises from the month of December.

Subscribe on Apple Podcasts | Android | Stitcher | RSS Feed

How to reuse one Vue.js codebase across multiple apps

If you tuned into last month’s edition of This Month in Vue, Adam mentioned Thomas Holland’s article on domain-driven architecture. This month, he published a follow-up, sharing his team’s methodical approach to creating a codebase that can be reused for multiple apps. The article describes solutions that match their specific problems that they had along the way, but it’s kept pretty general and philosophical.

I recommend checking it out if you’re working on a white-label app that is being sold to multiple clients with varying needs.

Design Principles of Vue 3

Evan You’s talk from VueConf Toronto on Vue 3 Design Principles was posted earlier this month. In his talk, he walks through the different considerations you might when have building a web framework. He addresses the diversity of the ecosystem using Vue, hence many different use-cases for it. He mentioned that he also likes to keep Vue a progressive framework, meaning you can use it for a small project or for a large one. He goes over how Vue 3 will make the framework even more progressive as well as performance improvements and much more.

You can watch the full talk here.

Vue Toronto 2019

Conferences can be a great way to learn new things and meet interesting people. If you haven’t been able to attend one but are interested in what that experience is like, Debbie O’Brien recently wrote a fantastic article recapping the excitement and fun that happened at VueConfTO.

P.S. If you’re interested in attending next year’s VueConfUS but don’t work for a company that can support you in getting there, we’ve got an announcement for you at the end of this article.

Create a lazy-loading image component for faster Vue.js apps

Anything you can do to speed up your load times will improve your user experience. Since images can be some of the more costly pieces of an app to load, you might want to consider lazy-loading images as they are scrolled into view, instead of loading every image at once

In Austin G’s tutorial, he walks through doing this, initially loading a placeholder, which is replaced by the actual image when it’s scrolled into the viewport.

Pinia - Open Sourced “Vuex” Project

There are lots of opinions when it comes to State Management. For the Vue ecosystem, most of us are probably familiar with Vuex. Vue Core team member Eduardo San Martin Morote recently released an experimental lightweight store that could be an alternative to Vuex. Pinia is built with the Composition API in mind and is automatically typed, modular, and lightweight. You can check it out here.

Vue Mastery Holiday Discount

It’s the most wonderful time of the year! We’re celebrating by giving a discount on our annual subscription. You can now get 35% off! Our courses are the best way to start mastering Vue, or deepening your knowledge and sharpening your skills. We already have a complete Vue 3 essentials course, with more Vue 3 content coming soon, including exclusive content with Evan You.

If you want to save 35% this holiday season, you can and get an annual subscription before the promotion expires

Portals

One of the best workflow enhancements to frontend developers has been the widespread use of components. But if you’ve ever needed to render a component in a different place in the DOM tree, even when it’s not within the scope of your app, you might want to check out Portals. Portals is a new feature coming in Vue 3 that is very handy when working with things like modals, notifications, popups or other elements that are sensitive to where they’re placed in the DOM tree.

For more information, check out the full article by Filip Rakowski.

Vue Loader Documentation

Vue Loader enables us to write single file .vue components and does other advanced things with our .vue files and its interaction with WebPack. Evan You recently expanded the Vue Loader documentation to make it more clear what this library does and how it does it. I recommend taking a read of the improved documentation if you’d like to get a better idea of what is going on under the hood.

Vueconf.US Scholarship

At Vue Mastery, it’s important to us that we support the Vue.js community, both the team developing the framework and the developers who are using it. That’s why we are excited to announce that we are giving away two full scholarships to VueConf.US!

The conference takes place in Austin, TX, March 2-4. And the scholarship includes:

• One (1) 3 day conference ticket
• Paid flight
• Paid hotel room
• $300 gift card for food and expenses

Our goal is to provide this opportunity to someone who would otherwise not be able to attend the conference. To apply for this scholarship, you can do so here.

We look forward to reviewing your applications!