39,00

Tuto Ionic 5 par la Pratique avec Ionic

39,00

  • Une formation vidéo de 4h16m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com
Ionic 5 par la Pratique

ajouter ce cours aux favoris retirer ce cours des favoris

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 !

Table des matières de cette formation Ionic (durée : 4h16m)

  • Création et configuration du projet
    • Demo de l'application gratuit 00:03:25
    • Installation de Ionic gratuit 00:02:11
    • Génération d'une nouvelle app Ionic gratuit 00:04:30
    • Génération d'un build et ajout d'une plateforme 00:03:48
  • Gestion d'ajout d'aliments
    • Création d'un Reactive Form d'ajout d'aliment 00:18:07
    • Permettre de poster le formulaire seulement s'il est correctement rempli 00:01:42
    • Création d'un service permettant de persister l'aliment posté 00:09:49
    • Reset du formulaire après soumission 00:01:40
    • Créer une interface 'Food' afin de typer fortement 00:05:24
  • Accès aux aliments préalablement ajoutés
    • Lister tous les aliments 00:07:25
    • Utiliser le lifecycle event ionViewWillEnter 00:03:26
  • Utilisation d'une base de donnée Firestore
    • Créer un base de donnée Firestore 00:06:02
    • Récupération l'objet de configuration Firestore et installer AngularFire 00:03:12
    • Importer les modules propres à AngularFire 00:03:08
    • Récupérer des documents depuis Firestore 00:12:13
    • Se désabonner d'un flux avant la destruction d'un component 00:02:18
    • Ajouter un aliment dans Firestore 00:05:13
    • Montrer un spinner pendant l'ajout dans la base de données 00:05:40
    • Centrer le spinner à l'aide de classes CSS 00:01:39
    • Générer un ion-item par document en base 00:05:02
    • Ajouter des event handlers pour edit et delete 00:02:37
    • Supprimer un document de la base Firestore 00:13:01
    • Récupérer un document par son id 00:02:36
    • Créer une modale à l'aide de ModalController 00:10:45
    • Méthode d'update et formulaire d'update 00:12:54
    • Mettre à jour l'aliment dans Firestore 00:07:20
  • Communiquer avec l'utilisateur
    • Afficher un toast à l'issue d'un update réussi 00:07:32
    • Afficher une boîte de dialogue demandant confirmation avant suppression 00:08:41
  • Catégoriser les aliments
    • Renommer food.model.ts en food.interface.ts 00:01:52
    • Ajouter un référentiel "food-categories" et une interface Category 00:09:00
    • Menu déroulant permettant de sélectionner une catégorie d'aliment 00:10:39
    • Préselectionner le menu déroulant d'édition sur la catégorie courante 00:10:44
    • Tester si une option de menu déroulant a été choisie 00:03:39
    • Ordonner les documents en provenance de Firestore 00:05:11
  • Fonctionnalité de détection d'aliments à consommer rapidement
    • Fonctionnalité de détection d'aliments à consommer rapidement 00:08:02
    • Calculer la date maximale de conservation conseillée 00:11:36
    • Récupérer la nourriture à manger avant 7 jours 00:17:36
    • Afficher la nourriture à consommer avant x jours 00:06:52



Formateur : Codeconcept

Codeconcept a publié 24 tutoriels et obtenu une note moyenne de 4,6/5 sur 256 tutoriels vendus. Voir les autres formations de Codeconcept

  • Avec quelle version de logiciel ce tuto est-il compatible ?
    Ionic
  • Quel est le niveau requis pour suivre ce tuto ?
    débutant
  • faut-il connaître une version précédente de Ionic ?
    Non, les concepts propres à Ionic en général et à Ionic 5 en particuliers seront détaillés.
  • Faut-il connaître Angular ?
    C'est préférable car nous utilisons Ionic Angular dans cette formation.
accédez à plus de 1333 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données