Formation Vue.Js, Développer des applications web Mixed: In person / distance learning

Cette formation de trois jours donne aux développeurs les clés pour construire une application web moderne et dynamique : création de composants réactifs, navigation fluide, état centralisé sécurisé et communication avec une API.

Au fil d’ateliers courts et adaptables, chaque participant applique immédiatement les notions abordées, du premier écran interactif jusqu’au déploiement en ligne. Le programme insiste sur la performance, l’accessibilité et la fiabilité grâce aux tests automatisés, tout en restant accessible aux équipes issues de JavaScript “classique”.

A l'issue de la formation, le stagiaire sera capable de développer une application Single Page App (SPA) complète avec Vue.js

• Maîtriser l'environnement du développeur JS
• Comprendre les principes clés et bonnes pratiques de Vue.js
• Connaître les outils indispensables au développement d'applications web dynamiques avec Vue.js
• Savoir développer une SPA avec Vue.js
• Réaliser des tests

Jour 1 – Découvrir Vue.js

• Structurer un projet avec modules, classes et design patterns récurrents

Vue.js – Introduction et philosophie

• Comprendre la philosophie, l'écosystème et les cas d'usage
• Démarrage et lancement d'un projet : récupération de Node, démarrage du gabarit avec un assistant graphique, test du rechargement instantané
• La logique réactive : ref, reactive, watch, computed
• Les composants : création de petits blocs réutilisables, alimentation en données, écoute des clics, placement dans la page
• Le rendu : afficher/masquer un bloc, répéter une carte dans une liste, isoler la feuille de style pour éviter les conflits

Atelier pratique Jour 1

• Construire un écran type “fiche” (profil, carte produit, etc.) pour s'exercer aux composants, à la réactivité et aux styles

Jour 2 – Routage, état global & appels API

• Structurer une SPA (Single Page Application) avec navigation dynamique, état partagé et récupération des données via API

Routage et gestion d'état

• Vue Router : configuration, navigation et routes dynamiques
• Gestion des vues et layout : partage des informations communes (ex. panier, session) entre tous les écrans sans duplication
• Connexion à un service Web : récupération des données, affichage d'indicateurs de chargement et messages d'erreurs
• Première couche de sécurité : blocage des scripts malveillants, protection des pages réservées

Atelier pratique Jour 2

• Réaliser une liste puis une page détail avec ajout d'un élément favori
• Mettre en œuvre le routage, le magasin d'état et les appels API

Jour 3 – Tests automatisés, optimisation & déploiement continu

• Garantir la stabilité : écrire et exécuter des tests unitaires / end-to-end
• Améliorer le temps de chargement et l'accessibilité
• Publier sans friction

Tests et performance

• Tests unitaires : vérification des composants et fonctions avec Jest
• Tests end-to-end : vérification automatique du bon fonctionnement avec Cypress
• Performance et accessibilité : allègement de l'application, découpage des fichiers, images adaptées, audit automatique avec axe-core et Lighthouse
• Déploiement sans douleur : construction de la version finale, envoi sur un hébergement gratuit, introduction aux scripts et à l'assistance IA pour proposer ou relire les scripts

Atelier pratique Jour 3

• Préparer la version de production, mesurer les performances principales, corriger les problèmes détectés puis publier sur un hébergement gratuit

Docaposte Institute propose plusieurs dispositifs pédagogiques adaptés aux apprenants :

• Formation en présentiel
• En groupe (inter-entreprises ou intra-entreprise)
• En individuel (monitorat)
• En journée ou en cours du soir (sur demande spécifique)
• Formation en distanciel
• Distanciel synchrone
• Distanciel asynchrone

• Alternance d'apports théoriques et de mises en pratique contextualisées.
• Progression pédagogique structurée, de la compréhension à la mise en œuvre opérationnelle.
• Pédagogie immersive favorisant une mise en application immédiate des compétences.
• Formation interactive et participative s'appuyant sur des ateliers pratiques, études de cas et échanges collectifs (+ 60 % du temps de formation.)
• Séquences pédagogiques rythmées et évaluations formatives régulières pour renforcer l'ancrage des apprentissages.
• Supports de cours, ressources documentaires et références mis à disposition par le formateur

En amont de la formation (évaluation en ligne dans l'extranet apprenant)

• Recueil des besoins et des attentes des participants.
• Auto-positionnement permettant d'évaluer le niveau initial des apprenants.

Tout au long de la formation

• Évaluations continues réalisées par le formateur travers des questions orales, exercices, QCM, études de cas et mises en situation pratiques.
  
  

À l'issue de la formation (évaluations en ligne dans l'extranet apprenant)

• Auto-positionnement afin de mesurer l'acquisition des compétences visées.
• Validation de l'acquisition des compétences par le formateur
• Questionnaire de satisfaction « à chaud » à l'issue de la formation
• Questionnaire de satisfaction "à froid", 45 jours après la formation afin d'évaluer l'ancrage des acquis et leur mise en application en situation professionnelle.

• Admission sans disposition particulière