Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Vue.js Workshop

Build Status

In a nutshell: Vue.js (pronounced “view”) could be the 'V' in an MV* pattern. The reason why this framework is gaining popularity the last years is his straightforward syntax. Such as React, Vue.js is oriented component but with a far lower barrier of entry (don't need to learn JSX). Indeed, Vue's syntax will probably look familiar to anyone who has worked with Angular/Mustache in the past.

For this workshop we will learn about Vue.js. Don't worry if you are a beginner, the tutorial can be followed by people new too!

Warning: this workshop uses the StackOverflow API which is subject to Rate Limit (10.000 requests per IP per day). This limit can be reach easyly with the Webpack's Hot-reload module.


  • Exploring Vue.js basics (including templates, components) and his ecosystem (HTTP calls, routing and state management)
  • Create an app based on StackOverflow API


  • Bring your own laptop with Git, NPM and your favourite Text editor / IDE installed
  • Browser devtools
  • (optional) vue-cli installed
    $ npm install -g @vue/cli
    # or
    $ yarn global add @vue/cli


  • Vue.js overview
    • a progressive framework
    • declarative rendering
    • virtual DOM
    • .vue files & separation of concerns
    • devtools ❤️
  • Syntax
    • Conditional rendering (v-if, v-else, v-show)
    • loops (v-for)
    • forms (v-model)
  • A world of components
    • what's a component?
    • component properties
    • computed properties
    • communication between components (event & properties)
    • lifecycle
  • Vue ecosystem

Slides installation

# Don't forget the --recursive option to pull reveal.js
$ git clone --recursive
# Install&run gitbook
$ npm i && npm run doc:build