Formation Vue.js

Programme détaillé

8 modules, construits autour de vos cas réels.

Durée recommandée ≈ 21 à 35 heures, modulable selon le rythme du groupe et vos contraintes intra-entreprise.

1. 01Fondamentaux de Vue.js et réactivité

   Chapitres

   • Situer Vue.js dans l'écosystème front-end et identifier ses cas d'usage face à React et Angular
   • Comprendre le système de réactivité de Vue 3 fondé sur les Proxy et la fonction reactive
   • Maîtriser la syntaxe des templates et les directives v-bind, v-model, v-if, v-for et v-on
   • Manipuler les propriétés calculées avec computed et les observateurs avec watch et watchEffect
   • Exploiter le cycle de vie d'un composant via les hooks onMounted, onUpdated et onUnmounted
   • Mettre en application encadrée la construction d'un premier composant interactif réactif
2. 02Composants et architecture d'application

   Chapitres

   • Structurer un Single File Component avec ses blocs template, script et style scoped
   • Déclarer et typer les props, valider leurs valeurs et définir des valeurs par défaut
   • Émettre des événements personnalisés avec defineEmits pour la communication enfant vers parent
   • Distribuer du contenu avec les slots nommés, les slots scopés et le contenu de repli
   • Organiser un projet en composants atomiques réutilisables et hiérarchie de dossiers cohérente
3. 03Composition API et logique réutilisable

   Chapitres

   • Différencier l'Options API et la Composition API et choisir l'approche adaptée au projet
   • Structurer la logique d'un composant avec setup, ref et reactive
   • Extraire de la logique partagée dans des composables réutilisables
   • Comprendre la gestion des références de template avec ref et l'accès au DOM
4. 04Gestion d'état centralisée avec Pinia

   Chapitres

   • Identifier les limites de l'état local et le besoin d'un store centralisé
   • Définir un store Pinia avec son state, ses getters et ses actions
   • Partager et muter l'état entre composants distants de l'arbre
   • Gérer les actions asynchrones et la persistance de l'état dans un store
   • Construire des formulaires contrôlés avec validation et retour d'erreur utilisateur
   • Mettre en application encadrée la structuration d'un module fonctionnel piloté par un store
5. 05Routing et navigation avec Vue Router

   Chapitres

   • Configurer Vue Router et déclarer les routes d'une application monopage
   • Créer des routes dynamiques avec paramètres et routes imbriquées
   • Déclencher une navigation programmatique avec router.push et router.replace
   • Sécuriser l'accès aux vues avec les guards beforeEach et beforeEnter
   • Organiser les vues, les layouts partagés et le chargement différé des routes
6. 06Consommation d'API et gestion asynchrone

   Chapitres

   • Réaliser des appels HTTP avec fetch et axios depuis un composant ou un composable
   • Gérer les promesses et le flux asynchrone avec async et await
   • Traiter les états de chargement, de succès et d'erreur dans l'interface
   • Centraliser les appels dans une couche de services API réutilisable
7. 07Qualité, tests et performance

   Chapitres

   • Appliquer des conventions de nommage et de structuration du code Vue
   • Factoriser la logique répétée et limiter le couplage entre composants
   • Optimiser le rendu avec le lazy loading des composants et le découpage du bundle
   • Écrire des tests unitaires et de composants avec Vitest et Vue Test Utils
   • Diagnostiquer la réactivité et les performances avec Vue Devtools
8. 08Industrialisation et mise en production

   Chapitres

   • Configurer un projet avec Vite et comprendre son serveur de développement
   • Gérer les variables d'environnement pour les contextes dev, staging et production
   • Produire un build optimisé et analyser le poids des assets générés
   • Sécuriser le rendu côté client contre les injections et l'exposition de données
   • Définir une méthode de déploiement et de maintenance évolutive de l'application