2 days / 14h

Course overview

Vue.js (also called Vue), is an open-source JavaScript framework used to build user interfaces.

Through its pragmatism, power and versatility, Vue.js quickly established itself as a major web framework.

Target audience

  • Master the key architectural concepts of Vue.js
  • Develop the graphical interface for complete web or single page applications with Vue.js
  • Implement the development tools specific to Vue.js
  • Implement major Vue.js plugins


Developers, integrators, software architects, technical project managers

  • Basic knowledge of software development
  • Knowledge of HTML and CSS

Having taken or have equivalent knowledge of the courses:

  • JavaScript: Language fundamentals
  • JavaScript: develop web applications

Course Outline

1, Introduction to Vue.js

  • Principles and philosophy
  • Comparison with other major frameworks
  • Roadmap
  • Vue.js Installer


  • Vue.js installation
  • Quick win: getting started with Vue.js
  1. Core Library
    • Instance, life cycle and properties
    • Reactivity
    • Template
    • Directives
    • Workshops:
    • Implementation reactive properties
    • Use of directives: conditionals, lists, events, model, style
    • React to the life cycle of the Vue instance
  2. Components
    • Definition
    • Component Registration
    • Props
    • Template, slots
    • Tree structure and communication between components
    • Dynamic components
    • Animations and transitions


  • Creation of a single view using several custom components
  1. Reusability and Composition
    • Mixins
    • Filters
    • Plugins


  • Creation and use of mixins, filters and plugins
  1. Tools
    • Vetur, VSCode client
    • Devtools, browser plugin
    • Vue CLI, RAD console
    • TypeScript


  • Implementation of a complete development environment
  1. Single View Components
    • Single File Components
    • Different ways to create a SFC


  • Create a Single File Component
  1. Vue Router library
    • Principles
    • Installation
    • Router access
    • Features: dynamic, nested, programmatic navigation …
    • Navigation Guards


  • Creation of a Single Page Application with Router
  1. Vuex
    • Application Structure and State Management Pattern
    • Installation
    • Implementation
    • Alternative Libraries


  • Centralized state management of an application using Vuex

Ce cours vous intéresse ?

Organize a dedicated session
for your organization
Does your company need a personalized
offer? Contact us