Formez-vous à Vue.js par la pratique, grâce à cette formation en ligne et en vidéo !
Vue.js est un framework JavaScript qui monte.
Il mérite votre intérêt pas uniquement car c'est le petit nouveau, mais surtout car il est bien né - son créateur est un ancien de l'équipe de l'excellent framework Meteor !
En outre, Vue.js permet de facilement enrichir une application web existante, là où un gros framework tel qu'Angular est taillé pour les Single Page Apps (SPA) et ne se greffe donc pas volontiers sur un site existant.
Vue.js est dans sa version 2.
Profitez donc de sa maturité sans craindre de le voir disparaître et rejoignez les presque 130 000 développeurs qui ont marqué leur satisfaction en lui accordant une étoile sur GitHub.
La documentation de Vue.js est extrêmement bien conçue mais nécessite des comprendre beaucoup de notions : templates, data binding, directives, méthodes, soumission d'un formulaire gestion des éléments du clavier, watchers, custom events (...)
C'est pourquoi toutes ces notions essentielles sont abordées dans ce tuto !
Le code sources des exemples sont fournis avec la formation.
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions.
Bonne découverte de Vue.js !
Table des matières de cette formation Vue-JS (durée : 3h51m)
-
Prise en main
- Préparation son environnement de développement gratuit 00:01:57
- Votre toute première application Vue.js gratuit 00:03:06
- Installer un serveur web à l'aide de NPM gratuit 00:05:26
-
Notions de base
- Le data binding 00:02:14
- Installer les "Vue.js devtools" de Chrome 00:01:31
- Le two-way binding 00:02:24
- Gérer les événements 00:06:48
- Gérer la soumission d'un formulaire 00:03:48
- Parcourir un tableau 00:01:44
- Parcourir un tableau d'objets 00:02:17
- Ajouter une classe CSS conditionnellement 00:08:11
- Afficher du contenu HTML conditionnellement 00:10:02
- Gérer les événements du clavier 00:02:17
- Gérer la suppression d'une tâche 00:03:38
- Comprendre et mettre en oeuvre les lifecycle hooks 00:12:55
-
Les composants
- Créer un composent global 00:03:18
- Créer un composant local 00:03:22
- Ajouter des données à un composant enfant 00:05:06
- Ajouter des méthodes à un composant enfant 00:02:30
- Passer des données d'un composant parent vers ses enfants 00:09:01
- Passer le résultat d'une requête Ajax effectuée par le parent à son enfant 00:04:40
- Organiser une application en hiérarchie de composants 00:06:42
- Insérer du contenu entre les tags d'un composant à l'aide des slots 00:05:32
- Émettre un custom event depuis en enfant et le gérer dans le parent 00:07:42
- Afficher dans le parent les composants petits-enfants qui ont émis un événement 00:05:08
- Pré-rendu et rendu d'un tableau d'objets 00:03:05
-
Intégration d'un composent tiers
- Utilisation d'un composant tiers et récapitulatif 00:12:52
-
Divers ... mais important :)
- Créer un filtre 00:05:53
- Les computed properties 00:03:27
- Activer/désactiver un bouton en fonction de la valeur d'une computed property 00:06:47
- Surveiller le contenu d'un champ texte à l'aide d'un watcher 00:04:36
- Requêtes asynchrones et watcher couplé à debounce pour filtrer les requêtes 00:10:13
-
Vue-cli, Single File Components et SPA
- Installer vue-cli et générer un projet 00:06:49
- Architecture du projet généré par vue-cli 00:06:10
- Refactoriser des composants Vue.js en 'Single File Components' 00:03:17
- Création du composant UserList.vue 00:08:50
- Création du composant UserDetails.vue 00:11:53
- Ajouter du style à un 'Single File Component' 00:02:22
- Implémenter le routage 00:18:01
- Créer des liens statiques et dynamiques 00:05:37
- Fichiers sourcestélécharger
- Certificat
Formateur : Codeconcept
-
Très clair, très bien expliqué. Merci!
-
Très bon tuto, j'ai appris énormément sur Vue.js, je recommande à 100% !
-
Satisfait du tutoriel j'ai bien compris les bases de Vue.js, merci.
-
Avec quelle version de logiciel ce tuto est-il compatible ?Vue-JS
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés