4 jours (28 heures)

Formation certifiante - Code CNCP : 2226 - Certif Info : 83841

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

Jour 1 : Comprendre les fondamentaux de 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
Jour 2 : Comprendre les fonctionnalités avancées 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
Jour 3 : Comprendre l'interaction utilisateur avec Vue JS

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
Jour 4 : Comprendre le test et le déploiement de Vue JS.

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