Le Framework Vue.js
Cette formation a été conçue pour les programmeurs JavaScript qui veulent apprendre à utiliser la version 3 du framework Vue.js.
Contrairement aux autres frameworks JavaScript, Vue.js peut être adopté au fur et à mesure des besoins.
Il peut également cohabiter avec une logique JavaScript existante sans interférer avec elle.
Vous utiliserez Vue.js pour :
- Créer des interfaces utilisateur réactives
- Ajouter des fonctionnalités à un projet Web existant
- Créer des applications Web SPA
- Créer des applications pour mobiles Android et iOS
- Créer des projets complexes à plusieurs programmeurs
Code |
Titre |
Durée |
Prix HT |
VUEJS |
Le Framework Vue.js |
3 jours |
Nous consulter |
Objectifs
- Créer des interface utilisateur réactives
- Ajouter des fonctionnalités à un projet Web existant
- Créer des applications Web SPA (monopage)
- Créer des applications pour mobiles (Android et iOS)
- Acquérir toutes les bases nécessaires pour bien programmer en Vue js 3
- Apprendre à hiérarchiser une application à l'aide de composants
- Utiliser l'interface en ligne de commande Vue-Cli (création d'applications, render methods, JSX, composants fonctionnels).
- Faciliter la communication entre composants avec le gestionnaire d'état Vuex, ou avec des observable.
- Utiliser l'API de composition pour faciliter la communication entre les composants des applications de grande envergure
- Créer des plugins pour Vue JS
- Utiliser des mixins et des directives personnalisées
- Déplacer le modèle des composants avec teleport
|
Public
Programmeurs JavaScript qui veulent apprendre à utiliser Vue JS 3 |
Pré-requis
Connaissances en HTML5, en CSS et en JavaScript ES6 alias TypeScript pour être à l'aise dans cette formation. |
Post-Formation
|
Méthodes
Formation basée sur l'apprentissage |
Programme
Principes clés de Vue.js
Préparation de l'environnement de développement Le modèle MVVM de Vue.js Un premier projet Vue.js Un deuxième exemple Propriétés calculés Data bindin innerHTML et nœud texte Binding bidirectionnel Utilisation conjointe des directives v-model et v-bind Gestion événementielle L'objet $event dans la gestion évènementielle Les fonctions stopPropagation() et preventDefault() de l'objet $event Suffixes stop et prevent de Vue La directive v-for Arguments dynamiques Directive v-for pour parcourir des objets JSON Gestion des évènements clavier La directive v-cloak La directive v-once Classes conditionnelles Gestion des styles inline Afficher du code HTML conditionnellement Super challenge - Partie 1 Super challenge - Partie 2 Super challenge - Partie 3
Les Composants Vue JS
Introduction aux composants Vue JS Un premier composant local Ajouter des données dans un composant Ajouter des méthodes dans un composant Passer des données aux composants enfants avec des props Accès à une prop dans le modèle du composant Passer des données de l'application aux composants enfants Custom-events - Envoi de messages au parent par un composant avec $emit Lifecycle Hooks Organiser une application en hiérarchie de composants Passer des données à un composant avec des slots Slots nommés Slots avec portée (scoped slots) Filtres Observateurs (watchers) Requêtes asynchrones dans un observateur Animations et transitions en JavaScript Transitions d'entrée et de sortie avec VueJS Transitions d'entrée et de sortie non simultanées Transitions entre éléments Transitions de listes Transitions d'entrée et de sortie avec animate.css Animations en JavaScript
Les Applications SPA
Création d'une application SPA avec vue-router Indicateurs de navigation - Vue Router Navigation Guards Routage – Transition entre les pages
L'interface en ligne de commande Vue-Cli
Premiers pas avec Vue-Cli Architecture de l'application Création et modification d'une application avec Vue-Cli Une deuxième application avec Vue-Cli Fonctions de rendu (Render Functions) Templates vs render functions & JSX Composants fonctionnels Utilisation des paramètres props et context
Le Gestionnaire d'état Vuex
Premiers pas avec Vuex Accès aux méthodes du store dans les composants Accès à l'état du store dans les composants L'option plugins de Vuex Alternative à Vuex Vuex et les formulaires Validation d'un formulaire dans VueJS
Plus loin avec Vue.js
Mixins Mixin global Plugins Directives personnalisées Rendre son code robuste grâce aux props typées Développement d'applications mobiles Le composant Teleport L'API de composition Deuxième approche – Utilisation de la fonction reactive() Troisième approche – Utilisation de la fonction computed() Quatrième approche – Externalisation du calcul réactif Vue 3 et TypeScript |
Environnement
Linux, Windows |
Mot-clés
TypeScript, javascript, Framework, MVVM, NodeJS |
Commander
Formafast
Rue du Lac Windermere, Byzance Center, Bloc A - 1053 Les Berges du Lac - Tunisie
Tel: (+216) 31 400 501
Fax: (+216) 32 400 501
Mobile: (+216) 55 666 600
E-mail: contact@formafast.com