Intro to Vue.js: Five part series on Vue.js

Intro to Vue.js Series on CSS-Tricks

Sarah Drasner has written a five-part tutorial series, Intro to Vue.js, to share knowledge and experience:

If I was going, to sum up my experiences with Vue in a sentence, I’d probably say something like “it’s just so reasonable” or “It gives me the tools I want when I want them, and never gets in my way”. Again and again, when learning Vue, I smiled to myself. It just made sense, elegantly.

The series consists of five parts, beginning with the basics and moving with more advanced concepts, like real-life development processes, state management, animations and some nice tips & tricks. All parts contain examples where you can see the code and the live result.

Article Series:

  1. Rendering, Directives, and Events
  2. Components, Props, and Slots
  3. Vue-cli
  4. Vuex
  5. Animations

The author is pointing to some good aspects of Vue, such as the incorporation of features from other JS frameworks without getting disorganized, and similarities with React. Also, benefits over Vue's competitors, cleaner, more semantic API offerings, slightly better performance than React, no use of polyfills like Polymer, and an isolated, less opinionated view than Angular, which is an MVC.

Some examples are:

  • A virtual DOM with reactive components that offer the View layer only, props and a Redux-like store similar to React.
  • Conditional rendering, and services, similar to Angular.
  • Inspired by Polymer in part in terms of simplicity and performance, Vue offers a similar development style as HTML, styles, and JavaScript are composed in tandem.

The series offers a good amount of learning resources and examples, and a good overview of the basics to get you up and running so you can get to know Vue.js and understand what the framework has to offer.