L'écosystème du développeur JS moderne
- La spec ECMAScript.
- La syntaxe ES6+.
- Les nouveautés d'ES9/ES10.
- Babel & Webpack.
Travaux pratiques
Mise en place d'un environnement de développement JS optimisé.
Premiers pas avec Vue.js
- Principes clés de Vue.js.
- Vue.js vs React vs Angular.
- Roadmap et prochaines versions.
- Créer et gérer un projet avec vue-cli.
- La base d'une application : l'instance Vue.
- Créer son premier composant Vue.js.
- Gérer les événements du DOM.
- Débugger avec vue-devtools.
Travaux pratiques
Créer le projet Vue.js qui servira de base au reste des TP.
Répartir son code dans des composants
- L'imbrication de composants et les props.
- Passer du contenu à un composant : les slots/children.
- Déclencher des événements custom.
- Le cycle de vie des composants.
Travaux pratiques
Refactorisation du code de l'application fil rouge : répartition dans des sous-composants.
Enrichir ses templates
- Filters et computedProps : simplifier l'écriture des templates.
- Templates vs render methods & JSX.
- Composants fonctionnels.
- Animations & transitions : améliorer l'expérience utilisateur.
Travaux pratiques
Améliorer l'affichage de l'application : les différentes techniques de rendu.
Gérer la navigation
- Développer un système de routing maison.
- Principes de Vue router.
- Configurer des routes.
- Sécuriser une application : les Navigation Guards.
- Transitions entre écrans.
Travaux pratiques
Mettre en place la navigation avec Vue router.
Gestion des données avec Vuex
- Vuex : concepts de base.
- Installation et mise en œuvre.
- Étendre Vuex avec les plugins.
- Librairies alternatives.
Travaux pratiques
Optimiser l'architecture de l'application par la conversion à Vuex.
Développer une application connectée
- Charger et envoyer des données avec AJAX : les différents scénarios.
- Gestion des formulaires.
- "two-way data binding" vs "one way data flow".
- Vuex et les formulaires.
- Validation de la saisie utilisateur.
Travaux pratiques
Chargement de données issues d'une API REST/JSON et création d'un formulaire.
Aller plus loin avec Vue.js, bonnes pratiques
- Mixins et plugins.
- Regrouper son code dans des Single File Components .vue.
- Créer des custom directives.
- Typage flow/TypeScript.
- Rendre son code robuste grâce aux Prop types.
- Compilation & optimisation des performances.
- Server Side Rendering.
- Développement d'applications mobiles.
Travaux pratiques
Améliorer la qualité du code de l'application.