IB FORMATION : 07. Vue.js - Développement d'applications web

EN PRÉSENTIEL / A DISTANCE

1. LA LIBRAIRIE VUE.JS

• Présentation de Vue.js
• Installation de vue-cli
• Créer une application
• Tester l’application en développement
• Architecture de projet

2. LES FICHIERS DE COMPOSANTS 

• Les Single File Components (fichier.vue)
• Créer un composant
• Lier un composant à l’application
• Le template
• La mécanique du composants (module CommonJS)
• L’encapsulation de style

3. LES SYNTAXES D'INTERPOLATION 

• Les données du composants (propriété data)
• Opérateur moustache et expression JS
• Injecter du texte et du HTML (v-html)
• Injecter sans prendre en compte les changements (v-once)
• Les filtres
• Insérer un composant (balise de composant)

4. RENDU CONDITIONNEL  

• Les directives v-if, v-else et v-else-if
• Affichage avec existence dans le DOM permanente avec v-show
• Utiliser v-if avec la balise <template>

5. AFFICHAGE DE LISTE 

• La directive v-for et ses syntaxes (in / of)
• L’attribut key
• Immutabilité des éléments de tableau
• Créer un range
• Utiliser v-for avec la balise <template>
• Priorité entre v-if et v-for

6. LIER DES ATTRIBUTS  

• Lier un attribut avec v-bind
• Class-binding avec v-bind:class
• Style-binding avec v-bind:style (prefixer automatique)
• Les arguments dynamiques (v-bind[…])
• Syntaxe raccourcis ( :prop)

7. GÉRER LES ÉVÈNEMENTS  

• La directive v-on
• Les modificateurs d’événement (stop, prevent, …)
• Les modificateurs de touches (enter, space, …)
• Créer des méthodes pour gérer vos événements
• Les arguments dynamiques (v-on[…])
• Syntaxe raccourcis (@event)

8. LES FORMULAIRES  

• La directive v-model
• Liaison de valeur (checkbox, radio, select)
• Les modificateurs (lazy, number, …)

9. LES COMPOSANTS AVANCÉS  

• Passer des données à un composant avec v-bind
• Mise en cache de méthodes avec les propriétés calculées : methods VS computed
• Les watchers (watch)
• Le cycle de vie d’un composant (created, mounted, …)
• Émettre des événements depuis un composant ($emit, utilisation avec v-model)
• Les slots

10. ROUTING ET NAVIGATION 

• Installation et mise en place de vue-router
• Configuration du router
• Les routes
• Les liens (router-link)
• Les vues (router-view)
• Gérer les paramètres
• Redirections et alias
• Les navigations imbriquées
• Sécurité des routes avec les guards

11. GÉRER L'ÉTAT DE SON APPLICATION AVEC VUEX 

• L’architecture Flux
• Installation et mise en place de vuex
• Création du store
• Définition et accès à l’état
• Définition et accès aux mutations
• Mutualiser les accès avec les getters
• Gérer des mutations asynchrones avec les actions

APRÈS LA SESSION

Retrouvez sur le Learning Hub ib :

• Des vidéocasts pour revenir sur les points clés de la formation
• Des vidéos-tutos pour vous accompagner dans la mise en œuvre de vos acquis

LES PLUS DE LA FORMATION

• Une formation qui alterne des exposés, des cas pratiques et une synthèse.
• Toutes nos formations sont animées par des consultants-formateurs expérimentés et reconnus par leurs pairs.
• Répartition théorie/pratique : 45% / 55%
• Cette formation se compose d’une alternance d’apports théoriques, de travaux pratiques, de démonstrations, de phases d’échanges entre participants et de synthèses de la part du formateur.