Top ways to learn Vue 3

The first version of Vue 3 (Pre-Alpha) was released on October 7, 2019, and it’s been really well received by the community. In a tweet Evan You shared his thoughts on the open-source contribution to the project one month in:

One month after open sourcing Vue 3: 152 PRs merged from 54 contributors. This is great! Really shows how the new architecture and TS makes it easier for new contributors to understand the codebase.

With a Vue 3 release in sight, it’s a good time to get familiar with the upcoming features. In this article, we’re going to take a trip around the web to share some of our favorite Vue 3 resources, from tutorials to podcasts. We’ll include a link to the resource along with a quick summary of what you’ll learn.


Official Vue Resources

Vue RFCs

The “RFC” (request for comments) process is intended to provide a consistent and controlled path for new features to enter the framework. This link will filter down all of the RFCs that target 3.0 and above. If you click on the individual RFC, you can see the proposed change and a discussion around it. This is a really great place to find out why a new feature was introduced and what problem it solves.

Vue Next This is the official repository for the next version of Vue, which at the time of this article is 3.0. This is a great place to get your hands on the source code and try out some of the new features. These are usually very early versions, so you won’t want to use this in production.

Vue Project Roadmap

A question you’ll hear a lot around Vue 3 is: “When is it going to be released?” When I’m asked this question, I usually point people back to the Vue project roadmap. This is a great place to get an idea of where features and versions are on the development roadmap. At the time of this article, it currently shows a release date for Vue 3 in Q1 of 2020.

Vue Composition API RFC

There was a lot of discussion and confusion around the new Composition RFC when the first version of it was released. To clear things up, the Vue core team put together some documentation explaining how to use the new Composition API and the motivation behind creating it.


Articles

Vue 3: Start Using it Today

In this article, Gregg Pollack walks us through how to start writing Vue 3 applications today. Wait, Vue 3 hasn’t been released yet, how is this possible? Well, one of the biggest and most-talked-about new features in Vue 3 is the composition API. In this article, Gregg shows us how we can start using the Composition API in our Vue 2 applications. Gregg methodically breaks down the code so you can understand how this API works. Finally, if you want to give the API a spin by actually using Vue 3, there is a quick example of how to do so.

Exciting new features in Vue 3

In this Vue 3 roundup, Flip Rakowski gives us a great breakdown of some of the new features in Vue 3. The first part of the article is all about the Composition API. With this being the biggest change in Vue 3, you should try and soak up as much knowledge as you can. After that, we get some insight into some of the other features coming in Vue 3. Here are some of the new features that Flip covers for us in this really great roundup.

  • Composition API
  • Global mounting/configuration API change
  • Fragments
  • Suspense
  • Multiple v-models
  • Portals
  • New Custom Directives API

Trying the composition API in Vue3

This last article comes to us from Daniel Poda. When the Vue 3 (pre-alpha) source code was released Daniel couldn’t wait to get his hands on it and started building out some demo applications. While he was doing so he documented what you need to do to build the Vue 3 source code and then use the runtimes in an example. Throughout this article, he shows us the problems he faced and how he solved them. If you like to live on the edge (alpha), this article if for you.


Videos

Evan You: What’s Coming in Vue 3.0

Evan You gave a presentation at Laracon US 2019 about what is coming in Vue 3.0. In the first half of the talk, Evan gave some examples of just how much faster Vue 3 is going to be. Evan gives a detailed explanation of the new compilation strategy. With this new strategy update, performance is determined by the amount of dynamic content instead of the total template size. Through some benchmarks, he said that you can expect Vue 3 to be 6x faster in this category.

What I’m most excited for in Vue 3: Chris Fritz

Chris Fritz is a Vue core team member and in this presentation, he shares with us what he is most excited about in Vue 3. Chris starts off by stating that Vue 3 is going to become simpler and more explicit, and these are the themes throughout his presentation. Chris goes into detail on some of the problems in Vue 2 and how the features in Vue 3 solve them. Chris walks through:

  • Reactivity Caveats
  • Multiple Root Notes
  • Simpler Transparent Wrappers
  • Smarter v-model
  • Simpler render functions
  • Vue Migration Guide

The new Composition API - Vue.js London - Jason Yu

Jason Yu is one of my favorite developers to watch live-code. Not only is he super smart, but he has great energy and always builds out some really interesting projects. Jason is a musician and in this presentation, he builds out a keyboard-keyboard mapper because a keyboard exists in music and in programming. Jason builds on this project using the new composition API and it’s cool to see it in use in a real-world project.


Podcasts

devMode.fm: New awesomeness coming in Vue.js 3

In this episode, Andrew and Patrick sit down with Vue.js core team member Chris Fritz to talk about the awesome new features in Vue 3.0. They discuss the misconception/miscommunication about the composition API. It is really important to know that the new API is something you can use in addition to the current template syntax and it is not replacing it. Chris also goes into a few other features where the theme is: better performance and better developer experience by making things simpler.

Full Stack Radio: Evan You - What’s Coming in Vue.js 3.0

In this episode of Full Stack Radio, Adam Wathan sits down with Evan You, the creator of Vue.js to discuss what is coming in 3.0. What I really enjoyed about this conversation is Adam started out the conversation by trying to find out the motivation for 3.0 and how it got started. It was really great to learn what the thinking was behind some of these features. They spent a little time going into some of the performance benefits, which Evan said is his favorite feature in Vue 3.0 because developers can gain those benefits without doing anything new. Finally, they had a great conversation about the composition API and how this feature came to be.

Modern Web Podcast - Vue 3, Code Education, & the Vue Community

In this episode of the Modern Web Podcast, Rob Ocel sits down with our very own Adam Jahr and Gregg Pollack. To start off we get a great introduction to how Adam & Gregg got started with Vue Mastery. They talk about the educational materials that they’ve been releasing for Vue 3. Gregg said he is really excited about the future of Vue and talks about the biggest feature in Vue 3: the composition API. He breaks it down on why it was introduced and how you can start using this new advanced way of writing components. The cool part about this API is you can start using it in your Vue 2 applications by using the vue composition API plugin.


Conclusion

There is a lot of excitement out there and Vue 3 is shaping up to be one amazing release. Don’t take my word though, here is what Evan thinks about Vue 3:

https://firebasestorage.googleapis.com/v0/b/vue-mastery.appspot.com/o/flamelink%2Fmedia%2F1575335704630_twitter.opt.png?alt=media&token=d26c062a-8255-4277-afc9-09cac6da765a

Download the cheatsheets

Save time and energy with our cheat sheets.