Dans vos locaux
Pour ancrer les apprentissages et encourager la dynamique collective.
Formation Vue JS
Adoptez Vue.js, le framework progressif et flexible, pour construire des expériences utilisateur modernes, réactives et hautement optimisées.
Maîtrisez le développement d'interfaces web légères et performantes avec l'API de Composition de Vue 3, l'écosystème Pinia/Vuex, le routing (Vue Router) et le rendu côté serveur (Nuxt.js).
4 jours (28 h)
2 100,00 € HT
<script setup>
import { ref, computed } from 'vue';
// Réactivité avec l'API de Composition
const count = ref(0);
const doubleCount = computed(() => count.value * 2);
</script>
<template>
<button @click="count++">
Count is: {{ count }} (Double: {{ doubleCount }})
</button>
</template>Description 
Vue.js est un framework JavaScript frontal progressif reconnu pour sa simplicité et sa courbe d'apprentissage rapide. Cette formation offre une immersion complète, allant de la compréhension des principes de base de la réactivité aux concepts d'architecture avancée. Les participants se concentreront sur la version moderne, Vue 3, en exploitant l'API de Composition pour structurer des composants puissants et réutilisables. Vous apprendrez à gérer l'état de l'application de manière centralisée et prédictible avec Pinia (ou Vuex), à naviguer avec Vue Router et à interagir efficacement avec des APIs. La formation couvre également l'optimisation des performances et introduit les bases du rendu universel avec des frameworks comme Nuxt.js, préparant les développeurs à créer des applications Single Page Application (SPA) et Server-Side Rendered (SSR) professionnelles.
Les objectifs
Développer et maintenir une application VueJS
Maîtriser le développement orienté composant
Comprendre le binding VueJS
Maîtriser la communication entre les composants
Implémenter une architecture pour projets conséquents avec VueX
Public visé
Développeurs web
Prérequis
Connaissance du langage JavaScript
Bonne connaissance du web
Le programme
Jour 1
Matinée
1. JAVASCRIPT MODERNE
- ES6+ et nouveautés récentes
- Fonctions et arrow functions
- Destructuring et spread operator
- Promises et async/await
- Modules ES6
- TypeScript avec Vue
- Immutabilité et réactivité
Après-midi
2. INTRODUCTION À VUE 3
- Nouveautés de Vue 3
- Composition API vs Options API
- Setup et reactive references
- Computed et watch
- Lifecycle hooks en Composition API
- TypeScript avec Vue 3
- Les bonnes pratiques modernes
Jour 2
Matinée
3. VITE & TOOLING MODERNE
- Introduction à Vite
- Configuration de Vite
- Hot Module Replacement
- Optimisation des assets
- Gestion des environnements
- Plugins Vite
Après-midi
4. BUILD & MIGRATION
- Build et déploiement
- Migration depuis Webpack
- COMPOSITION API EN DETAIL
- Ref vs reactive
- Utilisation de ‘’setup’’
- Création des composables (custom hooks)
- Provide & inject
- Utilisation des ‘’Template refs’’
Jour 3
Matinée
5. COMPOSANTS MODERNES
- Single File Components
- Props et events
- Slots et teleport
- Suspense et async components
- Les composants dynamiques
Après-midi
6. GESTION D’ETAT AVEC PINIA
- Introduction à Pinia
- Créer vos Stores avec Composition API
- Actions et getters
- Plugins Pinia
- Intégration des outils DevTools
- Migration depuis Vuex
Jour 4
Matinée
7. ROUTING AVEC VUE ROUTER 4
- Protéger les routes avec les guards
- Optimisation des performances grâce au Lazy loading
- Les routes imbriquées
- Mettre en place des Transitions
Après-midi
8. FORMS, VALIDATION & INTEGRATION API
- V-model avec Composition API
- Introduction à VeeValidate/FormKit
- Axios avec composables API Fetch
- Mise en place du cache
- Mise en place des intercepteurs
9. TESTING MODERNE
- Introduction à Vitest
- Test des Composants
- Test des custom hooks
- Mise en place des mocks
- E2E avec Cypress
- Test coverage avec Istanbul
En présentiel ou à distance : à vous de choisir
En classe virtuelle
Pour allier flexibilité et interactions en temps réel avec le formateur.
Dans nos locaux
Pour favoriser la concentration, les échanges et le confort des apprenants.
Les modalités de formation
Suivi et évaluation :
- Recueil des besoins en amont pour identifier les attentes du stagiaire
- Évaluation continue : études de cas et travaux pratiques pendant la formation
- Évaluation finale : questionnaire d'auto-évaluation
Format et encadrement :
- Formation équilibrée : 50% théorie / 50% pratique
- Sessions en petits groupes (2 à 9 participants) pour un suivi personnalisé
- Émargement par demi-journée et remise d'une attestation de formation
Moyens pédagogiques et techniques :
- Méthodes interactives et suivi des acquis : travaux pratiques, projet fil rouge, mises en situation, démonstrations, QCM…
- Les stagiaires doivent être équipés de leur matériel informatique pour suivre la formation, que ce soit dans nos locaux ou sur site externe.
- Il appartient au client de veiller à ce que le matériel mis à disposition soit conforme aux prérequis techniques indiqués dans le programme de formation.
- Accessibilité : nous informons l'ensemble de nos clients et stagiaires que nous sommes dans la capacité d'adapter les sessions en cas de situations spécifiques. Nous nous engageons à répondre à toutes les demandes dans un délai de 48h ouvré.
Conditions et délais d'accès :
- Si l'une de nos formations vous intéresse, contactez-nous au +33 04 93 65 34 24 ou à l'adresse mail contact@le-code.dev. Selon votre besoin et vos attentes, nous organiserons un échange téléphonique avec le formateur pressenti afin d'adapter la formation et ses modules, puis nous vous adresserons un devis. Les dates de la formation seront à convenir sous 30 jours maximum.
- Concernant les formations Actions Collectives, l'inscription est possible jusqu'à 24h ouvrées avant le début de la formation.