4 jours (28 heures)
Formation certifiante - Code CNCP : 2226 - Certif Info : 83841
- Présentiel
- Blended - Learning
- FOAD / E-learning tutoré
Objectifs
- Explorer la nature progressivement adoptable de VueJS et comment il peut être progressivement mis en œuvre
- Modèles de Vue Master MVM
- VueJS Code Bind pour les classes de style HTML et les styles en ligne
- Gérer les événements dans vos applications VueJS
- Mettre en œuvre des tests unitaires dans vos applications Vue.JS
- Déployer des applications Vue.js
Prérequis
Connaissances des langages HTML et CSS et JavaScript.
Vous n’avez pas les prérequis nécessaires pour la formation Vue.js ? Contactez nous pour étudier ensemble un parcours sur mesure et garantir ainsi la réussite de votre projet.
Intervenants
Les contenus pédagogiques sont synchronisés sur les évolutions techniques grâce à notre équipe d’intervenant experts et professionnels du secteur enseigné. Les formateurs qui interviennent pour animer les formations ont une double compétence : compétence informatique et compétence métier (Banque, Assurance, Administration, Santé, Transport).
PROGRAMME DE FORMATION VUE.JS
SECTION 1 : COMPRENDRE LES FONDAMENTAUX DE VUE JS
- Comprendre les fondamentaux de Vue.js
- Introduction à l’essentiel de Vue.js
- Installer Vue.js
- Comprendre l’instance de vue
- Premiers pas dans Vue JS
- Utiliser les propriétés calculées
- Découvrir l’interpolation de texte
- Utiliser les liaisons d’attribut
- Afficher les éléments d’une liste
- Exploiter les conditions
- Afficher ou cacher des éléments
- Utiliser les structures conditionnelles
- Utiliser les boucles
- Comprendre l’attribut Key
- Écouter les évènements
- Utiliser la directive v-on
- Quiz I : Comprendre les fondamentaux de Vue JS
- Découvrir la liaison bidirectionnelle
- Comprendre les méthodes dans Vue.js
- Comprendre les propriétés Computed
- Utiliser la directive v-bind
- Gérer les événements
- Gérer les styles CSS
- Exploiter les classes
- Exploiter l’attribut Style
- Créer des transitions et des animations
- Utiliser la directive v-bind : class
- Quiz II : Comprendre les fondamentaux de Vue JS
- Utiliser les composants dans Vue.js
- Comprendre les composants
- Transmettre des données aux composants enfants avec les props
- Émettre des évènements depuis les composants enfants
- Comprendre le cycle de vie des composants
- Créer des composants
- Travail à faire : Comprendre les fondamentaux de Vue JS
- Quiz III : Comprendre les fondamentaux de Vue JS
SECTION 2 : COMPRENDRE LES FONCTIONNALITÉS AVANCÉES DE VUE JS
- Créer un projet avec Vue CLI
- Installer Vue CLI
- Comprendre l’environnement CLI et ses fichiers
- Découvrir l’anatomie des composants dans un projet CLI
- Comprendre l’imbrication de composants
- Distribuer des contenus avec des slots
- Gérer les styles de son application
- Quiz I : Comprendre les fonctionnalités avancées de Vue JS
- Utiliser Vue Router
- Découvrir Vue Router
- Créer le fichier de configuration de Vue Router
- Créer des liens grâce à Vue Router
- Créer des liens avec des routes nommées
- Créer des redirections et des alias
- Gérer les erreurs 404
- Créer des liens avec des paramètres
- Utiliser des props pour les routes
- Quiz II : Comprendre les fonctionnalités avancées de Vue JS
- Découvrir l’API de composition de Vue.js
- Prendre en main l’API de composition pour Vue.js
- Découvrir la fonction Setup
- Utiliser les méthodes et les propriétés Computed avec l’API
- Comprendre la syntaxe réactive
- Modulariser son code et utiliser les bonnes pratiques
- Travail à faire : Comprendre les fonctionnalités avancées de Vue JS
SECTION 3 : RÉALISATION D’UNE APPLICATION FULL-STACK
- Créez un front Vue.js
- Configurer et exécuter un projet Vue
- Structure du projet Vue
- Routage dans Vue
- Ajouter des données, des styles et des images
- Créer une page produit
- Créer une page de détail du produit
- Créer une page de panier
- Créer une barre de navigation
- Créer une page 404 dans Vue
- Utilisez des composants modulaires
- Utilisez des composants modulaires page panier
- Créez un back-end Node
- Pourquoi Node.js
- Configurer un serveur Express
- Tester les serveurs avec Postman
- Paramètres d’itinéraire dans Express
- Obtenir des données d’un serveur
- Utilisez Nodemon pour redémarrer un serveur
- Créer et supprimer des données de serveur
- Travail à faire : Réalisation d’une application Full-stack
SECTION 4 : PERSISTANCE DES DONNÉES
- Ajoutez MongoDB à votre back-end
- Pourquoi MongoDB
- Téléchargez et installez MongoDB
- Ajouter MongoDB à un serveur Node.js
- Ajouter MongoDB aux points de terminaison GET
- Créer des données dans MongoDB
- Supprimer les données dans MongoDB
- Connectez le front et le back-end
- Introduction à la bibliothèque Axios
- Charger les données du serveur,
- Ajouter des articles au panier
- Améliorer l’interface d’ajout au panier
- Retirer des articles du panier
- Article déjà dans le panier
- Hébergez votre site
- Le processus de release
- Construire et servir un front-end
- Configurer Heroku et MongoDB
- Utiliser des variables d’environnement dans Heroku
- Pousser le code vers Heroku
SECTION 5 : GESTION DE L’AUTHENTIFICATION DANS UNE APPLICATION VUE JS
- Mettre en place votre application Vue JS
- Configurer votre environnement
- Installer un projet Vue
- Personnaliser votre installation
- Comprendre l’installation de la CLI
- Modifier le modèle Vue
- Enregistrement et authentification
- Premiers pas avec Firebase
- Connexion d’un utilisateur
- Rendre les données disponibles partout
- Connectez vos utilisateurs
- Mettre à jour votre profil
- Déconnexion
- Traitement des informations utilisateur
- Ajout des informations utilisateur à la base de données
- Affichage des données
- Ajouter des icônes et supprimer des enregistrements
- Enregistrement des utilisateurs dans votre salle
- Travailler avec WebRTC
- Travailler avec WebRTC
- Obtenir des informations sur la réunion
- Participants en attente
- Supprimer des utilisateurs
- Ajouter des participants
- Nettoyage de l’interface
- Ajout de WebRTC
- Utilisation des règles de sécurité
Une attestation d’assiduité sera délivrée après la validation de toutes les compétences de ce module.
POUR TOUTE DEMANDE DE RENSEIGNEMENT OU DE DEVIS