DEV Community

Kevin Ball
Kevin Ball

Posted on • Originally published at zendev.com on

How to Learn Vue.js in 2018

Vue.js is one of the hottest topics in the web frontend space.

Vue has skyrocketed past React to become the most starred JavaScript framework on Github.

It was also the framework that the most JavaScript developers said they wanted to learn in 2018.

The big question is: How do you learn Vue.js?

What are the best resources? What sources should you be reading, what classes should you be taking, and more?

Learning Approach

Before jumping deeply into the available resources, let's talk briefly about how we learn.

If you truly want to learn Vue.js, I highly recommend picking a project you're going to apply it to.

Don't just do toy projects, or follow along with tutorials - find something real you want to accomplish and set out to do it with Vue.

This will keep you moving through challenges and force you to explore outside the narrow boundaries of what tutorial authors and course instructors think of.

It will also help you find the relevance of some more obscure topics. Many more advanced Vue concepts (such as multi-root components) didn't make sense to me until I ran into an issue in a project that required them.

Getting Started

The simplest place to get started with Vue is from the official guide.. In fact, if you google for 'learn vue', that is one of the first things you'll find.

However, when I start learning a new technology like Vue, I typically start with a free or cheap video course to give me an overview. As good as the official guide is, somehow I find the courses easier to grok.

Good Beginner Courses

Luckily, there are a number of good courses available for beginners.

  1. Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex). This is the course I started with - it's a paid course, but frequently discounted down to around $10. I highly recommend it.
  2. Learn Vue 2 Step By Step (Laracasts). Another great introductory course. I don't think it does quite as good of a job of sequencing as the course above, but on the other hand it is free.
  3. Intro to Vue.JS (VueMastery). This is a shorter course than either of the two above, and I think the videos are not quite as good, but VueMastery does a great job of giving you more than just a video. You get the lesson in text as well, download any of the resources used, and participate with CodePen based exercises. Oh, and it's free!
  4. The Ultimate Vue JS 2 Developers Course. Perhaps oversold slightly as 'the ultimate' course, but a great "learn by doing" course that focuses on 3 projects to introduce concepts of Vue. If you're having trouble coming up with a project of your own, this may be a good course for you as you can follow along with the instructor's projects.

Bonus beginner learning opportunity: LearnVueJS.com

This is a project of mine that I just launched focusing on more live learning opportunities. The ability to have live Q&A with the instructors was lacking in most Vue learning opportunities, so I launched this. The first piece launched is free webinars on Vue.js fundamentals, with more coming soon.

Advanced Courses

There are also starting to be more advanced video courses available. A couple of good options include:

  1. Advanced Components (VueMastery). A deep dive into how Vue works, complete with multiple lessons with Evan You, the creator of Vue. Once you're starting to feel comfortable and want to go deeper, this is where I'd go.
  2. The VueJS Master Class (VueSchool.io). A project focused course that builds a full application from scratch and along the way covers just about every aspect of Vue.js. Taught by Alex Kyriakidis, Vue core team member and author of 'The Majesty of Vue.js'

Continuing Learning

As you get beyond just the beginnings of 'how does this thing work at all', you'll want to expand the range of resources you're using to learn.

There are a number of resources you can use to get a stream of more advanced articles, tutorials, and tools.

  1. Vue News, a podcast and weekly email newsletter that highlights the latest news and tutorials. The official source of news blessed by the Vue core team.
  2. Vuejsdevelopers.com, both a blog and a weekly newsletter highlighting deep in-depth articles.
  3. Vue Feed, a website, newsletter, and twitter feed highlighting curated Vue news, tutorials, plugins, and more.
  4. CSS Tricks may have started focusing on CSS, but they have been racking up an impressive number of high-quality Vue articles.
  5. Views on Vue is a weekly podcast in the devchat.tv network focused on Vue featuring a number of core team members.
  6. Vue Land Discord is a chat room focused on Vue where you can ask questions, make connections, and learn.

Wrapping Up

As you can see, there are a ton of resources available for learning about Vue.js.

The only questions are - what style of learning works for you, and will you put in the time and effort to learn?

If you're great at self-driving learning, start with the official guide..

If you like video courses, there's a ton of options so look through the beginner courses and pick which one looks best.

Or if you like some more interactive learning and the opportunity to ask questions of an expert, check out LearnVueJS.com.

Top comments (1)

Collapse
 
mistergenest profile image
Evan Genest

scrimba.com/g/glearnvue

Zaydek's nine-lesson mini-course is very beginner friendly and is free.
And by beginner, I mean he even gives a quick definition of 'What is javascript?'
It uses the Scrimba platform, so you can pause the video and hack the code he is showing.