Ionic 3 par la Pratique
Ionic 3 par la Pratique
Ionic continue à évoluer et propose ainsi depuis 2020 sa version 5 baptisée Magnesium.
Fidèle à l'esprit "par la pratique", cette formation Ionic en ligne, vous permettra de en main cette v5, en créant une application de gestion des aliments de votre frigo.
Qu'allez-vous apprendre dans ce cours Ionic 5 par la Pratique ?
Sur le plan fonctionnel
- création d'un inventaire de votre frigidaire (ou d'un simple bac de congélation),
- ajout de nouveaux aliments,
- gestion de dates d'ajout et de dates de péremption,
- modification des intitulés et dates et suppression d'articles sortis (CRUD),
- calcul de date péremption imminente, configurable et dépendant du type d'aliment,
Sur le plan technique
- création et gestion d'onglets et de modales,
- création d'un référentiel (de type d'aliments et de durée de conservation),
- utilisation d'une base Firestore via la nouvelle version AngularFire,
- requêtage avancé de documents (where, orderBy) via AngularFire,
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.
C'est parti pour la création d'une application Ionic 5 qui sera utile tant, aux développeurs désireux de monter en compétences sur Ionic 5, qu'aux utilisateurs souhaitant réduire le gaspillage alimentaire 😉
Happy coding !
Qu’allez-vous apprendre dans ce cours ?
Plan de cours
Chapitre 1
Création et configuration du projet
Création et configuration du projet
Chapitre 2
Gestion d'ajout d'aliments
Gestion d'ajout d'aliments
Chapitre 3
Accès aux aliments préalablement ajoutés
Accès aux aliments préalablement ajoutés
Chapitre 4
Utilisation d'une base de donnée Firestore
Utilisation d'une base de donnée Firestore
Chapitre 5
Communiquer avec l'utilisateur
Communiquer avec l'utilisateur
Chapitre 6
Catégoriser les aliments
Catégoriser les aliments
Chapitre 7
Fonctionnalité de détection d'aliments à consommer rapidement
Fonctionnalité de détection d'aliments à consommer rapidement
Plan détaillé du cours
Chapitre 1 : Création et configuration du projet
13m54s
Leçon 1Demo de l'application
Leçon 2Installation de Ionic
Leçon 3Génération d'une nouvelle app Ionic
Leçon 4Génération d'un build et ajout d'une plateforme
Chapitre 2 : Gestion d'ajout d'aliments
36m42s
Leçon 1Création d'un Reactive Form d'ajout d'aliment
Leçon 2Permettre de poster le formulaire seulement s'il est correctement rempli
Leçon 3Création d'un service permettant de persister l'aliment posté
Leçon 4Reset du formulaire après soumission
Leçon 5Créer une interface 'Food' afin de typer fortement
Chapitre 3 : Accès aux aliments préalablement ajoutés
10m51s
Leçon 1Lister tous les aliments
Leçon 2Utiliser le lifecycle event ionViewWillEnter
Chapitre 4 : Utilisation d'une base de donnée Firestore
1h33m
Leçon 1Créer un base de donnée Firestore
Leçon 2Récupération l'objet de configuration Firestore et installer AngularFire
Leçon 3Importer les modules propres à AngularFire
Leçon 4Récupérer des documents depuis Firestore
Leçon 5Se désabonner d'un flux avant la destruction d'un component
Leçon 6Ajouter un aliment dans Firestore
Leçon 7Montrer un spinner pendant l'ajout dans la base de données
Leçon 8Centrer le spinner à l'aide de classes CSS
Leçon 9Générer un ion-item par document en base
Leçon 10Ajouter des event handlers pour edit et delete
Leçon 11Supprimer un document de la base Firestore
Leçon 12Récupérer un document par son id
Leçon 13Créer une modale à l'aide de ModalController
Leçon 14Méthode d'update et formulaire d'update
Leçon 15Mettre à jour l'aliment dans Firestore
Chapitre 5 : Communiquer avec l'utilisateur
16m13s
Leçon 1Afficher un toast à l'issue d'un update réussi
Leçon 2Afficher une boîte de dialogue demandant confirmation avant suppression
Chapitre 6 : Catégoriser les aliments
41m05s
Leçon 1Renommer food.model.ts en food.interface.ts
Leçon 2Ajouter un référentiel "food-categories" et une interface Category
Leçon 3Menu déroulant permettant de sélectionner une catégorie d'aliment
Leçon 4Préselectionner le menu déroulant d'édition sur la catégorie courante
Leçon 5Tester si une option de menu déroulant a été choisie
Leçon 6Ordonner les documents en provenance de Firestore
Chapitre 7 : Fonctionnalité de détection d'aliments à consommer rapidement
44m06s
Leçon 1Fonctionnalité de détection d'aliments à consommer rapidement
Leçon 2Calculer la date maximale de conservation conseillée
Leçon 3Récupérer la nourriture à manger avant 7 jours
Leçon 4Afficher la nourriture à consommer avant x jours
Aperçus
