THE VUE.JS
HANDBOOK
BY FLAVIO COPES
FLAVIOCOPES.COM
THANK YOU!
Thank you for your interest in this ebook about Vue. I hope you will enjoy it. I will release a
more
advanced course on Vue.js
with tons of hands-down tutorials at the end of July 2018. It
will be mostly text based, with tutorials and interactive code samples, rather than videos (there
are already good Vue video courses around). Head to
to learn more
and get an exclusive 50% discount when the course launches.
INDEX
INTRODUCTION
Introduction
TOOLING
The Vue CLI
The Vue DevTools
Conguring VS Code for Vue Development
YOUR FIRST VUE APP
Your rst Vue app
COMPONENTS
Components
Single File Components
Templates
Styling components using CSS
COMPONENTS BUILDING BLOCKS
Directives
Methods
Watchers
Computed Properties
Methods vs Watchers vs Computed Properties
Props
Events
Slots
Filters
COMMUNICATION AND STATE MANAGEMENT
Communication between components
Vuex
INTRODUCTION
Vue is a very popular JavaScript frontend framework, one that’s experiencing a huge growth.
It is simple, tiny (~24KB) and very performant. It feels dierent from all the other JavaScript
frontend frameworks and view libraries. Let’s nd out why.
FIRST, WHAT IS A JAVASCRIPT FRONTEND
FRAMEWORK?
If you’re unsure what a JavaScript framework is, Vue is the perfect rst encounter with one.
A JavaScript framework helps us create modern applications. Modern JavaScript applications
are mostly used on the Web, but also power a lot of Desktop and Mobile applications.
Until the early 2000s, browsers didn’t have the capabilities they have now. They were a lot less
powerful, and building complex applications inside them was not feasible by the point of view
of performance, and the tooling was not even something that people thought about.
Everything changed when Google unveiled Google Maps and GMail, two applications that ran
inside the browser. Ajax made asynchronous network requests possible, and over time
developers started building on top of the Web platform, while engineers worked on the
platform itself: browsers, the Web standards, the browser APIs, and the JavaScript language.
Libraries like jQuery and Mootools were the rst big projects that built upon JavaScript, and
were hugely popular for a while. They basically provided a nicer API to interact with the
browser, and provided workarounds for bugs and inconsistencies among the various browsers.
Frameworks like Backbone, Ember, Knockout, AngularJS were the rst wave of modern
JavaScript frameworks. The second wave, which is the current one, has React, Angular and Vue
as its main actors.