Maîtriser l'architecture propre dans Flutter pour les débutants | Rahul Agarwal | Skillshare

Vitesse de lecture


1.0x


  • 0.5x
  • 0.75x
  • 1 x (normale)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Maîtriser l'architecture propre dans Flutter pour les débutants

teacher avatar Rahul Agarwal, Flutter Developer & Trainer

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Leçons de ce cours

    • 1.

      INTRODUCTION DU COURS

      0:53

    • 2.

      Aperçu de l'architecture propre

      8:14

    • 3.

      UI

      45:36

    • 4.

      Entités

      5:35

    • 5.

      Service Locator Package

      5:52

    • 6.

      Usecases et dépôts

      8:42

    • 7.

      Des mannequins

      12:08

    • 8.

      Sources de données et dépôts

      16:03

    • 9.

      Services

      17:57

    • 10.

      Bloc avec un aperçu de la gestion de l'état de Cubit

      9:32

    • 11.

      Implémentation de blocs et de cubit dans l'application

      33:28

    • 12.

      Tester la modularité de l'architecture propre

      7:00

  • --
  • Niveau débutant
  • Niveau intermédiaire
  • Niveau avancé
  • Tous niveaux

Généré par la communauté

Le niveau est déterminé par l'opinion majoritaire des apprenants qui ont évalué ce cours. La recommandation de l'enseignant est affichée jusqu'à ce qu'au moins 5 réponses d'apprenants soient collectées.

169

apprenants

--

projet

À propos de ce cours

Clean Architecture est le schéma directeur d'un système modulaire, qui suit strictement le principe de conception appelé séparation des préoccupations. Plus précisément, ce style d'architecture se concentre sur la division des logiciels en couches pour simplifier le développement et la maintenance du système lui-même. Lorsque les couches sont bien séparées, les pièces individuelles peuvent être réutilisées, ainsi que développées et mises à jour de manière indépendante.

Dans ce cours, vous réaliserez une application entière à partir de zéro en utilisant Clean Architecture et la gestion des états de Bloc et de Cubit. Vous incorporerez également l'API REST en utilisant deux paquets différents Http et Dio. Vous apprendrez également à propos de l'injection de dépendance et à la façon de le rendre simple en utilisant le package get_it. Vous apprendrez à propos de la structure de fichier d'une application du monde réel et à la façon de rendre votre code évolutif et modulaire.

L'architecture propre divisera le projet Flutter en 3 couches principales, à savoir :

Couche de présentation

La couche de présentation consiste en le code pour accéder aux données de l'application à partir d'un dépôt. En outre, il existe le code pour la gestion de l'état comme les fournisseurs, BLoC et ainsi de suite.

Couche de domaine

La couche de domaine est la plus profonde de l'architecture propre. Cette couche contient le code pour les applications de la logique d'entreprise, telles que les entités et les cas d'utilisation.

Couche de données

La couche de données se trouve à la couche la plus extraterrestre Cette couche consiste en code source de données comme la consommation d'API de repos, l'accès à la base de données locale, la base de données Firebase ou d'autres sources. De plus, sur ce calque, il existe généralement le code de la plateforme qui permet de créer l'interface utilisateur (widgets).

Rencontrez votre enseignant·e

Teacher Profile Image

Rahul Agarwal

Flutter Developer & Trainer

Enseignant·e

Hello, I'm Rahul. I am skilled in building cross platform application using Flutter. I am freelance developer as well as conduct workshops to share my knowledge with the community.

Voir le profil complet

Level: Intermediate

Notes attribuées au cours

Les attentes sont-elles satisfaites ?
    Dépassées !
  • 0%
  • Oui
  • 0%
  • En partie
  • 0%
  • Pas vraiment
  • 0%

Pourquoi s'inscrire à Skillshare ?

Suivez des cours Skillshare Original primés

Chaque cours comprend de courtes leçons et des travaux pratiques

Votre abonnement soutient les enseignants Skillshare

Apprenez, où que vous soyez

Suivez des cours où que vous soyez avec l'application Skillshare. Suivez-les en streaming ou téléchargez-les pour les regarder dans l'avion, dans le métro ou tout autre endroit où vous aimez apprendre.

Transcription

