Vue.js - Initiation et approfondissement
Besoin d’adapter cette formation à vos besoins ?
N’hésitez pas à nous contacter afin d’obtenir un devis sur mesure !
Formation créée le 15/03/2024. Dernière mise à jour le 10/03/2025.
Version du programme : 1
Programme de la formation
Objectif de formation : L'objectif est de permettre aux participants de devenir compétents dans la création d'applications web réactives et performantes avec Vue.js, en couvrant à la fois les bases et les fonctionnalités avancées du framework.
Objectifs de la formation
- Maîtriser les principes fondamentaux de Vue.js et ses composants
- Comprendre et appliquer la gestion d'état centralisée avec Vuex
- Utiliser Vue Router pour ajouter un routage client-side dans les applications Vue
- Apprendre les meilleures pratiques pour structurer et déployer des applications Vue.js à grande échelle
Profil des bénéficiaires
Pour qui
- Développeurs
- Professionnels IT
Prérequis
- Connaissance de base en HTML, CSS et JavaScript
- Familiarité avec les concepts de programmation front-end
Contenu de la formation
-
Vue.js dans l'écosystème JavaScript moderne : positionnement et avantages
- Installation de Vue.js et configuration initiale d'un projet Vue
- Premiers pas avec Vue : instance Vue, directives, et binding de données
- Data binding : v-bind, v-model pour les formulaires, et gestion des événements avec v-on
- Directives Vue : utilisation de v-if, v-for, et v-show pour le contrôle du rendu conditionnel et des listes
- Définition et enregistrement de composants
- Communication entre composants : props pour passer des données, émission d'événements pour la communication inverse
- Travaux Pratiques : Création d'une application de liste de tâches simple, illustrant l'utilisation de composants, de directives, et du data binding
-
Composants avancés et transitions (7 Heures)
- Composants dynamiques : Utilisation de keep-alive pour optimiser le rendu de composants dynamiques
- Composants asynchrone : Chargement asynchrone de composants pour améliorer la performance de l'application
- Vue’s transition system : application de transitions et animations sur les éléments du DOM
- Création d'animations personnalisées avec les hooks de transition de Vue
- Travaux Pratiques : Extension de l'application de liste de tâches avec des animations lors de l'ajout/suppression des tâches et intégration de composants chargés de manière asynchrone
-
Gestion d'état avec Vuex (7 heures)
- Fondamentaux de Vuex : Compréhension de l'architecture Flux/Vuex et de l'importance de la gestion d'état centralisée
- Structure d'un store Vuex : state, getters, mutations, et actions
- Configuration et utilisation de Vuex dans un projet Vue
- Patterns et pratiques recommandées pour un code scalable et maintenable
- Travaux Pratiques : Ajout de Vuex à l'application de liste de tâches pour centraliser la gestion d'état, implémentant des actions pour les opérations asynchrones
-
Routage avec vue Router (7 heures)
- Configuration et utilisation de base de vue Router
- Définition des routes et sous-routes, liens avec router-link, et navigation programmatique avec router.push
- Introduction aux fonctionnalités avancées de Router
- Lazy loading des composants de route pour des performances optimales
- Gardes de route pour la sécurité et le contrôle d'accès aux routes
- Travaux Pratiques : Intégration de Vue Router dans l'application de liste de tâches, création d'une page de détails pour chaque tâche avec accès contrôlé
-
Déploiement et bonnes pratiques (7 heures)
- Focus sur les bonnes pratiques de développement
- Organisation et structuration d'un projet Vue pour la maintenabilité
- Stratégies de performance et optimisation : utilisation efficace des composants, gestion du state et du cache
- Déploiement : Processus de build pour la production
- Introduction aux plateformes de déploiement (Netlify, Vercel) et configuration nécessaire pour le déploiement d'applications Vue
- Travaux Pratiques : Préparation et déploiement de l'application sur une plateforme choisie, avec mise en place d'un pipeline CI/CD simple si possible
Équipe pédagogique
Professionnel expert technique et pédagogique.
Suivi de l'exécution et évaluation des résultats
- Feuilles de présence.
- Questions orales ou écrites (QCM).
- Mises en situation.
- Formulaires d'évaluation de la formation.
- Certificat de réalisation de l’action de formation.
Ressources techniques et pédagogiques
- Espace numérique de travail
- Documents supports de formation projetés
- Exposés théoriques
- Etude de cas concrets
- Quiz en salle
- Mise à disposition en ligne de documents supports à la suite de la formation
Qualité et satisfaction
Taux de satisfaction des apprenants, nombre d'apprenants, taux et causes des abandons, taux de retour des enquêtes, taux d'interruption en cours de prestation...
Délai d'accès
2 semaines