Call Us: +32 2 466 00 16
Follow Us:

Building Web Apps with Vue.js

2 days
2 days

Upcoming Sessions





Book now





Book now

Interested in a private company training? Request it here.

Introduction to Vue

In this module you'll see what Vue is all about and how it can be used in modern web development.

  • The Evolution of Web Development
  • Components Everywhere
  • Vue Tools and Ecosystem

Vue Fundamentals

We'll get started by looking at how a Vue application is structured, and what it does. Then we'll learn about the basics of components.

  • Vue App Structure
  • The Vue Instance
  • Component Basics
  • Lifecycle Hooks
  • LAB: Vue Fundamentals

Data Binding

Data binding allows you to forget about the HTML while writing JavaScript code. It allows you to inject data into a view without creating a strong dependency between the two. This results in more flexible, testable and maintainable code.

  • The Importance of Binding
  • Directives
  • Event Handling
  • Conditionals and Loops
  • Computed Properties and Watchers
  • Filters
  • Class and Style Bindings
  • LAB: Data Binding in Vue

ViewModel in Vue

Vue uses the MVVM pattern, this involves using ViewModels as a binding layer between your models and views. In this module we'll learn the ins and outs of how to use ViewModels.

  • Adding Interactivity
  • Methods
  • Computed Properties
  • Watchers
  • LAB: ViewModel in Vue


In this module we'll dive a bit deeper into Components. You'll learn how to create a hierarchy of components and how to handle communication between them.

  • Using Multiple Components
  • Passing Data with Props
  • Emitting Events
  • Content Slots
  • LAB: Using Components

Writing Services

Services are a great way to encapsulate behaviour that doesn't belong in the component. They could contain business logic, server interaction logic, etc... In this chapter we'll learn how to use them, and how to provide and inject them into your application.

  • What are Services?
  • Provide / Inject
  • LAB: Writing Services

Talking to the Server

Single Page applications are great! But where do they get their data? In this module, we'll explore how you can access a backend from Vue, and how to implement handy features like caching and lazy loading

  • Fetch API
  • Where and When to Fetch Data?
  • Loading and Error Indicators
  • LAB: Talking to the Server


Instead of hopping from one page to the next, you can design your website as a Single Page Application. This makes your website feel and perform more like an application. SPAs have many advantages but are usually difficult to implement. This module will teach about the constructs available in Vue to build a SPA.

  • Vue Router Library
  • Routing Directives
  • Routing Configuration
  • Nested Routes
  • Navigation Guards
  • LAB:Routing

Composition and Reusability

Vue provides a couple of mechanisms to prevent duplicate code. In this module we'll take a look at your best options.

  • Mixins
  • Composition API
  • LAB: Composition and Reusability

For many modern web developers, React and Angular are the frameworks they resort to. But are they really the best? Or are Facebook and Google simply good at advertisement? Vue.js (or simply Vue) is a super popular open source initiative that believes it can do better. Vue aims to be an approachable and progressive framework for building user interfaces. In this 2-day training developers will learn how to use Vue and its component-based development to create rich and dynamic websites.

This course targets professional web developers who are familiar with JavaScript (ES2015+) and HTML and are looking for ways to improve their productivity with Vue. The main focus is getting started in the Vue world with the help of a step by step introduction to the framework.

Contact Us
  • Address:
    U2U nv/sa
    Z.1. Researchpark 110
    1731 Zellik (Brussels)
  • Phone: +32 2 466 00 16
  • Email:
  • Monday - Friday: 9:00 - 17:00
    Saturday - Sunday: Closed
Say Hi
© 2023 U2U All rights reserved.