Vue.js

• 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

1, Introduction to Vue.js

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

Workshops

• Vue.js installation
• Quick win: getting started with Vue.js

2. 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
3. Components
   • Definition
   • Component Registration
   • Props
   • Template, slots
   • Tree structure and communication between components
   • Dynamic components
   • Animations and transitions

Workshops:

• Creation of a single view using several custom components

4. Reusability and Composition
   • Mixins
   • Filters
   • Plugins

Workshops:

• Creation and use of mixins, filters and plugins

5. Tools
   • Vetur, VSCode client
   • Devtools, browser plugin
   • Vue CLI, RAD console
   • TypeScript

Workshops:

• Implementation of a complete development environment

6. Single View Components
   • Single File Components
   • Different ways to create a SFC

Workshops:

• Create a Single File Component

7. Vue Router library
   • Principles
   • Installation
   • Router access
   • Features: dynamic, nested, programmatic navigation …
   • Navigation Guards

Workshops:

• Creation of a Single Page Application with Router

8. Vuex
   • Application Structure and State Management Pattern
   • Installation
   • Implementation
   • Alternative Libraries

Workshops:

• Centralized state management of an application using Vuex