Formation Vue.js Best

Suivez notre formation Vue.js de 3 jours pour maîtriser le framework JavaScript !

18 sessions dont 9 garanties Eligible OPCO

Vue d'ensemble

A l’issue de cette formation sur le framework Vue.js, les participants auront acquis les connaissances et compétences nécessaires pour développer des sites Web et applications avec Vue 3. Le programme de formation Vue.js répond à l’ensemble des dernières recommandations données par l’équipe de Vue.js, permettant aux développeurs et développeuses d’aborder des projets complexes sereinement : utilisation de Vite, Composition API, TypeScript, Pinia…

Public visé

Architectes logiciels Développeurs

Prérequis

Bonnes connaissances en HTML, CSS et JavaScript.

Objectifs pédagogiques

Maîtriser les concepts fondamentaux du développement avec le framework Vue : templates, composants, styles, liaison de données…

Créer et manipuler des composants

Utiliser Vite pour développer des applications plus rapidement

Maîtriser Vue Router pour gérer la navigation

Gérer l’état des applications avec Pinia

Tester les applications (tests unitaires, de composants et e2e)

Mettre en œuvre les meilleures pratiques et outils de développement avec Vue 3

Programme détaillé

Introduction à la formation Vue.js

Objectifs et approche pédagogiques de cette formation Vue.js
Présentation du framework : philosophie, grands principes et évolution au fil des versions
Quelles différences avec Angular et React ?
ES2015+ et les modules
Programmation réactive
Les bénéfices de l’utilisation de TypeScript avec Vue, concepts fondamentaux
Web components
Outillage : utiliser Vite au lieu de Webpack, Visual Studio Code, Volar…
Installation de Vue : Vue CLI, la librairie create-vue

Prise en main et templates

L’architecture de Vue
Single-File Components
Introduction aux templates
v-bind et v-on
De Option API à Composition API
Fonctions et propriétés

Composants et réactivité

Créer et manipuler un premier composant grâce à notre formation Vue.js
Props et évènements
Cycle de vie des composants Vue
Directives : v-html, v-model, v-if…
Les fonctions reactive(), ref() et computed()
La syntaxe script setup pour définir un composant
watch() et watchEffect()
Timing pour la mise à jour du DOM

Styles et classes

Styles scopés
Préprocesseurs CSS
Liaison de styles et classes (objets, tableaux…)

Aller plus loin avec les composants

Utiliser des directives sur les composants
Cascade d’attributs
Les slots
Provide et Inject
Composants asynchrones

Composables, directives personnalisées et plugins : découvrez ces concepts avec note formation Vue.js

Qu’est-ce qu’un composable ? Intérêt pour le développement avec Vue
Utiliser un composable
Créer des directives personnalisées
Plugins

Routage et navigation avec Vue Router

Introduction à Vue Router
Paramètres URL
Construction de la pagination
Routes imbriquées et routes protégées
Redirections et alias
Gestion des erreurs

Gestion des états avec Pinia

De VueX à Pinia
Configuration
Définir un store
Gérer les états
Gérer les getters
Les actions

Tests

Tests unitaires
Présentation de Vitest
Les fonctions describ(), test(), it()…
Tests asynchrones
Introduction à test-utils
Tests de composants
Tests end-to-end avec Cypress