L'écosystème du développeur JS moderne
- ECMAScript 6 : Le Javascript dans le Web.
- Les nouveautés depuis ES6.
- Aperçu de la syntaxe de TypeScript.
Travaux pratiques
Faire un petit exemple de code avec async/await, import/export, const, let et des fonctions fléchées.
Utilisation de VueJS avec Vite
- Installation d'un projet avec Vite.
- La structure d'une application.
- Créer et gérer un projet avec Vite.
Travaux pratiques
Créer le projet Vue.js qui servira de base au reste des TP.
Les composants
- Composants et Templating.
- Créer son premier composant.
- Les styles globaux.
- Les données locales.
- La gestion des évènements.
- Les propriétés et les méthodes.
- Utilisation des Props.
- Utilisation des Slots.
- Le cycle de vie d’un composant.
Travaux pratiques
Créer les composants et le templating du projet.
Répartir son code dans des composants
- Avantages de la composition API.
- Créer et utiliser un composant.
- Etat local, données réactives.
- Les fonctions composables.
- Transmission de tableaux.
Travaux pratiques
Refactorisation du code de l'application : répartition dans des sous-composants.
Gérer la navigation avec Vue Router
- Mise en place de vue-router.
- Créer et afficher des pages avec vue-router.
- Créer et configurer des routes.
- Créer des routes imbriquées.
- Créer des routes protégées.
- Gestion des erreurs 404.
- Les transitions.
Travaux pratiques
Mettre en place la navigation avec Vue router.
Gérer les APIs et les appels Axios
- Mise en place de l'API.
- Lister, lire, ajouter, mettre à jour une ressource avec Axios.
- Gestion des erreurs.
- Utilisation de FetchAPI.
Travaux pratiques
Utilisation d’une API vers un serveur externe.
Gestion des données avec Pinia
- La synchronisation des données et de l’affichage.
- Utilisation du Store.
- Mise en place de Pinia.
- Créer et utiliser un store avec l'option API.
- Utilisation du Plugin pinia-persisted-state.
- Utilisation des transitions de groupe.
Travaux pratiques
Optimiser l'architecture de l'application par la conversion à Pinia.
Pour aller plus loin…
- Les composants fonctionnels.
- Les Directives personnalisées.
- Les Variables d'environnement avec Vite.
- Déployer son application en Front-End.
- Les variables d'environnement avec NodeJS.
- Le déploiement en Back-End.
- Les outils essentiels pour développer des applications mobiles.
- Utilisation du Server-Side Rendering – SSR.
- Utilisation du Pré-Rendering.
- Initiation à NuxtJS/VitePress.
Travaux pratiques
Améliorer la qualité du code de l'application.