1. INTRODUCTION DU COURS: L'un pour créer une application du monde réel en utilisant une architecture appropriée, séparant la logique métier et le tableau blanc. Alors ce cours est fait pour vous. Dans ce cours, vous allez créer une application complète à partir de zéro en utilisant une architecture propre avec gestion des blocs et des états cubiques. Vous allez également intégrer l'API REST dans votre application à l'aide de deux paquets différents, HTTP. Et vous apprendrez également comment injecter des dépendances à l'aide du package getters. Et surtout, vous apprendrez à séparer votre téléphone en trois couches différentes, les couches de données, de domaine et de présentation et à créer votre module. moi qui m'appelle. Et dans ce cours, votre instructeur sera dupé sur le sec. J'espère que ça vous plaira. Alors, sans perdre plus de temps, inscrivez-vous dès maintenant et c'est parti. 2. Aperçu de l'architecture propre: Bienvenue dans la première vidéo de notre cours qui s' intéresse à l'architecture. Dans cette vidéo, nous allons en apprendre davantage sur les architectures propres. Donc, avant de nous lancer dans une architecture propre, nous devons savoir pourquoi utiliser l'architecture en premier lieu. Si vous avez une application de petite ou moyenne taille, disons une application dans laquelle vous devez appuyer sur certains boutons. Et dans l'interface utilisateur, il y aura une image ou du texte affiché. Alors vous n'avez pas besoin d'une architecture, car c'est un acte très simple. Et l'intégration d'une architecture dans ce type d' application sera un processus fastidieux et chronophage. Mais disons que vous avez une très grosse application dans laquelle non seulement vous, mais aussi beaucoup plus de développeurs travaillent sur le même projet. Par exemple, supposons que vous développiez une très grande application comme Uber ou une très grande application. Zomato, ce truc. Non seulement vous, mais bien d'autres développeurs travaillent sur un seul projet. Cette fois-ci, le fait de disposer d'une architecture appropriée vous permet non seulement d' accélérer le développement, mais aussi de normaliser un modèle de conception dans l'ensemble de l'équipe de développement d'applications. De plus, le fait d'avoir une architecture structurée très appropriée nous aide à modulariser le code. Voici une belle partie de l'architecture propre. Une architecture propre aide les développeurs d'applications à modulariser le code. Qu'est-ce que j'entends par modularisation ? modularisation du code signifie avoir des sections distinctes pour chaque ensemble indépendant. Maintenant, si vous souhaitez modifier, par exemple, un service backend que vous utilisez, disons le lancer. Et plus tard, vous voudrez le remplacer un backend personnalisé, puis modulariser l'architecture. Vous pouvez le faire très facilement sans affecter les autres couches. De plus, si vous utilisez, disons, un package qui fonctionne correctement pour le moment. Mais plus tard, vous voulez changer le package pour un package différent pour la facilité d'utilisation, Andy, pour l'amélioration de l' application pendant le temps dont vous disposez, vous pouvez utiliser cette architecture modulaire pour modifiez facilement quelques fichiers. Ensuite, vous pouvez à nouveau exécuter l'application telle qu'elle était. Maintenant, comme nous le savons maintenant, cette architecture est nécessaire pour créer des applications de taille moyenne ou grande. Alors pourquoi devrions-nous choisir une architecture propre ? Il existe de nombreuses autres options architecturales, telles que MVVM, MDD. Pourquoi devrions-nous utiliser Clean Architect ? Eh bien, pour comprendre cela, nous devons connaître la structure fondamentale de base d'une architecture propre. Une architecture propre sépare le code en trois couches différentes. L'une est la couche de présentation, seconde est la couche de domaine. Troisièmement, il y a les données. La couche de présentation comprend l'interface utilisateur et la logique de présentation. La logique de présentation étant la gestion de l'état. Par exemple, la gestion d'état telle que bloc, bloc avec coudée, fournisseur , fièvre, pot, GetX, etc. La couche de domaine est plus fine, là où se trouve notre principale logique métier de l'application. La couche de domaine se compose de trois sections. La section des entités, la section des cas d'utilisation et les référentiels les contractent. Voyons maintenant un peu chacune de ces sections. L'entité fait partie, contient les objets que nous utiliserons pour mettre en valeur les données de notre interface utilisateur. Les cas d'utilisation contiendront la logique principale, par exemple la validation du mot de passe et la validation du courrier électronique. Et le contrat des référentiels contient le contrat ou la classe abstraite à partir de laquelle nous obtiendrons les données. Désormais, la couche de données est la couche à partir de laquelle nous obtiendrons les données de sources externes, telles que des API ou des bases de données, ou même ou faux. La couche de données se compose de trois sections. Référentiels, implémentation, où nous implémenterons les référentiels qui se trouvaient dans le contrat de référentiels. Où il s'agit également de la section du modèle et des sources de données. Aucun modèle ne s'étendra des entités. Les sources anti-données récupéreront les données à partir d'API ou de bases de données ou même de nos employés. Maintenant, comme nous le faisions tout à l' heure, cette architecture propre aide à modulariser le code. Cela signifie également que chaque section est une section indépendante, la couche de présentation, la couche B, couche de domaine et les données sont toutes indépendantes les unes des autres. Donc, si nous modifions quelque chose dans la couche de données, cela ne devrait pas affecter la couche de présentation. Couche de domaine informatique. De même, si nous changeons quelque chose dans la présentation, cela ne devrait pas affecter la couche de domaine et les données qui s'y trouvent. Maintenant que notre application dispose de couches distinctes pour l'interface utilisateur et la logique, elle permet également de tester le code. Rédaction de tests unitaires pour le, spécifiquement pour les logiques. Et l'écriture d'un widget pour DUI se fera très facilement. Avant de passer à la partie codage de ce cours, voyons d'abord ce que cela va réellement apporter l'apprentissage de l'architecture propre. Nous allons donc créer cette application qui montre les actualités. Et nous utiliserons une news ou une API, qui est une API open source. Maintenant, lorsque nous cliquons sur cette actualité, une nouvelle page s'ouvre où nous pouvons voir le reste des besoins. De plus, nous pouvons rechercher de nouvelles, disons que je n'ai pas vraiment montré les actualités recherchées. Nous allons maintenant créer une nouvelle application. Va nommer l' application d'actualités de l'application, n'est-ce pas ? Et nous ouvrirons l' application en code VS. OK. Voyons maintenant la structure du fichier. abord, nous aurons un dossier appelé features. Dans l'application que nous avons montrée. n'y a qu'une seule fonctionnalité qui montre les nouvelles, n'est-ce pas ? Ainsi, la nouvelle fonctionnalité à l'intérieur cette émission d'actualités comportera trois sections. Tout d'abord, la section présentation. La deuxième est la section du domaine. La troisième est la collecte de données. Maintenant, outre les fonctionnalités, aura également un fichier de base. Maintenant, le contenu du fichier de base ne sera pas seulement utilisé dans une ou deux fonctionnalités, mais dans l'ensemble du demandeur devrait le faire. Un dossier sera constant. Un autre dossier sera celui des échecs et les succès viendront dans cette partie plus tard dans le cours. Un autre sera celui des services. Ce sont des services externes que nous utiliserons tous, disons des packages. Il s'agit donc de la structure de base des dossiers. Dans la prochaine vidéo, nous allons commencer par l' interface utilisateur de l'application. Merci donc de nous avoir regardés. Nous vous verrons dans le prochain. 4. Entités: Bienvenue dans la troisième vidéo de notre série Flutter Clean Architecture, dans laquelle nous créons une application complète en utilisant l'architecture propre. Dans cette vidéo, nous allons passer en revue la couche de domaine. Et dans la couche de domaine, comme nous l'avons vu, nous avons trois sections. Les entités, les cas d'utilisation et le référentiel sont contractuels. Dans cette vidéo, nous allons jeter un coup d'œil à la partie MTN. Donc, avant de sauter dans le code, voyons exactement quelles sont les données sur lesquelles l'entité sera créée. Nous pouvons donc obtenir les données dans news api.org. Donc, si vous allez sur news api.org, vous pouvez y obtenir la documentation, connecterez et obtiendrez la clé API plus tard dans la section des données. Mais pour l'instant, voyons sur quel type de données nous allons travailler. Allez donc dans les documents, la documentation, puis cliquez sur tout. Il s'agit donc d'une API, et cette API nous donne, chaque fois que nous faisons une requête get, cette API nous donne des données json. Il faudra le nom de l'auteur, le titre, l'auteur est un format de chaîne. Comme vous pouvez le voir, le titin est également au format chaîne. Et nous avons également besoin de l' URL de l'image, les résultats au format chaîne. Et publié sur est également au format chaîne. Il s'agit de la date et de l'heure. Le contenu est également au format chaîne. OK, maintenant faisons de notre entité. Nous allons donc passer à la section Fonctionnalités. Et dans la section domaine, nous créerons un nouveau dossier appelé entities. À l'intérieur des entités créera une nouvelle entité appelée News info point, point fera une classe connue sous le nom de news info. Et d'abord, il faudra une chaîne de titre. Le second sera une chaîne de modifications. La troisième sera la chaîne d'image que vous avez ajoutée avant sera une chaîne de contenu. Et le cinquième serait le type de statique public. Maintenant, ajoutons tout ce qui se trouve dans notre constructeur. Maintenant, sauf datetime. Tout peut être annulé. Par exemple, un article de presse peut avoir un titre, ou parfois même ne pas avoir de titre. Nous allons généralement avoir un titre pour chaque type d'actualité de chaque article de presse, mais il peut y avoir une erreur dans la base de données, peut-être que la personne qui écrit l'article de presse peut avoir J'ai oublié d'ajouter le titre. Nous devons donc considérer ces cas extrêmes. Nous devons donc rendre le titre nullable. L'auteur peut également être nullable afin que ImageUrl soit également présent ou non. Ainsi, le contenu peut également être présent ou non. Ainsi, nous sommes également donnés, mais la date et l'heure seront préservées car chaque fois qu'une nouvelle est publiée, elle doit être présente. Donc en dehors de cela, mis à part datetime, nous n'avons pas besoin de faire autre chose. Le mot-clé required signifie que chaque fois que nous appelons les news info, nous devons ajouter la date et l'heure. Maintenant, quels sont exactement les types Nullable ? Par exemple, si nous avons une chaîne de, disons name, et je donne un nom de RAM ici. Nous disons spécifiquement à Dark Là-bas. La variable name prend un type de données de chaîne et la valeur de la variable name sera toujours une chaîne et elle ne peut jamais être une variable NULL. Mais si nous l'affectons sous forme de chaîne avec un point d'interrogation, alors nous indiquons à dark que la variable name peut être une chaîne ou aucune. Par exemple, le nom peut également ne pas l' être. Cela fonctionnera également. Nous en avons donc fini avec l'entité qui fait partie de notre application. Dans la prochaine vidéo, nous allons découvrir un package très important que nous utiliserons, à le localisateur de services ou le package Get it. Merci donc d'avoir regardé cette vidéo. On se voit dans le prochain. 5. Service Locator Package: Bonjour et bienvenue dans la quatrième vidéo de la série Flutter Clean Architecture, dans laquelle nous créons une application complète utilisant une architecture propre. Dans cette vidéo, nous allons découvrir un package très important appelé package get it. Maintenant, qu'est-ce que ce package get it nous aide à adapter avant savoir que nous devons savoir exactement ce qu' est l'injection de dépendance. Alors, qu'est-ce que l'injection de dépendance exactement ? Voyons un exemple. Nous allons donc créer un nouveau fichier. Vous n'avez pas besoin de créer ce fichier. Ce fichier sera réservé à cette vidéo. Cela pourrait être DIE exemple point, point. Et ici, nous importons notre paquet matériel point point point. Et nous allons créer des widgets de liste ignorée. Commençons par ceci, puis je vais vous expliquer. OK. Comme vous pouvez le voir, il s' agit d'un bouton factice, dont il faut un bouton surélevé. Et vous pouvez voir que notre boîte à tétines dépend de notre bouton factice. Aussi. Nous pouvons voir que nous avons un bouton factice, qui est un bouton surélevé. Nous avons une boîte factice, qui dépend du bouton de détermination. Nous avons une carte factice, qui dépend de la boîte factice, qui dépend encore une fois du bouton factice. Et nous avons notre page factice, qui dépend de la carte factice, qui dépend de la boîte factice, et qui dépend du bouton factice. Maintenant, si c'est le cas, disons une classe d'informations de bouton qui stocke les informations du bouton. Par exemple, disons x ici. Et si nous voulons passer ceci ici, afin que nous puissions utiliser celui-ci ici. Nous devons donc maintenant passer ces informations de bouton dans tous ces widgets. Voyons comment nous avons passé notre bouton factice en entier, dans notre boîte à tétines. Maintenant, nous devons passer les informations du bouton dans nos cartes factices afin pouvoir les utiliser dans notre boîte à tétines. Maintenant que nous utilisons les informations du bouton de notre carte factice, nous devons également les transmettre sur notre page factice. Nous avons donc vu que nous n'utilisions que les informations du bouton de notre bouton factice. Mais comme tout cela est dépendant, nous devons donc passer les informations de notre bouton tout en haut. Donc, pour éviter ce problème, vient D, récupérez-le. Maintenant, pour y accéder, nous devons également appeler spécifiquement notre fonction de services d'installation dans le fichier point point point principal. Donc pour faire ça, d'abord, nous devons donner sa première liaison de facteur qui assure l'initialisation. Celui-ci initialise les éléments nécessaires pour que les plateformes natives requises dans notre iOS et Android soient construites avant d'exécuter quoi que notre iOS et Android ce soit dans l'application. Nous allons maintenant appeler les services d'installation, et maintenant c'est terminé. C'était donc tout pour cette vidéo. Dans la prochaine vidéo, nous utiliserons le package get it dans la partie Cas d'utilisation et référentiels. Et nous avons également besoin du localisateur de services pour l' instant, vous pouvez le supprimer, les créerez dans la prochaine vidéo. Merci donc de nous avoir regardés. On se voit dans le prochain. 6. Usecases et dépôts: Bonjour et bienvenue dans la cinquième vidéo de notre cours d' architecture Flutter Clean, dans laquelle nous construisons une application complète l'aide de l'architecture Flutter Clean. Dans la vidéo d'aujourd'hui, nous allons découvrir les cas d'utilisation et la repolarisation et les référentiels dans la section domaine. Passons donc à nos fonctionnalités. Et à l'intérieur du domaine, créons un nouveau dossier appelé cas d'utilisation. Et créons un autre dossier appelé Repositories. Dans les cas d'utilisation, nous allons créer un nouveau fichier appelé fetch News. Dot. Dot créera une nouvelle classe appelée Fetch news. Et à l'intérieur de la classe, nous allons écrire une fonction appelée fetch news. Avant cela, je voudrais parler d'un package qui s'appelle package points. Voyons d'abord que le paquet de points blancs sera nécessaire. Passons à pop dot diff et recherchons des points. Nous allons importer ce package dans notre projet. Passons à un fichier YAML point de spécification de pub. Maintenant, généralement lorsque nous récupérons quelque chose ou que nous obtenons quelque chose ou à partir d'une fonction, nous pouvons généralement renvoyer un seul type de données. Par exemple, si nous avons un futur d' informations sur les actualités et que je dis « fetch news ». Cette fonction ne peut donc renvoyer que des informations d'actualité. Mais il peut y avoir un cas où, de notre back-end, nous ne recevons pas de nouvelles, mais nous recevons une erreur. Donc, ce que nous voulons faire , ce n'est pas retourner les nouvelles dans leur intégralité, mais renvoyer un échec. Comment pouvons-nous faire cela ? Nous pouvons le faire en utilisant des points. Alors importons d'abord les points. Et en utilisant ce début, nous pouvons créer l'un ou l'autre. Dans les deux cas, nous pouvons revenir aux types de données. Disons que l'un est int et l' autre est string. Maintenant, ce que nous voulons vraiment retourner, c'est un échec. Et y a-t-il une liste d'informations sur les actualités. Maintenant, créons cette classe d'échec. Et l'échec sera utilisé dans toute notre application. Pour cela, nous devons le créer dans le code. Nous avons déjà créé un fichier appelé échecs et succès. À l'intérieur, nous allons créer un nouveau fichier appelé faillances point, point. Nous créons une classe abstraite. Échec. Il y aura un message de chaîne qui contiendra le message d'échec s'il y en a un. Créons maintenant un nouvel échec appelé Fetch. Récupère la vidéo, ce qui prolongera l'échec. Et à l'intérieur, nous allons créer un constructeur constant. Quel échec ? Et puisque nous prolongeons l'échec, nous devons faire passer le message dans ce super. Maintenant, nous pouvons revenir, nous pouvons supprimer celui-ci. Nous pouvons maintenant renvoyer l'échec de la récupération ici. Si nous importons les Phineas. OK ? Il s'agit maintenant de la couche de domaine. Nous ne voulons pas écrire de business, logique de données dans notre domaine. Le domaine doit être composé uniquement de la logique métier, telle que le mot de passe, la validation, la validation par e-mail, etc. Ainsi, pour connecter la couche de données à la couche de domaine, nous devons utiliser des référentiels. Maintenant, comment pouvons-nous utiliser cela ? Allons dans nos dépôts et créons une nouvelle république. Tout d'abord, nous devons changer le nom des fake news. De fausses nouvelles. Cas d'utilisation, cas d'utilisation, afin que nous puissions séparer qu'il s'agit d'un cas d'utilisation. Maintenant, à l'intérieur de nos dépôts va créer un nouveau fichier appelé Fetch repo contract point, point. Maintenant, comme il s'agit d'un contrat, ce ne sera qu' un cours abstrait. Qu'entend-on par classe abstraite ? Par exemple, vous conduisez une voiture. Vous tournez le volant, volant dans la direction de la gauche. La voiture se dirige vers la gauche. Vous regardez dans la bonne direction, la voiture va dans la bonne direction. Vous savez qu'en tournant le volant, la voiture va à gauche ou à droite. Mais savez-vous quel est le fonctionnement interne de l'intestin que vous ne connaissez pas ? Les classes abstraites sont donc exactement comme ça. Cela nous donnera des fonctions qui nous permettront de faire le travail. Mais nous n'avons pas besoin de savoir quelle est exactement, comment est exactement la fonction, le travail effectué dans la fonction créera une classe abstraite partir du ventricule de récupération. Ici, nous aurons une fonction de l'échec futur. Mais arrêtons le nouveau ZoomInfo. Non. Nous pouvons consulter nos cas d'utilisation et importer la Fed. Dois-je le mettre ici ? accord, je vais appeler le pôle végétal ici. Maintenant. Maintenant, nous pouvons simplement retourner les news fetch repo point fetch ici. Nous en avons donc terminé avec notre cas d'utilisation. Et que faisons-nous de notre dépôt ? Mais nous avons également une fonction de recherche ici. Donc, le simple fait d'avoir les nouvelles du PECC ne fonctionnera pas. Nous avons également besoin de rose pour la fonctionnalité de recherche. Par exemple, chaque fois que vous recherchez du texte, cette fois qu'il est entré, ce dont nous avons besoin est de revenir, nous recherchons des textes, des actualités ici. Pour ce faire, nous devons également passer un autre champ appelé texte de recherche. Maintenant, cela peut être nul. Nous recherchons du texte quand il est nul, affichera simplement les nouvelles normales. Et lorsque le texte de recherche n'est pas nul, cette fois-ci affichera les actualités de la recherche. Maintenant, nous devons également l'ajouter dans nos cas d'utilisation. Ici aussi, nous allons ajouter une chaîne de texte de recherche. OK ? Maintenant, c'est terminé. Dans la vidéo suivante. Nous y travaillerons sur les données. Merci donc de nous avoir regardés. On se voit dans le prochain. 7. Des mannequins: Bonjour et bienvenue dans la sixième vidéo de notre série Flutter Clean Architecture, dans laquelle nous créons une application complète en utilisant l'architecture propre. Dans cette section, nous allons commencer la couche de données. Et à l'intérieur des données, on commencera par les modèles. Nous allons donc d'abord créer un dossier dans le dossier data, Fault Models. À l'intérieur des modèles, créons un nouveau modèle appelé News info model point, point. Et créons une classe appelée News info model, qui étendra les informations sur les actualités. Maintenant, vous devez créer un constructeur de classe modale et être super super fonction. Voyons maintenant ce que demande la super fonction. Il est obligatoire de demander un DateTime. Le nom de l'auteur, le contenu, l'image que vous avez détecté. Nous savions que le contenu de l'imageURL du titre et l'auteur sont tous des chaînes et que datetime, datetime time. Mais les données que nous obtiendrons seront au format JSON. Tout. Nous aurons un type de données différent. Voyons donc d'abord quel type de données sera satisfait. Nous devons donc aller sur news api.org, aller à la documentation. Dans la documentation, allez à tout. Et voyons quel est le type de données de nos données que nous obtenons de notre actualité api.org. Apl est une chaîne, ce qui n'est pas grave. Title est également une chaîne, ce qui est très bien. Tu es suffisant. Image est également une chaîne. Nous l'avons publié, qui est le DateTime. Il est également en chaîne, ce qui n'est pas souhaitable. Mais pour noter, le contenu est également dans Street. D'accord, nous savons maintenant quels types de données nous obtenons de notre API. Alors écrivons ici. Quand écrire. Nous avons d'abord besoin du titre, puis du nom de l'auteur, puis de l'URL de l'image , du contenu et des données. À l'intérieur de ce super, allez-vous définir le titre, le titre ? Puisque le titre de nos actualités est également une chaîne qui est nullable. Et ici aussi, title est une chaîne malléable. Donc c'est bon. Et notre auteur dans nos informations d'actualité est une chaîne qui est nullable. Ici aussi, c'est une chaîne qui est nullable. Nous pouvons donc simplement le passer. L'URL de notre image est également une chaîne pouvant être annulée. URL de l'image Hero, qui est une chaîne pouvant être annulée. Nous le passons juste ici. Et notre contenu est également le même que vous pouvez voir maintenant nos actualités, gestuelles, qui sont nullables et héros, donc c'est une chaîne. La datetime, cependant, dans nos actualités, est une date et heure qui n'est pas nullable. Mais dans notre modèle d'information sur les actualités, nous l'avons défini sur une chaîne qui n'est pas de niveau. La raison en est que les données que nous obtenons sont également une chaîne. Et nous nous attendons à ce que, dans certains cas, cela soit nul, nous devons donc nous en occuper. Donc, ce que nous pouvons faire ici est de créer une fonction appelée Get date, time. Au format date et heure. Nous écrivons une fonction avec. Supprimons la constante ici. Prenons une fonction statique et qui aura un type de retour datetime portant le même nom. Et ici aussi, nous allons passer une chaîne de datetime, qui n'est rien d'autre que celle-ci. Passons ce flux ici. Maintenant. Tout d'abord, nous dirons si DateTime est égal, égal à null, alors ne rien faire. Il suffit de renvoyer une date et une heure du point datetime actuel. Maintenant, nous pouvons obtenir la fonction datetime actuelle, datetime point now. Et si le DateTime n'est pas nul, que faire ? Ensuite, il y a une fonction très utile de la date qui nous permet d'analyser la chaîne en type de données datetime. Voyons comment nous pouvons y parvenir. Nous écrirons la dernière fois. Datetime, format datetime car pour dater time point trépieds, en utilisant datetime. Maintenant, les trépieds le font. Ce que font les trépieds, c'est qu'ils essaient de convertir la chaîne date heure, qui est celle-ci, en un type de données datetime. Ici aussi, nous pouvons simplement donner un non nullable, ce qui signifie qu'ici le datetime ne peut jamais être nul. La raison en est que nous avons déjà vérifié si l'heure est nulle, alors nous retournerons Time point maintenant. Donc, à l'intérieur du else, le datetime ne peut jamais être nul. Nous pouvons donc donner ce point d'exclamation. Et les mécaniques disent spécifiquement qu'à l'intérieur de l'autre, la date et l'heure ne seront pas nulles. De plus, les trépieds renvoient la date et l'heure, mais qui est nullable. Maintenant pourquoi est-il nullable ? Si, disons qu'il essaie d'analyser. Nous n'avons pas besoin de donner spécifiquement le point d'exclamation ici puisque nous sommes déjà vérifier si le DateTime n'est pas là. Maintenant, pourquoi la fonction de trépieds point datetime renvoie une date et une heure qui est nullable. La raison en est que les trépieds essaient de transmettre le format datetime ou la chaîne datetime à un type de données datetime. Mais disons qu'il ne parvient pas à le convertir. Disons que nous avons une chaîne qui est quelque chose de bonjour. Maintenant, ce bonjour ne peut pas être, ce bonjour ne peut pas être converti en datetime. Datetime peut être converti, disons que quelque chose comme ça peut être converti, converti en datetime, mais hello ne peut pas être converti. Donc, que se passe-t-il lorsque nous donnons des textes qui ne peuvent pas être convertis en datetime, cela renvoie simplement une valeur nulle. Changeons le bonjour pour dépendre. Maintenant, si le format datetime, datetime est égal, égal à null, nous retournerons également le point datetime. Maintenant. Cela signifie qu'il a essayé d'analyser le datetime, qui est au format chaîne, en un datetime au format datetime, mais il n'a pas pu. C'est donc la raison pour laquelle nous renvoyons la date et l'heure de ce moment présent. Mais s'il n'est pas nul, si DateTime n'est pas nul, alors nous voulons dire qu'il a des mots analysés. Si c'est le cas, il a pu analyser les données au format chaîne en Edit time, qui est au format datetime. Alors cette fois-ci, nous ne faisons rien d'autre que de revenir. OK, donc celui-ci est terminé. Maintenant, nous devons créer une autre méthode, qui est très utile. Nous allons créer une méthode de cartographie du thrombus. Créons, puis je vous expliquerai. Maintenant, ce que fait cette méthode, c'est la première semaine, type de données que nous obtenons. Ici, nous obtenons des données au format JSON. Ou nous pouvons dire qu'il s' agit d'un format de carte, qui est une chaîne, qui est notre t. Et la valeur est dynamique, ce qui signifie qu'il peut s'agir d'une chaîne. Cela peut être, cela peut être fait, cela peut être n'importe quoi. Dynamique signifie qu' il peut s'agir d'une chaîne, il peut s'agir de n'importe quel type de données ou d'une politique nulle. Pour convertir cette carte en musée pour le modèle, nous avons besoin d'une fonction et cette fonction provient de. Maintenant. Nous devons le dire spécifiquement comme un fait. Maintenant, j'ai expliqué dans la vidéo du localisateur de services, qu'est-ce qu'une usine et qu'est-ce qu'un singleton ? Singleton. Instance is a singleton est l'endroit où nous utilisons la même instance dans toute l'application. Mais dans une méthode d'usine. Ce qui est fait, c'est créer une nouvelle instance de cet objet chaque fois que nous appelons. Ainsi, chaque fois que nous appellerons une méthode from map dans notre application, cela créera une nouvelle instance du modèle d'informations sur les actualités. Supposons que nous appelions cinq fois depuis la carte dans notre application. Ainsi, cinq nouvelles instances de news et de modem seront créées. Mais s'il s'agissait d'un singleton, alors même s'il s'agissait d'un rappel de cinq fois, il ne créerait qu' une seule instance. OK ? Maintenant, nous devons également fournir les données ici, afin que le titre soit mappé. Et si nous pouvons voir ici, nous avons juste besoin de cartographier ces valeurs ici. Le titre ici, nous pouvons simplement le copier ici. Et à partir de la carte avec le titre, l'auteur sera cartographié. Et si nous le vérifions ici, l'auteur est cet auteur. Nous pouvons donc copier celui-ci et le coller ici. L'URL de l'image sera l'URL de la carte et de l'image. URL trop. Nous copierons celui-ci et le collerons ici. Le contenu est mappé. Vérifions-le ici. Ce contenu et la date-heure qui est publiée agissent avec ce sujet, celui-ci. Et maintenant, nous en avons fini avec les news de model.fit from map method, qui convertit les news bidirectionnelles dynamiques de la chaîne de carte. Et pour Lord. Merci donc d' avoir regardé cette vidéo. Dans la prochaine vidéo, nous allons approfondir la section des sources de données et des référentiels. Merci de nous avoir regardés. On se voit dans le prochain. 8. Sources de données et dépôts: Bonjour et bienvenue dans la septième vidéo de notre série d' architecture aplatie où nous créons une application complète à l' aide d'une architecture allégée. Dans cette vidéo, nous allons parler sources de données et des référentiels dans la section des données. Passons d'abord à notre fichier de données et créons un nouveau dossier appelé Référentiels. À l'intérieur des dépôts créera un nouveau fichier appelé Fetch report. Dans IMP, ce qui signifie point d' implémentation, point créera une nouvelle classe appelée which report IMP, qui implémentera un tel dépôt. Maintenant, nous devons également le faire, puisque nous implémentons le dépôt fetch, lequel était présent dans la couche de domaine. Nous devons donc remplacer cette fonction dans le dépôt IMP récupéré. Pour passer outre, vous ne pouvez tout simplement pas faire une seule chose. Cliquez ici, appuyez sur Ctrl et points, et créez, puis appuyez sur ici, créez un remplacement manquant . Il créera automatiquement la fonction. Maintenant, nous ne voulons pas lancer d'erreur ici, supprimons donc ceci. À l'intérieur de cette fonction. Nous appellerons les sources de données. Avant cela, nous devons créer la source de données. Créons donc un nouveau dossier dans le fichier de données appelé sources de données. Et à l'intérieur de la source de données créera un nouveau fichier appelé à partir de ds distants. Ds signifie des noms de sources de données plutôt que, comme son nom l'indique, nous récupérons les données de la source de données distante, qui est une API externe. Nous l'avons donc appelé fetch from multiple sources. Créons une classe abstraite à partir d'une source de données distante. À l'intérieur de la classe abstraite, nous aurons un futur qui renverra une liste d'informations sur les actualités. Modéle. Le nom sera fetch news. Et nous allons également intégrer la fonctionnalité de recherche à l'aide du texte de recherche. Dans la dernière vidéo, j'ai expliqué si le texte de recherche était nul, alors les nouvelles normales lorsqu'elles visuelles et qu'il redémarrait les textes n'étaient pas perdues. Ensuite, les outils de recherche en boisseau. Maintenant, dans l'utilisation de la récupération, nous devons appeler un service externe, tel que le service HTTP ou le service complet, l'aide duquel nous obtiendrons les données de notre API externe. Alors allons-y. Tout d'abord, nous publierons avant de créer une map de string dynamic. Cela contiendra les données qui nous sont fournies par l'API. Pour ce faire, nous devons rendre le service. Mais dans cette vidéo, nous n' allons pas faire le service, nous allons donc simplement établir le contrat du service. Donc, dans le dossier principal, nous avons un dossier de services. Et dans le dossier services, nous créerons un nouveau fichier appelé HTTP, ou disons API que nous avons commencée puisque nous obtenons les données des API. Nous sommes donc en train d'écrire des API. Si ce n'est pas fait. Créons ce service d'API. Veuillez créer un service API de classe abstraite. Et à l'intérieur du service API créera un nouveau dossier. Future string Dynamic get data. Maintenant, nous pouvons appeler celui-ci. Ici. Ce que nous pouvons faire, c'est créer le service API. Comme il s'agit d'une classe abstraite, nous devons également implémenter celle-ci dans une classe séparée. Créons le verre. Protection du verre contre la floraison à distance Je me donne jusqu'à la condition qui implémente à partir de assistance à distance quelle est la fonction ? Et à l'intérieur, nous avons probablement imposé le service API. OK, maintenant nous avons appelé le service API, et ici nous appellerons la fonction get data dans notre surface API, n'est-ce pas ? Pas extrême. dynamique est égale à deux. Ou nous pouvons dire que les données sont égales à commencer, à devenir différentes. Nous devons également attendre ici, car cela renvoie une future carte et dynamique. Et puisque nous utilisons notre chaise, nous devons faire en sorte que cette fonction soit fonctionnelle. D'accord, nous obtenons donc les données, mais quelles sont les données que nous obtenons réellement, passons à news api.org. La documentation Insight passera en revue toutes les données que nous obtenons de l'API sous forme de carte. Et à l'intérieur de la carte, les données réelles que nous voulons, ce sont ces articles. Ces articles contiennent une liste de cartes. Alors laissez-moi d'abord coder et ensuite je le ferai. Donc, à l'intérieur des données, pour obtenir une liste, appelons-la liste d'articles. Nous pouvons voir ici que c'est, si nous supposons que tout cela est constitué de données, alors à l'intérieur des données, si nous obtenons les articles, les articles contiendront une liste. Maintenant, voici une liste de cartes, mais les cartes à l'intérieur de celle-ci et la demande dans le cœur sont un peu différentes. Donc pour cela, ce que nous pouvons faire est de créer une nouvelle liste à partir de la carte, de la chaîne, de la liste dynamique. Je n'ai pas vraiment initialisé à une liste vide. Et nous parcourons tous les éléments cette liste et convertissons chaque élément en une dynamique de chaîne de carte. Faisons-le. C'est ce que nous appellerions carte. Ce sera égal à la liste. Et nous dirons que ce type est aussi dynamique sur la carte. Nous allons maintenant ajouter cette carte à notre liste de cartes. Carte entièrement approvisionnée à. OK. Maintenant, ce que nous pouvons faire, c'est créer une nouvelle liste de modèles d'informations sur les actualités. Initialisons-le avec une liste vide. Nous allons maintenant parcourir tous les éléments de la liste de la carte. Nous convertirons chaque liste de en chacune des cartes de la carte, demain dans ce musée. Faisons-le. Maintenant. Nous utiliserons la méthode de carte forte que nous avons créée dans la section du modèle. Nous appellerons cela la perte de Phil Martin de la carte. Et la carte sera chacun des éléments contenus dans les cartes D. Nous allons maintenant ajouter le modèle de vendeur dans la liste des actualités, puis revenir en arrière. OK, c'est fait ici. Mais disons qu'il y a une erreur qui se produit ici. Supposons que notre fonction get data montre une exception. Nous devons donc tenir compte de ces exceptions ici. Donc, ce que nous pouvons faire, c'est copier tout ce code et le coller dans un bloc try catch. Donc, si nous obtenons une erreur, nous lancerons une exception. L'exception peut être n'importe quelle extraction. Mais ce que nous voulons réellement faire , c'est créer des exceptions personnalisées. Donc pour ce faire, nous devons aller aux échecs et aux succès, créer un nouveau fichier appelé exceptionnel Stark Dark. Et nous allons créer une exception personnalisée. Une telle exception implémente exception. Cette exception ici. C'est un plus donné par Dark et il a un constructeur d' usine. Comme nous l'avons vu dans les échecs, nous étendions l'échec, mais celui-ci, nous ne pouvons pas le faire ici parce que nous ne pouvons pas étendre une classe. Nous n'avons qu'un constructeur d' usine, nous devons donc l'implémenter. Créons donc l' exception fetch construite ici. OK ? Nous pouvons maintenant lancer cette exception. Vous pouvez écrire une exception. Donnons-lui aussi un message pour commencer. Et ouvrons-le. Nous en avons donc fini avec la fonction fetch news dans notre implémentation de fetch from remote data source. Plus. Appelons cette fonction dans notre référentiel. Mise en œuvre. Je reviendrai. Premier. Nous allons avoir le cours ici. Mais depuis une source de données distante. Maintenant, nous pouvons utiliser celui-ci. Recherché. Il indique que cela renvoie une valeur des futures nouvelles de la liste dans un format qui ne peut pas avoir de méthode puisque cette fonction la renvoie, soit un échec, soit une liste utilisant. Donc ce que nous devons faire, c'est le retourner comme ça, non ? OK ? Alors, que se passe-t-il ici ? Nous disons que puisque la fonction fetch nice, return, renvoie un futur d' échec ou une liste d'informations sur les actualités. Nous disons donc que cette fonction retournera côté droit de l'une ou l'autre valeur, ce qui signifie que l'une ou l'autre a deux valeurs, soit un échec, tout cela se déplace dans cette fonction, retournera le côté droit des articles mis en vente. OK ? Mais nous avons également vu que les sources de données passent par erreur ici ou exception ici. Nous devons donc également intercepter l' exception dans notre référentiel. Nous pouvons donc le faire en essayant catch block. Mais nous avons également vu que nous lancions une exception personnalisée de la section projet. Nous pouvons donc intercepter l'exception client sur l'exception pitch. Et maintenant, nous pouvons aussi lancer un échec. Nous reviendrons donc à gauche. Quel échec avec un message E point message. Ce E n'est rien d'autre qu'un objet d'exception fetch. Nous devons également renvoyer la radiation de vos données pour de telles nouvelles. Maintenant que nous en avons terminé avec l'implémentation du référentiel, nous en avons terminé avec les sources de données. Récapitulons encore une fois. Nous avons créé, nous avons implémenté le rapport fetch dans classe de mise en œuvre de niveau scientifique. Nous avons ensuite passé en revue les sources de données et créé la source de données pour poser le diagnostic. Nous avons fait un résumé des coûts du service API, que nous mettrons en œuvre dans la prochaine vidéo. Ensuite, nous modifierons les types de données requis. Types de données de la dynamique de l'équipe Maps au musée pour le modèle, puis renvoient les actualités ou trois exceptions de récupération. Et puis à l'intérieur du dépôt, nous avons utilisé un autre bloc try-catch où s'il n'y avait pas d'erreur, nous renvoyions le droit de l'échec, qui est list, news info et toutes les exceptions. Nous allons détecter l' exception qui a été renvoyée dans nos sources de données. Ici. Nous attrapons cela, puis retournons le côté gauche du, ce qui est un échec, qui est récupéré. C'est donc tout pour cette vidéo. Dans la prochaine vidéo, nous allons approfondir les services. Merci donc de nous avoir regardés. On se voit dans le prochain. 9. Services: Bonjour et bienvenue dans la huitième vidéo de la série sur l'architecture propre Flutter, où nous créons une application complète en utilisant une architecture plus propre. Dans cette vidéo, nous allons parler de la partie services. Nous allons donc d'abord passer à la section code. Et dans les services, nous avons déjà créé une classe abstraite appelée service API, qui nous donne le, qui a une fonction, Get Data, qui renvoie une future chaîne de chaîne de carte dynamique. Implémentons donc la surface de l'API ici. Plus IMP du service BI. Imp est des conditions de mise en œuvre qui resteront si le service BI. Nous allons maintenant ajouter la fonction ici et la remplacer. Ici, nous utiliserons un package et obtiendrons des données de notre API externe. Et le package s'appelle HTTP. Alors pour ça, allons-y. Et ici, nous écrirons HTTP. Nous allons récupérer le colis. Ainsi, en faisant cela, nous pouvons copier le nom du package. Et ici, nous allons essentiellement emballer à l'intérieur je recherche le vecteur. Nous allons maintenant importer le package dans notre service API. Et nous dirons que HTTPS, HTP, HTTP importants. Nous pouvons obtenir les données de notre HTTP et comment de notre API. Et comment nous pouvons le faire, c'est qu'il existe une fonction utile appelée HTTP GET. Et cette fonction get, nous obtiendrons les données requises de notre API externe de celle-ci. Donc, ce que nous devons faire c'est donner, voyons d'abord ce que prend cette fonction get. La fonction get prend un URI, comme vous pouvez le voir ici. Et vous obtenez la fonction prend également des en-têtes, mais nécessitera également paramètres de requête. Comme on peut le voir. C'est la principale API qui fournira le q égal à Bitcoin. La clé Api est égale à F via une clé API qui va à GPI. Conservez cela dans nos paramètres de requête afin que nous devions également l'ajouter ici. Voyons donc comment nous allons procéder. OK, ajoutons d'abord l'URL pour cela. Nous devons fournir l'URL ici, n'est-ce pas ? URL de streaming, et nous l' ajouterons également ici. Comme vous pouvez le constater, vous avez également besoin de paramètres de requête. Nous aurons donc une autre carte. String, dynamique. Parents prêts. Nous devons l'ajouter ici. OK ? Maintenant, l'URL n'est pas une véritable URL de chaîne, URI. Nous devons analyser la chaîne, vous l'ajoutez de n'importe quelle manière. Nous pouvons le faire en utilisant vos chemins de pensée. Et pour donner les paramètres de la requête Kusto, nous devons appeler une fonction replace. Et ici, nous pouvons ajouter les paramètres en utilisant deux particules grasses. OK ? Maintenant, nous obtenons les données de notre intestin. Stoquons les données quelque part. Pour ce faire, nous devons faire en sorte la fonction à une fonction sinc. Et le résultat ici, nous aurions une réponse finale égale à http.get. Voyons ce que ça donne. Elle renvoie une réponse. Écrivez-le ici. OK, maintenant, si le code d'état de la réponse est égal à 200, cela signifie que nous avons réussi à obtenir, nous avons réussi à obtenir les données de l'API. Nous pouvons donc maintenant renvoyer les données ici, renvoyer le corps de la réponse. Le corps est en fait au format chaîne, ce qui est Jason forward. Nous devons le décoder et le transformer en format de carte. Puisque nous renvoyons la chaîne de caractères de carte dynamique à partir de la fonction get. Donc, dans le bon décodage par points json, et à l'intérieur, nous obtiendrons la réponse par défaut, d'accord. De plus, nous pouvons écrire en tant que réponse dynamique Math String si le code d' état n'est pas 200. Cela signifie que nous n'avons pas pu obtenir les données de notre API. C' était un problème. Il y a eu un problème de réseau. Cette fois-ci, nous lancerons une exception avec un message. Voyons voir. Statut, état du point de réponse . Nous avons parlé. OK. Ce que nous faisons ici, c'est que nous obtenons les données de notre API à l'aide d'un paramètre de requête personnalisé. Et si nous obtenons les données, nous les renvoyons dans des cartes au format dynamique. Et si vous n' obtenez pas le retour, alors nous faisons exception. Passons maintenant à la section des données de nos sources de données et à l' implémentation de la récupération des sources de données distantes. Nous allons donner l'URL ici et le paramètre de requête. Maintenant, pour ce faire, vous devez aller ici et obtenir la clé API est pressée sur le bouton de la clé API gate. Vous devez donner votre prénom, votre adresse e-mail et choisir un mot de passe. Et soumis. Après cela, vous obtiendrez la clé API. Mais ici, je vais juste me connecter. Alors laissez-moi me connecter , puis je vous montrerai. OK, j'ai ma clé API ici. Je ne fais que le copier. Stockez-le dans un endroit sûr pour le moment, créons un nouveau dossier appelé strings start. Ce n'est pas une chaîne, ce sont des chaînes. Cordes. Et j'ai installé la clé API ici avec une variable statique. Aussi. Je serai toujours des URL également ici. J'en ai donc un, tout ce que tu as ajouté, qui est celui-ci. Je copierais celui-ci et la stoechiométrie. OK. Passons maintenant à notre fonction «  fetch news ». Extraction à l'envers à partir de données distantes pour certaines limitations. Et regardez ces URL seront des chaînes, API point de tout ce que vous êtes et pourquoi le paramètre de requête sera une carte. Et cela contiendra des cookies. Voyons quels livres. L'un d'eux sera Q, le texte source. Si nous n'avons pas une sorte d'étapes, nous pouvons simplement lui donner un texte concret. Par exemple, comme les lignes de cockpit. D'accord, donc l'utilisation normale que nous aurons, sera de l'obtenir dans les gros titres. Donc, si nous copions celui-ci et que nous devons coller le KPI de la clé API, vous ne l'avez pas encore fait. Tout le titre que nous utiliserons lorsque nous rechercherons des nouvelles de tous les articles. Et les principaux titres seront recherchés lorsque le, il n'y a pas de texte dans notre recherche. OK ? Donc, ce que nous pouvons faire, si le texte de recherche n'est pas égal à null, ce temps commence à partir de tous les articles. Si notre texte de recherche est égal, égal à nul, ce délai commence à partir des meilleurs modèles. C'est l'opérateur ternaire, dont nous voyons que si X est nul, faites la première chose après le point d'interrogation. Et si le texte de recherche n'est pas égal à si début est nul. Ce truc avec la deuxième chose. Il s'agit de l'opérateur ternaire. Si le texte de recherche n'est pas égal à null, faites la première chose qui est présente après le point d'interrogation, qui est des chaînes, API everything. Et si le texte de recherche est égal, égal à nul, alors mettez le second, ce que j'ai peut-être longuement parlé. Donc, quand il y a quelques conseils de recherche lors de la recherche de musique de notre tout. Et s'il n'y a pas de telles étapes, nous revenons simplement au sujet. Et à l'intérieur de notre paramètre de requête tombe. Nous écrirons donc si le texte de recherche est égal, égal à nul, cette fois-ci nous ne le ferons pas, nous devons fournir le pays. Donc, dans le bon sens. Contrairement à l'Inde. Ou nous pouvons trouver US-Soviétique. Et si le texte de recherche n'est pas égal à null, ce moment-là, nous devons fournir à l'intérieur ou tout si nous voyons, nous devons fournir un indice qui est le texte de recherche mais qui reçoit Bitcoin, cela peut être n'importe quoi. Nous écrirons donc cube et ce sera égal au texte de recherche. Et quoi qu'il en soit, le texte source est nul ou non, nous devons fournir la clé API, qui est également donnée ici, qui est également donnée ici, n'est-ce pas ? Clé Api. La clé API sera unique pour chaque utilisateur. Et vous devez l'obtenir après vous être connecté ou inscrit sur le site music BI.com. J'ai mon roi du FBI et je l' ai rangé dans les ficelles. Plus. Utilisons donc cette API Scott extrême. OK, nous avons donc implémenté nos services dans le fichier point point point du service API. Et nous avons utilisé ce service dans notre fichier de sources de données. Maintenant vient une partie très importante. Nous appelons le service à l'intérieur de la construction à partir de la source de données distante. Dans notre vidéo sur le localisateur de services, nous avons discuté d'un conseil très utile sur la façon dont nous pouvons enregistrer ces services dans une seule fonction et les appeler dans la fonction principale. Et nous n'avons pas à nous soucier de l'initialisation de ces classes. Tous, Allons-y. abord, nous allons créer un nouveau dossier appelé ou un nouveau fichier dans notre propre dossier appelé service. Des services. Localisez notre sombre sombre. À l'intérieur, nous importons le paquet, écrirons la version finale, nous l'obtiendrons. Sl. Sl signifie que le localisateur de services est égal à l'instance. Nous allons créer une nouvelle fonction appelée configurer les services. C'est ici que nous avons enregistré nos services. Le premier service qui sera enregistré est le service API, Justin Sterling. Tous les services sont des singletons. Ainsi enregistre le service d' API singleton. Et ici, nous donnerions la mise en œuvre du service Cluster API implémenté. Nous enregistrerons bien les sources de données, donc nous écrirons fetch from remote, ds. À distance, oui, je le suis. Maintenant, nous pouvons voir qu'il est dit qu'il existe un paramètre additif k, donc c'est obligatoire. Mais passons à notre ici. Et maintenant, nous pouvons supprimer celui-ci et obtenir le service API de nos services ESL. Il est important de continuer. Nous pouvons l'appeler service API. Et Wallah. Nous n'avons pas besoin d'appeler le service API dans notre constructeur. Nous pouvons l'obtenir directement auprès d'un service. Merveilleux Revenons à notre enquête est localisée et enregistrée dans notre référentiel. Nous appellerons le rapport de lot. Et nous avons enregistré la mise en œuvre des effets d' entraînement. Ici aussi, nous n'avons pas besoin de défauts du corps car nous pouvons l'obtenir de notre service avec l'un ou l'autre, Allons dans notre implémentation végétale. Supprimez celui-ci et récupérez-le auprès de notre service ou mieux. OK, super. Maintenant, comme nous avons un rapport de défauts supplémentaires de l'implémentation, nous pouvons également passer à nos cas d'utilisation phi. Supprimez celui-ci et récupérez le dépôt dans notre localisateur de services. Maintenant, comme nous l'avons vu dans notre vidéo sur le localisateur de services, il suffit de donner la classe de localisateur de services ou d'écrire simplement la fonction de localisateur de services. Ça ne marchera pas. Nous avons besoin de toutes les fonctions à l'intérieur du fonds p main.out. Et pour le, pour appeler la fonction. Nous devons également donner la meilleure initialisation de l' assurance contraignante. Cela garantira toutes les choses que j'ai initialisées avant d'appeler la fonction dans Berlin gap. Maintenant reconstruisons la fonction que nous avons beaucoup écrite. Voyons si tout fonctionne bien ou pas. Ouverture. Pour l'instant, tout fonctionne bien. Récapitulons ce que nous avons fait. Nous avons implémenté notre service API ici. Nous avons écrit les données get à partir du package HTTP. Et nous avons aussi, nous l'avons fait si le livre response.status est égal à 200, puis renvoyer le corps de la réponse en tant que réponse dynamique maximale pour le code des sitters n'est pas opposé à 200, ce qui signifie que c'est une erreur dans l' obtention des données de l'API lorsque nous lançons une exception. C'est donc tout pour cette vidéo. Dans la prochaine vidéo, nous aborderons en profondeur la couche de présentation. Merci donc de nous avoir regardés. On se voit dans le prochain. 10. Bloc avec un aperçu de la gestion de l'état de Cubit: Bonjour et bienvenue dans la neuvième vidéo de notre série Flutter Clean Architecture. Nous créons une application complète en utilisant une architecture propre. Dans cette vidéo, nous allons en apprendre davantage sur la gestion de l'État, qui est bloquée et cubique. Dans cette vidéo, nous allons apprendre la gestion de l'État à l'aide d'un exemple. Et dans la prochaine vidéo, nous allons implémenter notre gestion de l'État dans notre application. Donc, avant de commencer, nous devons ajouter deux packages. L'un est le paquet de blocs. Ajoutons le package de blocs dans notre fichier YAML Pub spec dot. Et les autres paquets flottent en bloc. Ajoutons également le bloc de flottement. Vous pouvez également installer une extension pratique appelée block. Grâce à cela, vous pouvez facilement créer des blocs dans votre application. Laissez-moi vous montrer comment. Il suffit d'aller dans le dossier principal. Sélectionnez le dossier dans lequel vous souhaitez créer le bloc ou la coudée. Ici, je veux créer une nouvelle coudée, donc je vais cliquer sur le cube et donner le nom. Disons que je nommerai celui-ci sur Exécution. Je peux donc voir que mon cube est, a été créé. Je nommerai également cette coudée comme texte de soulignement deux, mais maintenant nous allons également créer une nouvelle page appelée text DAG. Maintenant, vous n'avez plus besoin de créer la page de texte et de détecter le cube. C'est juste pour vous montrer un exemple à l'intérieur du texte dans lequel je vais importer un point matériel, point et un apatride avec lui. Page de texte. La page de texte contiendra un échafaudage avec notre corps. Au centre. Il aura un enfant de bouton surélevé. Le bouton surélevé sera enfoncé. Suivons, avons une fonction vide ici et un enfant devrait être du texte. OK ? Passons maintenant à notre texte. Ce mètre cube est le cube réel. Et voici les étapes. Créons de nouveaux États. Il s'agit de l'état initial, est-à-dire de l'état qui est présent lorsque l'application est en cours d'exécution. Si vous allez le cube, nous le sommes, nous pouvons voir que chaque fois que le cube a été créé, nous l' initialisons déjà avec l'état initial. Donc, à l'intérieur de notre État, nous ferons des nouvelles pour les nouveaux États. L'un est le chargement du texte et l'autre est le texte. Je l'ai dansé. OK ? Créons maintenant une nouvelle fonction. À l'intérieur de notre fonction cubique, la nouvelle fonction de texte sera affichée. Et dans cette fonction, ce que je veux faire, c'est me laisser d'abord passer à notre moyenne et changer la page d'accueil pour une page suivante. Ce que je veux réellement faire c'est que chaque fois que je clique sur ce bouton, je veux afficher un indicateur de progression circulaire. Et après un certain temps, je veux montrer ici, ça prend ça, c'est-à-dire, disons terminé ou terminé. Faisons-le. Donc, dans un premier temps, je vais émettre un nouvel état, qui est l'état de chargement du texte. Après un certain temps, attendons 1 seconde. Et après avoir attendu 1 seconde, je veux émettre le texte, je l'ai dansé. OK ? Notre fonction ici est en train d'être remplie. Appelons maintenant cette fonction. Chaque fois que nous cliquons sur le bouton clic, nous allons sur notre page de texte. Et ici au lieu d' être pressé, je vais le donner. Maintenant. Avant cela, j'ai également besoin d' importer les paquets de blocs de flutter. Ensuite, nous pouvons appeler la fonction en utilisant la lecture contextuelle par points. Et à l'intérieur de la lecture, je nommerai la coudée d'où nous allons prendre le point de fonction. Afficher le nouveau texte. OK ? Maintenant, ce que je veux faire, c'est créer un bloc ici ou un générateur de blocs ici. Ainsi, au lieu du texte, je montrerai une fois l'indicateur de progression circulaire , puis un texte qui dit que non. Ce que nous voulons afficher à la place de ce bouton, lorsque nous cliquons sur le bouton, nous voulons afficher un indicateur de progression circulaire puis une texture. Donc, ce que nous devons faire, c'est changer le bouton surélevé, vouloir un indicateur de progression circulaire, puis le faire. Voyons comment nous allons procéder. Nous allons le faire en utilisant un widget appelé block building. Nous allons donc l'écrire ici. Ce générateur de blocs sera composé d'une coudée de texte. Et l'état suivant dans le générateur de blocs, nous appellerons un constructeur, ce qui prendra deux choses. Si on voit. L'un est le contexte bâti et l'autre est l'état suivant. Donnons donc ces contextes et ces états. Maintenant. Si l'état est fixe, initial, ne rien faire. Et donc le bouton, comme c'était le cas auparavant, si l'état est le chargement du texte, alors ne faites rien d'autre qu'un indicateur de progression circulaire. Maintenant, si le texte est, si l'état n'est pas le texte initial ou le chargement du texte, alors si vous allez dans notre texte et qu'il ne reste qu'un seul état, c'est le texte sur notre autre qui sera toujours le texte en bas de l'état. Ainsi, lorsque l'état est texte terminé, affichez un texte qui est terminé. Maintenant, pour utiliser le bloc, nous devons fournir le bloc à un widget qui est le parent des textes avec lui. Maintenant, si nous voyons le parent de la page de texte rejet est le widget de l'application matérielle. Nous devons donc fournir notre bloc, qui est le texte humide à l'intérieur de notre métrique ou au-dessus de notre widget d'application matérielle. Alors, comment pourrait-il le faire ? Voyons voir. Nous allons le couper à partir de là, et nous utiliserons un widget appelé multi-blocs. Fourni. Ici. Nous pouvons avoir plusieurs fournisseurs. Ainsi, un fournisseur sera un fournisseur de blocs. Et nous allons le créer en utilisant un contexte, qui renverra une coudée de texte. Et l'enfant sera notre matière à présent. OK ? Maintenant, si nous redémarrons notre, voyons ce qui se passe. OK ? Nous pouvons donc voir que notre bouton est là. Voyons ce qui se passe lorsque nous cliquons dessus. Nous cliquons sur le bouton. Il montrait l'indicateur de progression circulaire , puis les détails de l'entreprise. Faisons le délai à quatre secondes , puis voyons à nouveau l'application. OK ? Nous pouvons donc voir qu'une fois que nous cliquons sur le bouton, l'état de chargement du texte est en cours d'initialisation. Et après quatre secondes, le texte a été initialisé. C'est ainsi que fonctionne le bloc avec cubique. C'est donc la compréhension de base de la gestion de l'État que nous allons utiliser. Dans la prochaine vidéo, nous allons implémenter la gestion de l'État dans notre application, ce qui signifie l'application News. Merci donc de nous avoir regardés et nous vous verrons au prochain. 11. Implémentation de blocs et de cubit dans l'application: Bonjour et bienvenue dans la dixième vidéo de notre architecture Flutter Clean qui montre où nous construisons une application complète en utilisant Pain Architecture. Dans cette vidéo, nous allons intégrer notre gestion de l'état des blocs et des qubits dans notre application. Supprimez donc d'abord les coudées d' exemple, que nous avons faites dans la vidéo précédente. Donc nous pouvons le faire, c'est très bien. Nous pouvons supprimer la page de texte. Maintenant. Celui-ci le fera également. Et au lieu de cela, nous fournirons, nous fournirons la coudée qui sera faite dans cette vidéo. Et ici, nous allons écrire la page d'accueil. Dans supprimer les importations. Génial. Redémarrons l'application. Les enfants ne peuvent pas être vides jusqu'à présent, nous allons simplement supprimer cet objet. OK ? Maintenant, nous allons créer un nouveau Cupidon. Nous irons dans la section de présentation, et à l'intérieur du dossier de présentation, nous ferons un nouvel appel de coudée. Actualités. Comme je vous l'ai dit dans la dernière vidéo, vous pouvez avoir une extension très utile appelée extension de bloc, l'aide de laquelle vous pouvez créer facilement une coudée, comme si vous pouviez cliquer avec le bouton droit de la souris ici et créer un bloc d'audit de coudée. Mais maintenant c'est la nouvelle coudée et le nouvel état que je nommerai ce nouveau stupide plié. Passons maintenant à notre cube de nouvelles. Nous pouvons voir que c'est par défaut qu'il a la nouvelle étape initiale. Et à l'intérieur des nouveaux États, nous avons une nouvelle étape initiale. Nous aurons deux autres États. Le premier état sera l'actualité. Passons à News Initial. Le deuxième état sera News loading, le troisième sera News Editor. Maintenant, à l'étape initiale des actualités, nous aurons une autre chose appelée D, liste des informations sur les actualités. Notre initiative de nouvelles contiendra donc les nouvelles qui seront diffusées ici. Maintenant, notre nouvel état initial contiendra les nouvelles qui seront diffusées ici. Mettons notre analyte initial de nouvelles que nous lancerons lorsque nous initialiserons initialement les actualités avec une liste vide. Regardons la constante. Ensuite, nous allons écrire une fonction appelée void fetch news function avec le texte de recherche ici. Ensuite, nous appellerons notre fonction à partir des cas d'utilisation, qui est cette fonction fetch snooze car elle enregistrera celle-ci dans notre localisateur de services. Disons donc que vous enregistrez ceci. Cas d'utilisation Stretch Nudes. Fetch le sait. OK. Passons maintenant à notre nouvelle compétence, mais point Phi. Et ici, nous allons obtenir le cas d'utilisation du réfrigérateur News. Nous allons importer la cellule ici. C'est Service Locator. Et d'accord, maintenant nous pouvons utiliser cet objet fetch News, use case dans notre fonction fetch news. Utilisons donc ça. Nous allons donc écrire Fetch News. Utilisez kickstart, récupérez les actualités avec le texte de recherche. Voyons ce que ça revient. Cela nous renvoie un avenir, soit un échec, soit une nouvelle dans une liste de choses. Obtenons donc le résultat de l'utilisation de wait. Maintenant, nous n'aurons que l'un ou l'autre après la Terre. Je vais donc écrire une dernière de ces nouvelles. Le résultat est égal à deux. Et cela aura un type de données d' échec ou de cette information difficile. Maintenant, nous avons le paquet tarts, qui nous donne l'un ou l'autre type de données, nous donne également une fonction très utile grâce laquelle nous pouvons séparer nos éléments, ce que nous ferons en cas d'échec. Et nous pouvons séparer les choses que nous ferons lorsque recevrons notre liste d' informations d'actualité. Alors, comment pouvons-nous le faire ? Nous pouvons le faire en utilisant la fonction complète que le DOD schizo, non ? Récupère le résultat des actualités point fold. Et ici, nous pouvons voir qu'il y a deux fonctions. première est la fonction de gauche qui sera invoquée lorsque le résultat de gauche aura été renvoyé. Et une bonne fonction qui sera invoquée lorsque le bon résultat aura été renvoyé. Donc, si le résultat de gauche a été renvoyé, nous émettrons l'état d'erreur News. Et si le droit a été invoqué, émettra l'état initial de la nouvelle. Mais avec les nouvelles. Puisque cette fonction renvoie une liste d'informations sur les actualités lorsque le, lorsqu'il n'y a pas d'erreur. Donc ce r aura aussi une liste de musées pour cela, L aura un échec. OK ? Maintenant, avant de faire quoi que ce soit, nous devons également émettre l'état de chargement des nouvelles. Parce que chaque fois que nous récupérons les actualités, cela affichera d' abord l'écran de chargement , puis il récupérera les actualités. Après avoir récupéré les nouvelles, s'il y a un échec, cela montrera que Dennett aura l'état d'erreur. Et s'il n'y a pas d'échec et la fonction a renvoyé la liste des informations d'actualités, alors nous aurons l'état initial des actualités avec la musique, avec la liste de musique pour. Maintenant. Utilisons cette fonction sur notre page d'accueil. Pour cela, nous devons faire de notre page d'accueil un widget dynamique. Faisons ça. Et à l'intérieur de notre page d'accueil, il y aura une fonction d'initialisation. Maintenant, la fonction init est une fonction très utile. Cette fonction ne sera appelée que la première fois que la page sera initialisée. Cette fonction ne sera donc appelée que lors de la première initialisation de la page d'accueil . Nous n'étions pas non plus que lorsque la première fois que la page d'accueil, la nation s'est initialisée, nous voulons appeler la fonction fetch news ou cette fonction. Alors allons-y. Pour cela, nous devons importer notre package Better Block. Et puis nous écrirons context dot, read, news, cubit, dot fetch news. Et le texte de recherche sera nul. Depuis le début, nous voulons simplement rechercher les textes normaux. Cela nous donne une erreur. La raison en est que nous n'avons pas fourni la cuvette de nouvelles dans notre point principal, point cinq. Alors allons-y. Nous avons même coupé celui-ci. Écrivez un fournisseur multi-blocs ici. Nous aurons quelques fournisseurs ou une liste de fournisseurs. Nous pouvons n'avoir qu'une liste de fournisseurs ou même un seul fournisseur. Nous allons créer un fournisseur de blocs. À l'intérieur du Create. Nous aurons une fonction qui retournera le nouveau skew it. Et l'enfant sera notre matière. Nous pouvons importer la nouvelle température. OK, maintenant c'est terminé. Reconstruisons-la une fois, redémarrons l'application. OK ? Nous pouvons maintenant voir que notre bloc fonctionne, mais nous devons apporter d'autres modifications à l'intérieur de l'interface utilisateur pour que notre bloc soit connecté aux cubiques. Ainsi, chaque fois qu' il y a un changement d'état, selon cela, DUI changera également. Pour ce faire, nous devons aller sur notre page d'accueil. Nous devons accéder à notre ListView. À l'intérieur. Au lieu de ListView va créer un bloc de blocs. Le constructeur de blocs sera hors News Cubit et News State. Il prendra ici la fonction de constructeur, qui prendra un contexte et l'état. Si l'état est News Initial, rien, affichez ListView. Et au lieu du nombre d'articles, nous allons maintenant utiliser l'état DOT. Longueur du point News, que nous passons ici. Les nouvelles qui sont peut-être, changeons le nom des mouvements R2. OK ? Donc, les nouvelles qui ajouteront le passage ici à l'intérieur notre nouvelle nouvelle nouvelle état initial que nous utilisons ici. Ainsi, chaque fois que l'État est nouveau vénitien, utilisez les nouvelles qui sont fournies dans l'état initial des nouvelles. Donc nous l'écrivons et ils comptent simplement reformulera cette longueur de point de nouvelles. Et d'accord, pour l'instant , que ce soit ça. Et si l'état n'est pas une nouvelle initiale, si l'état est en cours de chargement de nouvelles, cette fois-ci, il retournera un centre avec un indicateur de progression circulaire avec une couleur de, disons, si l'état n' est pas une nouvelle initial, si l'état n'est pas news and loading, alors il ne nous reste plus qu' un état. C'est l'ère de l'actualité. Cette fois-ci, ce que nous pouvons faire, c'est que pour l'instant, nous allons simplement montrer un texte. C'est l'envelopper dans une phrase. D'accord, nous terminé avec notre générateur de blocs sur notre page d'accueil. Passons maintenant à New scarred. La carte de nouvelles est un générique pour chaque carte de nouvelles. Il s'agit d'une nouvelle générale Scott, que nous montrons dans toutes les cartes de nouvelles ici. Mais nous avons besoin d' informations spécifiques pour chaque journal, qui auront une image unique, un titre unique, etc. Donc pour ce faire, nous devons transmettre les informations d'actualité à l'intérieur de chaque nouvelle cicatrice. Et selon nos nouvelles informations, nous allons changer l' image ou la marée. Alors allons-y. Au lieu de cette URL, nous utiliserons maintenant l'URL de l'image point info news. Maintenant, alors que nous passons à nos actualités, nous pouvons voir que l' URL de l'image peut être nullable. Nous pouvons voir que c'est le cas, cela peut être l'URL de l'image peut être une chaîne ou cela peut être fait. Nous voulons également vérifier que si l' URL de l'image point info news n'est pas égale à null, alors seulement afficher l'image. Et aussi ici, nous pouvons donner un signe d'explication, qui sera spécifiquement pendant ce temps, oui, si l'image que vous avez ajoutée n'est pas nulle, alors ici aussi l' adulte majeur ne peut pas être nul. Maintenant, voici l'URL de l' image qui est nulle. Ne rien montrer, juste une boîte de taille constante. Passons maintenant à notre titre. Ici. Affiche le titre du point info news. Maintenant, nous pouvons aussi, nous savons que le titre peut être nul ou une chaîne. Donc ici aussi, nous devons dire que si la news n'est pas égale à null, alors le titre du point info news. Et si c'est égal pour afficher un texte sans titre. Et nous devons supprimer la constante d' ici et les ajouter ici. Depuis tout à l'heure, nous avons dit que tout était constant, mais maintenant ce n'est plus constant. Cela changera en fonction des nouvelles que vous transmettez. Maintenant. Nous en avons également fini avec nos nouvelles cicatrices. Passons à la page d'affichage des actualités. Ici aussi, nous vous transmettrons les nouvelles. Et maintenant, ce que nous devons faire, c'est régler notre affichage en fonction des informations que nous recevons. Donc tout d'abord, nous changeons même le titre en news dans le titre de la photo point. S'il n'est pas égal à null, alors utilisez les nouvelles dans la photo intitulée loose est donnée. Et s'il est égal à null, alors n'affiche aucun titre. Supprimons la constante d'ici et ajoutons la constante partout. Extraire. L'image changera également. Nous allons le changer pour l'URL de l'image point info news. Et nous dirons que si l' URL de l'image point info news n'est pas égale à null, utilisez uniquement l'URL de l'image dans le réseau de points de l'image. Et s'il est égal, égal à nul, alors ayez une boîte de taille constante. Maintenant, la dette que nous devons aussi donner, créons une fonction. Disons que Get date in date au format DD, MM, YY. C'est une fonction qui va être créée, sera constante à partir d'ici. Créons cette fonction Foster. Cette fonction retournera null et choisira une date heure dans notre objet News Info. Donc, ce que nous allons retourner est datetime point d. Après cette barre oblique, puis datetime point mois, puis une barre oblique, puis un point datetime. Donc maintenant, en utilisant des données à l'intérieur d'une chaîne, utilisant le signe dollar puis avec des accolades, c'est ce qu'on appelle l' interpolation de chaîne. Cela affichera les données à l'intérieur cette chaîne ainsi que l'autre chaîne présente ici. Par exemple, si vous voulez afficher la valeur de 100 ici, alors une chaîne. Tu peux le faire comme ça. Passons l'info news dot datetime à l'intérieur nos données dans une fonction de format DD MM YY. Ensuite, nous devons également donner le nom de l'auteur ici. News in Food Dot Auteur. L'auteur peut également être nul. Donc pour cela, nous vérifierons si l'auteur n'est pas égal à null, puis n'utiliserons que le point news info créé sinon, non ? Non. Auteur. Et le contenu supprimera également ce Lorem. Le texte Ipsum aura du contenu News Info point. Le contenu peut également être nul. Donc, si le contenu n'est pas égal à null, utilisez uniquement le contenu. Autre. Ne pas afficher d'itinéraire local. D'accord, je crois que nous en avons fini avec notre page d'affichage des actualités également. Allons sur notre page d'accueil. Et puisque nous avons ajouté les nouvelles ici, nous devons les ajouter sur notre page d'accueil, également dans notre carte de nouvelles. Nous avons également ajouté les informations sur les actualités. Nous avons donc également dit que c' est un paramètre obligatoire, nous devons donc l'ajouter dans notre page d'accueil l'intérieur de notre carte de nouvelles. Objet. Ajoutons-le. News info est égal à state point news. Supprimons-leur la constante. OK ? Donc si nous avons vu que le point news contient une liste d'informations sur les actualités. Ainsi, chaque information que nous pouvons obtenir en utilisant State Dot News avec un index. Maintenant, il y a une bonne nouvelle. Dieu, nous le sommes, nous pouvons voir que nous avons une erreur. La raison étant la page d'affichage des actualités, nous devons fournir les informations sur les repas. Nous avons donc terminé. Redémarrons l'application et croisons les doigts. Ça devrait l'être. OK. Notre indicateur de progression circulaire était affiché et nous pouvons voir que nous pouvons également voir les actualités. Ouvrons une news. Ça va. Nous pouvons voir que les nouvelles que nous recevons, la date, nous recevons les animaux de l'auteur, nous recevons le contenu aussi. Nous obtenons, nous obtenons les optimistes pour le titre. Revenons en arrière et ouvrons une autre news. OK, là aussi, même chose. OK. Maintenant, vérifions si notre texte de recherche fonctionne ou non. Recherchez Apple. Il ne lui arrive rien. La raison en est que nous n'avons pas ajouté notre fonctionnalité de recherche ici. Alors ajoutons cela. Nous devons aller à notre présentation dans nos pages. Nous devons aller sur la page d'accueil. Et dans notre page d'accueil, nous devons ajouter un paramètre on changed, qui prendra la constante d'ici. Ajoutons la constante dans ces espaces. Maintenant, ce que fera cette fonction OnChange c'est que chaque fois que nous changeons, changeons l'onchange en propre soumis. Donc chaque fois, après avoir écrit quelque chose, disons orange. Et après cela, nous soumettons en cliquant sur ce bouton. Nous rechercherons les actualités liées au texte de recherche ici, qui est orange et discuterons. Alors allons-y. Pour ce faire, nous pouvons appeler la nouvelle fonction. Nous allons donc écrire des contextes, point, lire, actualités, cubit, point fetch news, ainsi que les sticks de recherche que nous donnons ici. Et nous devons également préciser encore une chose. Mais voyons comment cela fonctionne ou non. Cherchons une pièce de monnaie. D'accord, notre fonctionnalité de recherche fonctionne également. Chaque fois que nous cherchions les actualités, Era nous montre de belles choses. Ouvrons les nouvelles. OK, donc ça marche bien. Faisons une recherche avec d' autres noms. Disons Apple. Le, The Apple News est également vrai. Plongeons dans un autre. Newton. Ce n'est pas exactement le Newton que vous espérez, mais d'accord, tapons Google. Nous recherchons le moteur de recherche le plus populaire dans notre recherche. Mais nous voyons que notre fonction de recherche est également ce que. Mais si nous supprimons tout le texte ici, puis que nous appuyons sur Entrée, nous obtenons un message d'erreur. Mais ce qui devrait réellement se passer c'est que s'il n'y a pas de texte présent ici, afficher la valeur par défaut. Nous devons donc également le faire si le texte de recherche est coupé par points. Trim signifie que même si, même si vous avez quelques espaces, disons ici, cela sera également considéré comme rien présent à l'intérieur de notre espace de rangement. Nous introduisons donc une garniture. Si notre coupe est égale, égale à rien, aucun texte ou évite le texte. Cette fois-là. Lancez une recherche et affichez les moyennes par défaut. Et les nouvelles par défaut par défaut, je veux dire que le texte de recherche sera nul. Et si ce n'est pas le cas, alors. Ils sont donc étirés. Voyons maintenant s'il n'y a pas de texte présent dans notre barre de recherche. Ensuite, nous appuyons sur Entrée, nous devrions obtenir les nouvelles par défaut et nous obtenons la valeur par défaut. Mais s'il y a du texte, nous obtenons les outils de recherche. OK ? Tout fonctionne donc maintenant, mais nous devons également changer quelques éléments, quelques détails. Les actualités les plus importantes doivent être affichées lorsque nous affichons les actualités par défaut. Mais lorsque nous ne faisons que montrer des recherches lynchées, cette fois-là, les principales actualités devraient être recherchées. Alors allons-y. Pour ce faire, nous devons créer un nouvel état , appelé état de recherche initiale des actualités. Désormais, cet état sera invoqué chaque fois que le texte de recherche n' est pas égal à null. Nous l'écrivons donc ici. Si le texte de recherche n'est pas égal à null, émettez la recherche initiale des actualités. État. Autre. Il suffit d'initialiser les nouvelles initiatives. Passons maintenant à notre page d'accueil. Et maintenant ici, si l'état est nouveau initial, affichez ListView, et si l'état est une recherche initiale de nouvelles, cette fois afficher également ce litige. Bon, passons maintenant à notre top news et nous allons changer celui-ci. Nous pouvons donc envelopper cela avec une accumulation de blocs. C'est donc la chose très utile à propos de l'utilisation générateur de blocs que nous n'avons pas besoin de modifier la page entière ou de reconstruire la page entière. Chaque fois qu'il y a un changement d'état, nous pouvons simplement changer le widget que nous voulons modifier. C'est la beauté des déclarations, n'est-ce pas ? Contexte, état. Et si l'état est nouveau initial, ce temps revient à la normale. Top actualités. Sinon, si l'état est nouveau, recherche initiale, cette fois-ci a montré la recherche aux actualités, aux nouvelles au crédit. Et si l'état n'est ni News Initial ni News Initial Search, alors renvoyez un budget vide ou une boîte de taille constante. OK, essayons-le. Si nous avions sur notre écran initial, lorsqu'il y avait un chargement, il n'y avait aucun widget. Encore une fois, si nous entrons des novae montrant simplement le haut près de 0, lorsque les actualités les plus importantes sont affichées, l'en-tête est Top News. Et s'il s'agit d'un nom de recherche, l'actualité de la recherche a rencontré un problème. OK, super. Maintenant aussi, nous allons traiter les erreurs ici. Essuyons tout simplement. Commentons pour l'instant. Commentons cette partie pour le moment et émettons l'état d'erreur de news. Voyons ce qui s'affiche ici. Redémarrons le f. Et lorsqu'il y a un état d'erreur de news, nous montrons simplement qu'il y a un texte d'erreur à l'écran. Ce que nous devrions faire lorsqu'il y a un état d'erreur de news, c'est de donner à l'utilisateur un bouton de rechargement afin que s'il y a une erreur lors de l'appel de l'APN, nous puissions recharger notre et elle appellera l'API une fois de plus. Alors allons-y. Maintenant. S'il y a une erreur, alors au lieu de simplement le texte, nous voulons donner un bouton d'icône. Le bouton de l' icône sera enfoncé. Donnons-lui pour l'instant une fonction vide et une icône. L'icône sera, je peux commencer. Nous rejouons et ça devrait bien se passer. Et la couleur de celui-ci sera Deep Blue. La taille sera, disons, 24. Et donnons-lui une constante ici. Et ce que nous voulons réellement faire avec ce bouton de rechargement, nous voulons à nouveau appeler la fonction fetch news dans nos news, bonne nouvelle avec le texte de recherche nul. Donc si nous le faisons pour le moment, rien ne se passera car nous avons juste imité une erreur d'actualité ici. Mais si nous supprimons l'erreur de news d'ici, et si nous la décommentons, et maintenant, si nous appuyons sur le bouton Load, cela devrait nous montrer la normale, sympa. Mais le défaut signifie wallah dès que les nouvelles par défaut. Si nous redémarrons l' application encore et encore, testez-la, voyons ce qui se passe. Nos premières nouvelles ont été affichées avec l'en-tête de l'actualité supérieure et l'image est affichée, le titre est affiché. Les photos sont en cours de chargement. Et si nous allons à une news, nous pouvons voir que le titre est affiché, les unités sont affichées. La date est affichée quand il a été publié, l'auteur Naomi tissu et le contenu aussi nous sommes maintenant si nous recherchons du texte, une recherche, une heure de nouvelles recherchée, des nouvelles actualités recherchées sont également affichées. avec les news de recherche en tête. Et s'il n'y a pas de texte dans notre champ de texte de recherche, alors l'installation par défaut. Nous avons donc implémenté notre bloc avec gestion de l'état des qubits dans notre application. Et notre application est entièrement complète et fonctionnelle. Dans la prochaine vidéo, je parlerai donc je parlerai la partie modulaire de l'architecture propre. Nous verrons pourquoi il est modulaire et comment nous pouvons le faire. Je vais également le montrer en modifiant un paquet très important que nous utilisons. Et je vais montrer à quel point nous pouvons facilement modifier le paquet sans affecter les autres codes présents ici en utilisant cette architecture propre. Merci donc de nous avoir regardés. On se voit dans le prochain. 12. Tester la modularité de l'architecture propre: Bonjour et bienvenue dans la 11e vidéo et la dernière vidéo de notre série d' architecture propre aplatie, où nous construisons une application complète utilisant une architecture verte. Dans cette vidéo, nous allons tester la modularité d'une architecture propre. Dès la première vidéo, j'ai prétendu que l'architecture propre était très modulaire. Par là, je voulais dire que nous pouvons facilement modifier n'importe quoi dans n'importe laquelle de ces sections sans affecter le code des autres sessions. Dans cet exemple, nous allons remplacer notre package HTTP dans notre service API par un autre nouveau package mis à jour. Voyons quel package nous allons utiliser. Nous utiliserons un package appelé dy. Passons à bio et ajoutons le package DO dans notre fichier YAML Pub spec dot. Nous avons ajouté un cadran dans notre fichier YAML de spécifications d' ampoules. Et passons en revue notre enquête est localisée et enregistrée. J'ai enregistré notre diode. Maintenant, souvenez-vous d'une chose. Vous devez vous enregistrer avant le service API. La raison en est que vous utiliserez le package de numérotation dans notre service API. Nous devons donc d' abord enregistrer die off , puis enregistrer la surface API. uniquement pour cette raison que nous enregistrons notre service API avant la récupération à partir d'une source de données distante. La raison en est que nous utilisons le service API dans nos poissons à partir d'une source de données distante. Passons maintenant à notre service API et nous allons supprimer. Cette ligne. La réponse finale sera égale à deux. Avant cela, nous avons également besoin de la diode. Importez notre localisateur de services. Maintenant, nous allons écrire la fonction diode dot get. Maintenant, la fonction get, nous voyons qu'elle prend le chemin et qu'elle prend également trois paramètres. La partie sera l'URL ici, et les paramètres seront là où les parents, d'accord ? Et cela renvoie un futur de réponse. La réponse aura une réponse. Maintenant, le, ce sera la réponse point da, da data. Puisque nous utilisons la réponse du repos en forme de diapason, tout sera sauvé. Maintenant, redémarrons notre candidat. OK, donc nous obtenons une erreur. Voyons quelle erreur nous sommes créés. Si nous imprimons ici, les données de début de réponse. Nous pouvons voir si, vous savez, response.data est imprimé. Si nous imprimons les données de réponse ici, voyons ce qui se passe. OK ? Donc celui-ci est en cours d'impression. Notre erreur doit donc se situer quelque part dans nos sources de données. Très bien. Passons à notre fichier de sources de données. Et à l'intérieur de notre capture, imprimons le montage. Nous pouvons donc voir que HashMap interne ou une chaîne de mappage dynamique n'est pas un sous-type de chaîne. Cela se produit parce que si nous accédons à notre service API, nous utilisons JSONData appelé le code dans notre response.body dans notre package HTTP. Cela nous donne une version néophyte à cordes de la dynamique de la pierre de carte. Mais ici, nous obtenons directement le maximum de types dynamiques, nous n'avons donc pas besoin d'utiliser celui-ci. Nous pouvons donc le supprimer ici. Et si nous le relançons, voyons ce qui se passe. OK ? Nous obtenons donc nos données pendant une minute pour voir si cela fonctionne également. Laissez chercher. OK. La fonctionnalité de recherche fonctionne donc également. C'est ainsi que nous pouvons facilement modifier des éléments dans notre architecture propre sans rien changer. Si vous l'avez vu, nous n'avons eu qu'à modifier deux ou trois lignes dans notre fichier point, point du service API. Le reste, chaque fichier disait avoir le même code. Nous n'avons eu à modifier aucun autre fichier à l'exception du service API. Voilà donc la beauté de l'architecture épurée. C'est tellement utile que nous pouvons facilement changer quoi que ce soit sans changer ou altérer les autres combats. C'est donc tout pour cette vidéo. Dans ce cours, nous avons créé une application complète à partir de zéro en utilisant une architecture propre. J'espère que vous serez également en mesure de créer l' application avec moi. Et merci d'avoir regardé l'intégralité de la série jusqu'à la fin.