Guide du développement WebAssembly Blazor

1. Introduction: Bienvenue à ce cours, développement web moderne avec blazer et fait cinq. Dans ce cours, vous apprendrez à créer une application blazer à partir des adultes à l' aide de techniques et de fonctionnalités au niveau de l'entreprise. Je suis votre instructeur, terroir Williams et moi avons plus de 10 ans d'expérience à la fois mise en œuvre de systèmes et dans la formation de personnes comme vous pour les développer. Donc je peux vous assurer que c'est le cours pour vous et que vous serez entre de bonnes mains. Maintenant, en guise d'introduction, nous voulons savoir ce qui est blazer Blaser est l'une des technologies de développement web les plus récentes de Microsoft. Oui, on avait la lumière argentée et l'interrupteur, mais pas blazer, on dirait qu'il est là pour rester. Il nous donne crée une alternative à JavaScript lorsque nous envisageons de construire des applications interactives d'une seule page, il est léger, il est polyvalent, et prend en charge à la fois WebAssembly ainsi que notre application dotnet régulière scénarios de déploiement. Dans ce cours, vous allez apprendre le développement de base en construisant WebAssembly entièrement fonctionnel, s'il vous plaît notre application. Vous allez également comprendre l'ensemble du flux de travail et de la structure des dossiers dotnet cinq. Et en fin de compte, nous voulons, bien sûr, utiliser nos compétences pour entrer dans le milieu de travail avec eux, donc sur un code propre et nous allons explorer certaines de nos options en ce qui concerne ces choses. Ce cours, vous allez en apprendre davantage sur Entity Framework Core. Vous êtes plus récent pour apprendre à manipuler et développer notre API de repos où, ce qui est sur le stun dotnet Core Services, qui je suis allé regarder les modèles de codage, le contrôle de la source, le déploiement et l'hébergement. Ce cours est bourré d'informations pour vous guider vers le succès. Maintenant, c'est un grand cours qui est calme quelques morceaux de contenu et, vous savez, je ne vais pas passer par tout ça. Ça va sortir au fur et à mesure que nous allons. Et je suis vraiment excité de t'avoir ici. se voit dans la leçon suivante. 2. Installez l'édition de la communauté en Visual Studio 2019 Net 5 SDK: Hey les gars, aujourd'hui, nous allons commencer à installer Visual Studio Community Edition et .net 5. Maintenant, notre voyage commence ici sur le site Web Visual Studio, auquel vous pouvez accéder via une simple recherche Google. Ou vous pouvez essayer de reproduire cette URL, qui est Visual Studio dot microsoft.com slash VS communauté. Maintenant, il y a différents ajouts de Visual Studio. Et la communauté est celle qui est, elle est gratuite pour un usage individuel et c'est celle que nous allons utiliser. Vous pouvez donc aller de l'avant et télécharger Visual Studio, qui vous donnera le programme d'installation de Visual Studio. Et une fois que cela sera terminé, nous pourrons aller de l'avant et exécuter ce dossier. Nous lancerons les points de contrôle de sécurité que vous pourriez avoir, mais vous pouvez continuer à autoriser le programme d'installation à commencer. Et tout cela est là que vous définissez réellement ce dont Visual Studio sera capable. Ces charges sont donc appelées charges de travail, et chaque charge de travail vous expose un jeu de fonctionnalités différent. Donc, pour le développement web, vous voudrez obtenir la charge de travail ASP.NET et de développement web. Pour le développement de bureau. Vous souhaitez obtenir le développement de bureau net ou le téléchargement. Et pour tout autre SDK ou type de projet que vous souhaitez développer, vous pouvez aller de l'avant et obtenir la charge de travail qui lui est associée. Non, pour cet exercice, nous voulons préparer notre studio de résultats avec les ressources nécessaires pour le développement web. Encore une fois, vous pouvez aller de l'avant et prendre autant de charges de travail. Chacun sera livré avec sa propre taille et il vous indique combien d'espace est nécessaire en fonction de ceux que vous sélectionnez. Mais au minimum pour le développement web, vous voulez vous assurer que vous avez ASP.Net et le développement web coché. Vous pouvez aller de l'avant et prendre les autres outils de développement si vous le souhaitez. Mais je ne suis pas prêt à le faire parce que ce sont tous les framework .net 644.84.6, désolé, 4.74.8. Mais nous allons installer le document cinq dans quelques minutes afin que vous puissiez aller de l'avant et le faire et laisser Visual Studio installer. Cela prendra un certain temps afin que vous puissiez prendre une tasse de café et revenir. Maintenant, une fois que le téléchargement et l'installation sont terminés, vous avez deux options. Vous pouvez aller de l'avant et vous connecter. Et signe signifiant que vous vous connectez avec vos cônes vivants. Si vous en avez un, sinon, alors vous allez de l'avant et créez un. C' est gratuit et cela rend la vie plus facile si vous en créez un et vous connectez réellement. Mais je vais juste aller de l'avant avec une option non nulle peut-être plus tard. Ensuite, vous choisissez vos paramètres généraux. Donc, j'allume le thème sombre et vous pouvez choisir ce qu'ils veulent, quels paramètres de développement ou général. Je vais laisser le mien en général, même si nous faisons ce développement. Mais ils optimisent essentiellement certains raccourcis clavier et la mise en page en fonction de votre sélection. Je laisserai le mien en général. Je vais commencer par Visual Studio. Très bien, donc une fois que cela sera fait, vous serez invité avec cette neige. Si tu ne comprends pas ça, alors c'est bon. Mais voici pourquoi j'aurais suggéré que vous vous inscriviez avec leurs cônes de vie parce qu'alors tout ce que vous avez une période d'essai de 30 jours. Et si vous ne voulez pas du haut du cône, alors ils vous diront simplement de sortir. Donc, vous pouvez vraiment aller de l'avant et vous connecter. Donc je vais juste me connecter avec le mien. Et une fois que vous l'avez signé et puis vous verrez qu'il n'est pas sous licence pour vous et il semble juste soumettre plus invitant. Donc maintenant, au lieu de quitter Visual Studio, je peux fermer. Et c'est Visual Studio au niveau très basique. Maintenant, nous avons Visual Studio. Ce dont nous avons également besoin est .net cinq. Ainsi, vous pouvez accéder à la page de téléchargement net cinq à travers une simple recherche Google une fois de plus. Ou vous essayez de reproduire cette URL, celle que vous trouvez plus facile à faire. À ce stade, vous voulez télécharger le SDK et le moteur d'exécution. Alors laissez-moi commencer par fermer Visual Studio car il doit installer des extensions pour cela. Et l'installateur est toujours disponible pour vous. Donc, si vous ne parvenez pas à ajouter une charge de travail, juste pour que vous le sachiez, vous pouvez simplement cliquer sur modifier et puis il relancera ce pH avec tout le travailleur dirait que si plus tard vous voulez qu'il fasse quelque chose de nouveau, vous avez juste besoin de modifier cette charge de travail , puis vous obtiendrez ces modèles de projet en conséquence. Je vais fermer Visual Studio, cependant, afin que nous puissions continuer avec nos installations. Donc, nous allons avoir le .net 5. Maintenant, vous pouvez voir que les SDK disponibles en fonction de votre système d'exploitation, j'ai un système d'exploitation Windows 64 bits fonctionnant avec rétine, donc je vais aller de l'avant et télécharger cela. Et pendant que celui-ci est en téléchargement et juste Lindsay appuie sur le bouton Retour et passe à l'exécution, ce qui est absolument nécessaire pour l'hébergement. Donc, vous voyez que c'est le support d'exécution. Donc, si vous allez héberger l'application .net five sur, sur un serveur local, alors vous avez certainement besoin de l'exécution. Donc, vous pouvez simplement obtenir ce bundle d'hébergement qu'ils ont là disponible pour téléchargement. Donc, vous pouvez simplement télécharger les deux et quand ils sont tous les deux finis. Donc, lorsque les SDK ont terminé, vous pouvez aller de l'avant et installer ce 1 d'abord. Ça ne devrait pas prendre trop longtemps. Et d'accord, donc c'est réussi. Après avoir installé le SDK, nous voulons simplement nous assurer que nous avons le temps propre. Acceptez également n'importe quoi, et allez-y et exécutez votre installation. Et il vous fera savoir quand il est terminé avec succès, savoir que nous avons le SDK est complètement installé. Je voulais juste lancer Visual Studio et vous montrer ce que vous obtenez avec ces SDK. Donc, si je vais de l'avant et que je crée un tout nouveau projet en raison des charges de travail dont je dispose, je verrai différents modèles de projet. Donc, je n'ai choisi que le nœud de travail Web. Donc, j'ai la possibilité de faire une console régulière vers le haut. J' ai le noyau ASP.Net. En fait, je pense que celui-ci vient à cause de la charge de travail de bureau, mais à ce stade, je n'essaie pas de savoir qui a fonctionné, qui appartient à qui. Sachez juste que si vous allez faire notre projet web, vous avez la possibilité de choisir une application web de base, une application blazer, et vous pouvez les choisir si vous ne ferez pas pour R.net framework, quelqu'un pour choisir une application Web .NET Core. Ce n'est pas l'application réelle que nous construisons. Je vous montre juste vos options. Alors nous allons de l'avant et mettre le nom du projet pourrait créer. Ensuite, dans la liste déroulante ici, vous pouvez choisir si vous voulez un Core 2.13.1 ou le dernier core dominate 5. Et avec cela, vous serez en mesure de choisir les différents modèles et de procéder. Donc, quand nous reviendrons, nous allons réellement créer un projet et faire une visite des structures de dossiers. 3. MISE à page : Installez Visual Studio 2022 Community Edition Edition de communauté et . NET 6: Salut les gars. Dans cette leçon, nous allons installer Visual Studio 2022, qui est livré avec dotnet six, qui est le dotnet le plus rapide à ce jour. Donc, pour commencer, il suffit de passer aux téléchargements slash Microsoft.com de Visual Studio dot . Ensuite, nous allons aller de l'avant et le téléchargement gratuit sur l'édition communautaire, qui nous donnera ensuite un installateur. Une fois que nous aurons exécuté ce programme d'installation, nous serons en mesure de sélectionner les charges de travail souhaitées. Aucune charge de travail ne fait vraiment référence aux bibliothèques ou aux bibliothèques de support pour le type d'application que vous souhaitez créer. Donc, dans ce cas, nous voulons absolument obtenir cette charge de travail de développement Web ASP.Net et de développement Web. Mais si vous êtes intéressé par d'autres technologies, vous pouvez aller de l'avant et les sélectionner. Vous pouvez donc voir que plusieurs charges de travail sont sélectionnées avec le développement Azure, NodeJS et le développement de bureau. Vous pouvez donc les sélectionner également. Je pense qu'ils seront utiles avec d'autres projets que vous pourriez finir par construire dans l'ensemble, une fois que vous aurez fait cela, vous pouvez aller de l'avant et cliquer sur Installer, une fois que vous aurez fait cela, vous pouvez aller de l'avant et cliquer sur Installer, ce qui se ferait dans le coin inférieur droit. Bien sûr, plus vous sélectionnez de charges de travail, plus la taille du téléchargement est grande. Une fois que vous avez terminé cela, vous pouvez continuer. Maintenant, lorsque ce n'est pas le chargement terminé, vous pouvez obtenir certaines options que je n'obtiendrai pas parce que je l'ai déjà installé. Cela vous expliquera donc à quoi vous attendre. Vous pouvez obtenir une option où vous pourrez choisir votre thème. Comme vous pouvez le voir, j'utilise le thème sombre, mais vous avez l'option d' un thème clair, un thème bleu. Et le fait est que Visual Studio 22 a beaucoup plus de thèmes que ses prédécesseurs. Ainsi, même si vous ne voulez pas éclairer les thèmes initiaux, vous pouvez obtenir tous les thèmes si vous en avez besoin. se peut également que vous soyez invité à vous connecter. Donc, si 2019 est déjà installé sur votre machine et que vous venez d'être installé en 2022, vous êtes déjà connecté à 2019, cela ne vous demandera probablement pas de vous connecter à nouveau. Toutefois, s'il s'agit de votre première installation de Visual Studio, vous serez peut-être invité à vous connecter ou à créer un compte en direct, à quel point vous voudriez simplement utiliser votre Microsoft émis en direct à tous les loci on m'apprend beaucoup de calme aux cônes. Ou vous pouvez simplement aller de l'avant et en créer un. Et si ma mémoire me sert correctement, vous pouvez utiliser une autre adresse e-mail non Microsoft qui sécrète le rhume salive. Cependant, une fois que vous êtes sur cet écran d'atterrissage, c'est ici que vous procédez à la création d'un projet. Je ne vais donc pas créer nos projets. Non, je vous montre juste à quoi vous attendre. Il vous suffit donc d'aller dans Créer un nouveau projet. Et puis, sous cela, vous pourrez choisir votre modèle. Comme il s'agit d'un cours de blazer, nous voudrions chercher un blazer. Vous allez de l'avant et recherchez des modèles si vous ne le voyez pas comme l'une des premières choses ici. Une fois que vous avez fait cela, vous pouvez lui donner le nom. Encore une fois, nous ne créons rien pour l'instant. Lorsque vous cliquez sur Suivant, vous choisissez le framework que vous préférez. Vous commencerez donc à voir Dotnet Core 3.1, dotnet five et Dotnet Sikhs, qui bénéficie d'un support à long terme. À ce stade, puisque nous utilisons Visual Studio 2022, vous voudriez probablement maximiser votre potentiel et utiliser dotnet six. Mais alors, vous voyez que vous avez d'autres options. Mais quand nous reviendrons et que nous créons réellement un projet et que nous examinerons exactement ce qui doit être sélectionné jusqu' à présent, non, une fois que vous êtes arrivé jusqu'ici, vous aurez installé avec succès Visual Studio 20226. 4. Créer un compte GitHub: Hé les gars, dans cette vidéo, nous allons créer ou des comptes GitHub. Et c'est un truc très simple, devient vieux, il est très facile pour nous de s'inscrire. Vous avez juste besoin d'aller sur GitHub.com. Est-ce GIT HUB DOT COM, github.com, et vous atterrissez sur cette page. Maintenant, à partir d'ici, si vous avez déjà un compte et vous pouvez vous connecter et vous pouvez à peu près arrêter de regarder la vidéo ici. Si tu ne le fais pas. Cependant, alors la forme centrale est juste ici. Vous pouvez faire un peu de lecture, juste obtenir une appréciation de ce que GitHub est quatre et il est tout au sujet, ils ont des prix, donc ils offrent plans d'entreprise et des plans d'éducation et différentes plantes ou situations différentes . Mais pour le développeur solaire ou pour les très petites équipes qui peuvent ne pas être au niveau de l'entreprise qu'elles ne le font. Vous donner beaucoup de choses gratuitement. Donc, pour vous inscrire, il suffit de mettre un nom d'utilisateur et une adresse e-mail et un mot de passe. Et une fois que vous avez fourni toutes ces choses et à condition que votre nom d'utilisateur soit assez unique , bien sûr, vous cliquez sur vous inscrire à GitHub et vous devriez être dans. J' ai déjà un compte, donc je vais vraiment me connecter. Vous avez vu que mes sourcils deviennent folles en essayant de fournir des informations. Donc, je vais juste me connecter avec mon compte existant. Donc c'est mon bien, vous pouvez utiliser votre nom d'utilisateur ou vos adresses e-mail pour vous connecter et le mot de passe. Et je suis là, c'est ma page de destination, donc ils vous donnent vraiment un sentiment de communauté. C' est presque comme un Facebook pour les développeurs dans une certaine mesure, vous pouvez suivre les gens. Et une fois qu'ils suivent des personnes, vous voyez leurs activités sur la page de destination, vous pouvez accéder à votre référentiel. Donc, évidemment, si vous êtes nouveau à vous lever, alors vous n'auriez rien répertorié sur le côté ici. Ce que je ne suis pas nouveau. J' ai été assez occupé à mettre du contenu sur YouTube, presque n'importe quel petit projet d'animal de compagnie que je commence, j'ai un dépôt GitHub ou en fait j'ai besoin de le parcourir. J' ai aussi demandé aux étudiants de m'ajouter à leur repos dans le passé pour que nous puissions collaborer. Peut-être qu'ils avaient un problème et je pourrais juste vérifier leur code via le dépôt. Toutes ces choses sont possibles grâce à cette photo verbale. Mais une fois que vous avez créé vos cônes et que vous êtes connecté, et bien sûr, vous ne verrez pas ce que je vois une fois de plus. Mais alors cela compléterait l'inscription. 5. Créer un projet Blazor: Hé les gars, bienvenue. Donc, dans cette vidéo, nous allons passer beaucoup de temps. Nous voulons juste aller de l'avant et créer un tout nouveau projet de blazer. Donc, nous allons faire est d'ouvrir notre Visual Studio et ensuite nous allons créer un nouveau projet. Et puis à partir d'ici, nous allons vouloir chercher les modèles blazer. Donc, vous ne l'avez peut-être pas à gauche si vous n'avez jamais créé auparavant, mais vous ne seriez pas en mesure de le trouver dans la liste des modèles ici. Et puis en fonction des charges de travail que vous avez peut-être installées lors de la configuration de Visual Studio. Il peut ne pas être vu en haut. Ainsi, vous pouvez toujours utiliser une recherche et vous pouvez taper blazer et il va filtrer cette liste de modèle de projet, en mettant le blazer au sommet. Donc, vous pouvez aller de l'avant et double-cliquer dessus. Et puis pour le nom du projet basé sur le type de projet que nous allons construire, qui est une application actuelle ou une application de gestion actuelle. Je vais aller de l'avant et appeler ça la gestion actuelle pour que vous puissiez le nommer avec quoi vous êtes plus à l'aise. Mais une fois que vous lui avez donné le nom, il vous suffit d'aller de l'avant et de cliquer sur Créer. Et puis l'écran suivant est un écran très critique. Permettez-moi donc de vous expliquer les options qui sont présentées et quelles sont les implications de l'une ou l'autre. Donc, tout d'abord, nous avons l'option du serveur blazer vers le haut. Et si vous lisez la description est un modèle pour la création, mais il a un serveur qui exécute côté serveur et il fonctionne en utilisant .NET Core aussi. Signal sont tellement que cela va juste nous donner un site Web comme n'importe quel autre site .NET Core, si vous avez déjà utilisé .net core auparavant, et il doit être déployé sur un serveur, peut-être ISR sur ce code, déployer notre site Web régulier que la façon dont celui-ci devrait être déployé. Il utilise le signal ou quiconque pour nous donner une idée en temps réel de notre application. Donc, ce n'est pas la pire option, mais bien sûr, le contexte définira si vous avez besoin d'utiliser celui-ci, r néant. L' option Blazer Web Assembly, cependant, nous donne la possibilité d'avoir une application Web Assembly. Et web, web assembly est une norme ouverte qui permet aux applications de s'exécuter directement à l'intérieur du navigateur. Cela signifie que nous allons créer une application web puissante verbe qui interagira avec une API, mais il n'a pas besoin d'un serveur pour être hébergé. Très bien, donc une fois qu'un client ou quelqu'un navigue vers ce site Web, le temps faible initial peut prendre plus de temps que le serveur configuré, mais il téléchargera en fait l'ensemble de l'application et toutes les dépendances directement là sur le ordinateur. Et il fonctionnera entièrement hors du navigateur, réduisant le besoin de l'aller-retour au serveur chaque fois qu'il a besoin de données. Les implications de ce null seraient que tous vos binaires, toutes vos dépendances sont et savent quand être sur la machine de quelqu'un d'autre. Et s'ils ont des intentions envers vous sont envers ce que votre application peut faire, alors ils pourraient faire du mal s'ils savent ce qu'ils cherchent. Donc vous savez, vous devez prendre chacun en avance et prendre la meilleure décision en fonction du contexte. Donc, pour ce cours réel, nous allons utiliser Web Assembly. Mais alors, si vous regardez à droite, vous verrez que vous avez la possibilité de faire. Dominant core hébergé Web Assembly vers le haut. Donc, c'est comme un hybride entre un serveur et notre sous-assemblage. Donc, je vais réellement le faire parce qu'il nous donne la possibilité de créer l'ensemble du côté Web Assembly, qui est l'interface utilisateur, ainsi que le côté API, qui représenterait le serveur par opposition à l'application serveur, dont nous avons déjà discuté est vraiment comme n'importe quelle autre application principale dominante. Si vous n'êtes pas familier avec les applications de base 0.1x avec un IRA MVC sont des sites Web, les applications fonctionnent. Ensuite, vous pouvez consulter mes autres cours où nous allons par ce genre de sites Web. Mais pour l'instant, nous allons construire l'assemblée web en utilisant le noyau ASP.NET hébergé et les applications web progressives. Ou le but de l'option Application Web Progressive est nous permettre de créer une application que les gens ne peuvent pas charger sur leur machine. Donc, nous passons du chargement DOE au navigateur et ne parlons nulle part de téléchargement sur votre machine. Donc, le site Web serait en fait descendre à votre machine et vous pouvez l'exécuter et l'exécuter comme vous le feriez n'importe quel autre programme sur votre machine. C' est donc ce qu'une application web progressive permettrait. D' accord, donc vous auriez à bobiner un navigateur à chaque fois que vous vouliez juste si le ticket et l'utilisation. Et un autre avantage est que les applications web progressives peuvent également être téléchargées sur des téléphones mobiles et fonctionner presque nativement. Donc, c'est une fonctionnalité très puissante pour entrer. Nous allons donc aller de l'avant et inclure à la fois les applications web hébergées et progressives ASP.Net. Mais ensuite, je voulais juste décrocher Chuck un peu avant qu'on passe à autre chose. Et nous voulons examiner nos options d'authentification afin que nous puissions lire Non, c'est sur aucune authentification. Nous pouvons changer cela et nous pouvons voir un utilisateur individuel un cône. Donc, ce que cela va faire est en fait nous permettre d'avoir la capacité de gérer toutes nos opérations d'authentification, d' autorisation et d'utilisation liées à l'utilisateur. Tout serait intégré, n'aurait pas à faire beaucoup plus de travail pour inclure toutes ces bibliothèques. Et cette distribution de Web Assembly et dominer l'application hébergée de base. Il nous permet en fait d'utiliser le serveur d'identité, qui est construit sur les standards ouverts, ce qui est fondamentalement comme, non ? Non, il s'agit de la norme de sécurité de niveau supérieur pour l'authentification. La plupart des sites Internet utilisent, et cela nous permet d'avoir un support pour l'authentification locale ainsi que pour l'authentification tierce partie. C' était donc un peu d'informations qui vous arrivaient quand nous créons cet album. Est-ce que Latino toutes les options. Quels sont les avantages et les inconvénients de chaque option. Encore une fois, le renforcement de ce contexte déterminera celui qui convient le mieux à votre situation. moment, nous voulons faire le travail, le blazer Web Assembly avec les fonctionnalités de l'application Web progressive hébergée .NET Core inclus, nous voulons ajouter individuellement des comptes utilisateur comme authentification. Et bien sûr, c'est point net cinq cours de base. Donc, nous devons nous assurer que nous avons fait cinq sélectionnés. Bon, alors on peut aller de l'avant et cliquer sur Créer. Et une fois que cela est terminé, où accueilli avec Visual Studio et notre explorateur de solutions et toute cette interface. Et nous voyons pas mal de fichiers dans notre explorateur de solutions. Donc je vais m'arrêter là parce que vous avez beaucoup d'informations. Sachez simplement que vous pouvez consulter cette section sur vos différentes options sur ce qu'elles signifient toutes. Mais dans la prochaine vidéo, je vais vous donner un aperçu de la structure des dossiers afin que nous puissions comprendre exactement à quoi sert chaque fichier et comment ils se réunissent pour faire notre application. 6. Fichiers de projet de voyage et dossiers et dossiers de tournages: Hé les gars, bienvenue. Donc, dans cette leçon, nous voulions juste faire un tour rapide de blazer, tous les fichiers qui sont inclus dans ce modèle de projet. Donc, vous pouvez vous rappeler que lorsque nous avons créé ce projet, nous voulons sélectionné blazer Web Assembly deux émis .net Corée hébergé. Nous avons inclus les ensembles de fonctionnalités d'application Web progressive, ainsi que l'authentification incluse. Donc, il s'est passé plein de choses juste là. Et en plus de tout cela, il s'agit de projets .net cinq ou .NET Core 5. Donc nous voulions juste avoir une pleine appréciation sur, je vais tirer tout dans ce projet fonctionne. Alors commençons par un fonds qui va mon explorateur de solutions juste à ma gauche, si c'est le premier cours qu'ils font avec moi, il suffit de tenir mon installation de Visual Studio. Sinon, vous sauriez que vous pouvez le faire glisser vers la gauche, vous pouvez le faire glisser vers la droite et n'importe quel côté, mais c'est plus naturel pour moi. Donc, je vais toujours aller à gauche quand je montrerai la structure de dossier où vous pouvez juste suivre avec votre règlement. Donc, commençons par le fait que lorsque nous regardons dans l'explorateur de solutions, nous avons notre solution, bien sûr, quel que soit le nom de Project ou de la solution. Mais alors vous remarquez que vous avez trois projets. Vous avez la voiture ou dans la gestion, le client, serveur de gestion actuel et le point de gestion actuel partagé. Donc, vous avez trois projets. Bien que la boîte, parce que nous avons créé notre application hébergée de base d'assemblage Web. Donc, pour le contexte, si nous n'avons pas choisi cette option hébergée .NET Core, alors nous n'aurions obtenu que le projet client de gestion de location de voiture. Donc, il n'aurait pas obtenu ces outils, aurait juste obtenu ce projet Web Assembly. Et puis nous devrions nous connecter à une API quelque part et faire ce que nous devons faire pour qu'elle ait réellement des fonctionnalités. Encore une fois, c'est presque comme un site web statique, tout ce projet, tous ces fichiers que je mets en évidence quand il le compile, ce programme, ce projet, ce site web, tant de façons de le mettre. Nous allons juste ne pas charger le client pâteux et dans le navigateur et courir à partir de là. Cependant, parce que nous l'avons fait dominer le noyau hébergé, ce que Visual Studio a offert de neige est la possibilité de créer réellement l'APA tout en un. Ainsi, l'application serveur de points servira d'API. Donc, cela devra aller sur un serveur, peut-être qu'un serveur IIS dans les hôtes sont sur Uzziah ou n'importe où. Et puis nous allons simplement nous connecter via Internet de l'assemblage Web à notre projet d'API ou aux fonctionnalités d'API que nous avons dans notre projet de serveur. Très bien, donc en un mot, c'est pour ça que nous avons ces deux projets, serveur de points et client. Le DOD partagé est à peu près comme, vous savez, faire le pont entre les deux car il pourrait y avoir des classes que l'outil pourrait avoir dans des objets communs ou de données. Donc, au lieu de les créer deux fois, ils nous donnent juste un point partagé. Donc, les deux projets scanner référencent la section commune de doc et tirent parti des croisements déjà créés nos ressources. Maintenant, vous vous rendriez probablement compte que chaque fois que je clique sur Up Project, le fichier de projet réel ici , ce fichier CSB, il ouvre un onglet et c'est juste un fichier XML. Donc c' est, tout ce que je veux souligner, c'est le fait qu'ils disent tous framework cible .net 5, non ? Donc ils ciblent tous .net 5. Jetons donc un peu un coup d'oeil au projet client. Donc, sur le client sous ce nœud, vous avez vos dépendances. Et si vous voulez forer vers le bas, vous voyez des analyseurs ou le projet dire C8 ou France est le projet partagé juste là, ou les paquets. Je ne vais pas trop plonger dans ce que font les paquets, les frameworks et les analyseurs pendant le projet. Ceux qui font plus sous les propriétés, nous avons ce fichier appelé Launch settings.js sandwich. Il a juste quelques configurations pour notre application pour être en mesure de fonctionner. Quand c'est en cours d'exécution. Il devrait s'exécuter sur les problèmes d'adresse http localhost que si c'est SSL ou HTTPS, il aura ce numéro de port. Et il y a les configurations qui, au cas par cas, nous pourrions avoir besoin de venir ici et de changer les choses, mais je ne veux pas m'asseoir ici et vous parler de tous les petits car il y a des chances que vous n'ayez jamais besoin d'interagir avec certains d'entre eux. Alors passons à autre chose. Donc www root, qui va stocker nos fichiers statiques ou ressources CSS. Il est livré intégré avec Bootstrap et ouvert iconique. Donc, ils vous donnent beaucoup de choses hors de la boîte pour vous aider à démarrer votre conception. Vous avez le fichier index.html. Si vous avez fait ce que bys n depuis un certain temps, vous savez que l'index devrait toujours être vos premiers fichiers. Donc, ce qui se passe, c'est que lorsque l'application cliente s'exécute, elle regardera toujours le fichier d'index. Et puis le fichier d'index est l'endroit où nous définissons des références pour toutes ces choses. Nous avons notre titre. Donc, vous êtes, si vous êtes familier avec HTML et le squelette de base, cela ne devrait pas vous sembler trop étranger jusqu'à ce qu'au moins la partie où il dit div ID jusqu'au chargement. Et puis cela donne une erreur si nous ne pouvons pas charger. Donc, c'est comme notre petit fichier de modèle pour dire ce div où l'application sera rendue. Très bien, le manifeste JSON ainsi que le service worker. Et ces deux sont vraiment là pour soutenir ou des ambitions d'applications web progressives. D' accord, donc quand on arrivera à ce point, on pourra les examiner davantage, mais c'est pour ça que vous avez ces deux dossiers. Si vous ne voulez pas avoir ces deux fichiers, alors il est sujette à provoquer qu'il n'a pas choisi d'applications Web progressives. Nous passons aux pages et aux pages. C' est là que nous définirons littéralement les pages dont nous avons besoin pour élaborer notre application. Donc, vous pouvez voir qu'il est venu avec certains déjà donnés à nous, un pour l'authentification, d'accord, un comme un compteur d'échantillons, récupérer les données et l'index, accord, donc les index où il ira en premier. Et au fur et à mesure que nous construisons l'application de chargement, nous ajouterons plus de pages. Et avec plus de pages viennent plus de routes partagées auront toutes les pages sont des composants. Donc ce sont des pages. Vous remarquerez qu'ils sont le même rasoir point d'extension de fichier, ce que la page serait la chose entière. Alors que le composant r est réutilisable à plusieurs endroits. C' est pourquoi sur le partagé, nous appellerions ces composants parce que n'importe quel menu nav, que vous connaissez, apparaîtrait sur de nombreuses pages différentes partout. Vous avez la mise en page principale. Ce qui est, c'est nos modèles réels où il rend juste le corps de ce qui est dans la page elle-même. D' accord, les instructions du sondage. Tous ces composants ne sont que des composants réutilisables et ils sont partagés car ils peuvent être partagés sur les différentes pages. Nous avons le fichier d'importation, qui parle des différentes bibliothèques que nous aimerions utiliser à l'intérieur de nos PH et de nos composants. Nous allons construire sur cela au fur et à mesure que nous allons avec le fichier app.js, quel genre de lignes certaines sections. Donc, ici, vous voyez qu'il a une authentification en cascade sur l'état. Et puis il parle de si ce n'est pas autorisé, ce qu'il devrait faire et si ce n'est pas trouvé, ce qu'elle a dit peut réellement étendre le mécanisme de routage d'origine du blazer jusqu'à dire que sous certains circonstances par défaut, vous devriez le faire ou le faire. Donc, c'est ce que l'évaluateur app.all rasoir genre installation. Ensuite, nous passons à notre fichier program.cs. Voici un dossier très, très, très important. Dans ce fichier, nous constatons que nous voulons que toutes ces choses soient en place au moment où l'application démarre. Très bien, donc program.cs va contenir notre mécanisme de démarrage, la configuration de démarrage. Donc, fondamentalement, tout ce que vous voyez ici est de voir au démarrage, au moment du démarrage, c'est ce que je voulais arriver. Prenons par exemple, ce constructeur, les constructeurs qui disent que je veux construire un tas de configurations pour l'exécution. D' accord, donc si vous regardez la première ligne, c'est là qu'il définit un constructeur. Et puis la dernière ligne exécute ce constructeur. Donc, tout ce qui se trouve entre les deux ajoute au constructeur. Builder les composants racine point, ajoutez hashtag vers le haut. Où avons-nous vu le hashtag ou quelle est la pertinence ? Si nous regardons en arrière le fichier d'index dans notre règle www pour voir que nous avons un div avec l'ID vers le haut. D' accord, donc c'est vraiment de voir qu'on veut additionner. Up est juste ce mot-clé global pour l'outil blazer up, quel que soit le composant ou n'importe quel élément HTML a l'ID. Si vous connaissez CSS, vous ne saviez pas que le hashtag signifie vraiment ID. Donc, tout élément qui a l'ID vers le haut, d' accord, et au fur et à mesure, il construit, il crée un client par défaut, qui va regarder le projet de serveur que Kim a intégré avec notre modèle. Nous avons aussi ce cygne où nous voyons, je m'étendrais vers le bas, nous ajoutons le, Eh bien, le client même au constructeur de client HTTP. Donc tout cela est fait pour vous. Si vous aviez une autre API que vous vouliez ajouter ou interrompre aussi, si vous deviez faire quelque chose de similaire pour vous assurer que cet APA est facilement accessible depuis n'importe où ailleurs dans votre application blazer. Et puis, au fur et à mesure que nous continuons, nous voyons que nous ajoutons des facilités pour l'autorisation. Très bien, donc c'est essentiellement en bref, vraiment en bref pour le client et tous les fichiers impliqués. Au fur et à mesure que nous continuerons, nous apporterons des changements et certaines choses deviendront plus claires et certaines choses auront plus de sens. Maintenant, regardons l'application serveur et je vais juste passer en revue les choses que les deux ont en commun de toute façon. Donc les dépendances qui ressemblent de la même façon. Encore une fois, il a une dépendance sur le projet client, et il a une dépendance sur le projet partagé. D' accord. Nous passons aux propriétés. Et les propriétés que nous avons le fichier de paramètres de pelouse, nous l'avons vu avant. Nous avons également celui-ci pour une dépendance de service, dont nous parlerons d'avoir une dépendance sur MS Sql. Vous devrez peut-être étendre cela. Vous devrez peut-être changer cela. On peut laisser ça tranquille pour l'instant. Ensuite, nous allons dans les régions. Donc, les zones est juste a été généré automatiquement parce que nous avons dit que nous voulions inclure les services d'identité sont les fonctionnalités d'authentification des comptes individuels. Nous avons donc la section de cette zone qui nous permet d' interagir avec la connexion et la déconnexion et ainsi de suite. Vous ne voyez pas les fichiers et savez à la place de quoi devrions-nous avoir besoin pour les personnaliser. Nous pouvons réellement les générer et ce que nous voulons. Mais pour l'instant, c'est ce que nous avons les zones pour nous enlever cela. Nous avons le dossier des contrôleurs. Et si vous avez déjà travaillé avec MVC, vous comprendrez ce qu'est notre contrôleur. Sinon, alors un contrôleur est vraiment juste un fichier ou un fichier de classe qui a des commandes. Vous voyez, j'ai accepté notre demande et je vous donnerai notre réponse. Notre demande pourrait être que je veux aller à cette page. Lorsque vous cliquez sur un lien, vous envoyez une requête à un contrôleur. Le contrôleur reçoit votre demande et vous donne ensuite la réponse sous la forme de la page Web que vous avez demandée. Si cette page Web n'est pas disponible, c'est un GET 400 fours et si quelque chose ne va pas entre les deux, alors vous obtenez une erreur. Donc, c'est à peu près ce que notre contrôleur est quatre, donc nous allons utiliser des contrôleurs API parce que comme je l'ai dit, le projet de serveur sert vraiment un but. Entretien du projet client avec une API. Nous avons donc un exemple. J' aurai deux contrôleurs. Je ne vais pas trop entrer dans celui-ci avec le contrôleur de configuration OID c parce que c' est un contrôleur de configuration. Et plus tard, quand nous faisons des choses d'authentification, arriverons à comprendre cela un peu plus. Ce que le contrôleur de prévisions météo Farnell parle juste des différents points d'extrémité et c'est un joli petit échantillon pour vous permettre de voir comment les choses vont ensemble et comment elles peuvent fonctionner. Donc, lorsque vous demandez la prévision météo, ce point de terminaison obtient des coups, est-ce que cette action est touchée, donc les actions du contrôleur, puis l'action est touchée, puis il renvoie ces données. Et ces données sont envoyées par les boucles d'API à un client, et c'est ce que l'utilisateur verra. Donc, c'est tout en bref, données définiront certaines de nos configurations et classes de base de données, et ainsi de suite. Donc, non, on n'a pas besoin d'en parler plus tard, quand on sera assis au sommet, on entrera dans ces dossiers. Les modèles ne sont que des abstractions des classes de données. Et puis nous pouvons passer aux pages et l'entendre dans le projet serveur Girona, C1, ph. Et vraiment et vraiment, je ne suis pas sûr si jamais nous verrons vraiment et interagirons avec le discours ou toute autre page que nous faisons ici. Parce qu'une fois de plus, le point focal de notre AP est le côté client, l'application client, le projet client, n'est-ce pas ? Donc le pH est là, mais nous ne ferons pas grand-chose là-bas. De toute façon. Nous avons jusqu'à settings.js son une fois de plus un autre fichier de configuration. Nous avons le program.cs. Et si vous regardez le program.cs ici, il est légèrement différent du program.cs dans le client. Mais ils font vraiment la même chose parce que le program.cs dans le client, c'est le même programme de classe sauf qu'il fait tout cela dans la fonction principale, non ? Si vous connaissez C sharp une fois par, la première chose qu'il va chercher comme un fichier program.cs, et il va exécuter la fonction principale. C' est comme ça qu'ils fonctionnent. Donc, dans le projet de serveur, nous avons le démarrage, c'est désolé, nous avons le program.cs. Il a aussi la fonction principale, mais à une fonction principale appelle une autre fonction. Et cette autre fonction qu'il appelle à peu près exécute ce qui est dans le startup.js. Donc, si vous regardez dans le style.css, alors vous verrez une configuration et une configuration très similaires à ce que nous avons vu dans le program.cs dans le côté client. Donc, c'est vraiment une chose très similaire. C' est juste mettre en place bootstrapper pour dire que lorsque l'application démarre, sont des services et des fonctionnalités que je veux m'assurer que j'ai été heureux. Donc rouge ici, il semblait que je voulais me connecter à la base de données qui peut être trouvée à la connexion par défaut. On n'a pas encore préparé ça, mais c'est là. Il voit que nous voulons ajouter un filtrage d'exception. Nous voulons ajouter une identité en utilisant le modèle d'utilisateur de l'application. On en parlera plus tard. Et nous voulons ajouter le serveur d'identité a dit que c'est un serait obtenir les capacités du serveur d'identité, qui est lorsque l'authentification du gestionnaire et l'autorisation, nous voulons utiliser une certaine authentification JWT. Donc tout cela peut sortir de la boîte sans que nous ayons à faire trop de configuration. Et puis il veut ajouter des contrôleurs avec des vues et ajouter des facilités pour faciliter les pages. Vous verrez également qu'il y a la section middleware où il ajoute d'autres fonctionnalités. Pour que je puisse aller ligne par ligne. Mais certains d'entre eux, quand vous les regardez, ils sont assez explicatifs et au fur et à mesure que nous allons interagir avec eux une fois de plus. Donc, c'est vraiment tout pour les projets serveur et client. Et puis quand nous regardons les prévisions météo, verra ici que c'est vraiment juste le modèle, non ? Donc, si nous regardons les références, vous voyez que ce modèle, ce fichier est référencé à la fois dans l'application cliente. Donc, si cette référence, vous voyez qu'elle l'utilise dans le client ou dans le composant de données de récupération. Et il l'utilise également dans le serveur. Côté dans l'appel d'API. Donc, je suis juste en train de pointer que totes pour mettre en évidence ce que le projet partagé est loin parce que ce modèle peut servir les deux projets et ainsi de suite. Nous avons des choses en commun entre les deux. Nous pouvons simplement les définir à l'intérieur du partage. Donc, je vais juste exécuter cette application pour qu'ils puissent voir à quoi ça ressemble. D' accord, donc c'est notre modèle de base pour notre blazer. Encore une fois, ce sont nos projets clients en cours d'exécution. Donc, si vous regardez le port numéro quatre pour trois, laissez-moi juste vous montrer rapidement le parallèle. Donc, si je vais au client et puis aller à Properties pelouse sittings, il est là pour 4384. C' est donc l'application cliente que nous avons en cours d'exécution ici. Donc, le compteur, quand nous cliquons, regardez cela, nous pouvons cliquer et il change. Et j'ai soudainement interrompu quand on récupère des données, regarde ce qu'il savait. Donc, il a dit récupérer des données, vérifier l'état de connexion, puis il lance cette page de connexion. Cette page de connexion vient vraiment des services d'identité. Vous voyez ici qu'il voit la voiture dans le serveur de points de gestion. Alors rappelez-vous que nous avions la section de cette zone que j'ai signalé est vraiment pour l'authentification, non ? Donc, ce rendu des pages vraiment à partir d'ici. C' est ainsi que fonctionne le serveur d'identité, si vous pouvez réellement rester coincé pour juste réécrire, réacheminer , désolé, une requête authentifiée au serveur d'identité, puis ce Pj sera servi. Et une fois qu'il sera satisfait, alors il passera. Si je peux, le app.js et voici où il l'a fait. Donc, il a dit quand il n'est pas autorisé, droit, puis rediriger vers la connexion. Donc lecteur et une redirection à la connexion, c'est un composant. Si nous regardons ce que fait ce composant, et que ce composant est en redirection partagée pour se connecter voir, naviguez à l'authentification sur la connexion slash avec notre URL de retour et toutes sortes de choses. Donc je vous montre juste comment tout est étroitement couplé, juste savoir que tout semblait si transparente. La seule chose qui n'a pas vraiment vu ça, c'est que ce n'est pas le cas, ça ne ressemble pas au thème général du pH avec lequel on a commencé, non ? C' est la seule chose qui n'a pas l'air très transparente. Mais le fait est que si je ne vous expliquais pas tout cela, et je me rends compte que j'ai tellement de pièces mobiles qui travaillent pour rendre tout cela. Donc oui, et tous nos trucs de connexion et d'enregistrement ne fonctionneront pas parce qu'il y a des choses que nous devons faire. Mais je vous montre juste comment les lames sont des regards. Et j'espère que vous avez apprécié ce magasin où nous avons vu comment toutes ces choses fonctionnent ensemble. Et s'il y a encore des choses qui ne sont pas claires, bateau, alors que nous allons le long, ils auront plus de sens. Alors restez à l'écoute. Ensuite, nous allons parler de l'aspect et de la sensation de l' ensemble du modèle et de la façon dont nous pouvons le modifier. Et au fur et à mesure que nous allons continuer à ajouter des fonctionnalités et explorer de plus en plus de bateaux sont des options dans cette application blazer. 7. MISE à page : Réaliser ou améliorer le projet de projet. NET 6: Hé les gars, dans cette leçon, nous allons regarder deux choses. Premièrement, comment créer le projet Blazer WebAssembly à l'aide de dotnet 6. Et nous examinerons également comment vous pouvez mettre à jour si vous l'avez déjà créé dans Donot cinq, ce qui est étonnamment très facile. Commençons donc par la façon dont nous le créons. Donc tout ce que j'ai à faire pour ouvrir Visual Studio 2022 au lieu de 2019 car six sont uniques à 2022. Je peux donc simplement aller de l'avant et créer un nouveau projet. Je vais sélectionner mon application Blazer WebAssembly, modeler ensuite, puis je lui donnerai mon nom. C'est donc la voiture et le filet de gestion 6. Je dis net 6 parce que j'ai déjà le projet dotnet cinq avec le nom current management dans le même répertoire. Si c'est le premier que vous créez avec ce nom, vous n'avez pas besoin d'en mettre six sur le net ou vous pouvez lui donner le nom avec lequel vous n'avez pas besoin d'en mettre six sur le net ou vous vous sentez à l'aise. Après avoir sélectionné le nom, nous passons à la suivante, puis nous voudrons sélectionner quel framework pour pouvoir utiliser dotnet cinq, nous pouvons utiliser Dani core 3.1, mais dotnet six est unique à Visual Studio 2020. Pour tirer le meilleur parti de ce cours, vous voudriez utiliser Don à cinq ans, car ce cours est enseigné dans le contexte de « Done at five ». Et tout ce qui est enseigné ici est compatible avec Dotnet 6, entre autres choses. Vous voudrez donc utiliser dotnet six et vous voudrez choisir le type d'authentification pour être des cônes individuels. Et vous pouvez prendre chacune des options suivantes. Une fois que vous avez réussi tout cela, vous pouvez continuer et cliquer sur Créer. Supposons maintenant que vous avez déjà créé le projet Dotnet cinq et que nous avons déjà fait un tour des dossiers. Et ce que chaque fichier à un niveau supérieur représente vraiment, signifie vraiment et comment il est utilisé dans le projet. Donc, si nous voulons le mettre à jour vers dotnet six, tout ce que nous avons vraiment à faire, et juste quelques étapes. Premièrement, nous voulons modifier le cadre cible. Vous voulez donc cliquer sur ce fichier CSV. Ce dossier est-il en haut du projet ? Il suffit de cliquer dessus une fois et il ouvrira ce fichier modifiable. Le cadre cible est 6. Donc, ça aurait vu 5. Vous pouvez changer cela par six. Et vous souhaitez également ajouter ces deux paquets pour pouvoir simplement appuyer sur Pause et les retaper si nécessaire. Vous voulez donc ajouter ces deux paquets et ensuite, si vous effectuez une génération, vous obtiendrez des erreurs. Ne paniquez pas car il suffit de faire la même chose pour le projet serveur. Vous permet de cibler six objectifs et d'ajouter les mêmes deux. Vous pouvez donc simplement les copier à partir du client et les coller à l'intérieur du fichier serveur. Une fois cela fait, vous souhaitez probablement mettre à jour le dossier partagé également vers dotnet six. Cette partie est vraiment facultative. Vous pouvez également le faire. Alors, tu le veux. Il y a donc quelques étapes, mais ce sont des étapes très simples. Je ne fais que te donner petit à petit. Donc, pour moi, la chose la plus facile à faire pour mettre à jour les paquets, car ce qui se passe, c'est que nous ciblons dotnet six, mais tout par défaut ciblerait dotnet cinq. Vous voulez donc que tout soit jusqu'à la même version pour pouvoir enregistrer la solution à ce stade et accéder à Gérer les packages NuGet pour la solution, ce qui vous permettra ensuite d'exécuter simplement des mises à sur tous vos projets en une seule fois. Je vais donc simplement passer aux mises à jour qui seront remplies dans quelques secondes. On y va. Et tous ces éléments doivent être mis à jour de leur version actuelle en cinq points à six. Désolé, allez-y et dites « mise à jour ». Bien sûr, nous devons accepter un contrat de licence si vous n'êtes pas très familier avec cette étape, comme dans ce qu' est le gestionnaire de paquets NuGet et comment cela aide, mais , ou plus tard, tout cela aura du sens pour vous. Donc, avec toutes ces mises à jour terminées, je reçois encore quelques erreurs et je pense que c'est parce qu'elles filtrent peu à peu notre bizarre. Mais je pense que certains projets ne se sont pas encore accrochés. Je vais donc construire, faire une solution de reconstruction. Et maintenant, nous avons tout reconstruit avec succès et 0 flèches. C'est donc comme ça que ça fonctionne. Et au fur et à mesure que vous utilisez Visual Studio 2022, vous verrez que l'outillage est bien meilleur. Vous verrez des choses que vous ne verrez pas nécessairement sur mon écran car j'enseignerai majeure partie du cours en 2019. Mais vous obtiendrez un certain code indiquant que vous voyez ici qu'ils le peuvent, ils vous demandent si vous voulez autoriser code IntelliJ à vous surveiller et à l'aider. En d'autres termes, dans Teleco fait un Intellisense amélioré qui vous donne meilleurs indices de code que les arrêts standard. Vous allez donc vous amuser absolument. Une autre fonctionnalité cool qu'ils ont introduite, sa recharge à chaud, vous pouvez voir ici avec cette boule de feu. Donc, lorsque nous construisons des interfaces d'auteur, vous verrez que je vais apporter certaines modifications CSS ou certaines choses, puis je devrai redémarrer. C'est l'une des limites de 2019. Si ce n'est pas le cas, si vous utilisez 2022, vous pouvez simplement recharger à chaud et ensuite rafraîchir l'interface sans que vous ayez à redémarrer la version. Si tout cela vous est puni, ne vous inquiétez pas au fur et à mesure, vous vous y habituerez et vous commencerez à apprécier toutes ces petites choses. Et si vous êtes déjà familier avec l'interface Visual Studio, vous verrez des choses étonnantes sortir de ce nouvel IDE. Si vous ne pouvez pas effectuer la mise à niveau, cela ne pose aucun problème. Tout ce qui se trouve dans ce cours est convivial pour l'un ou l'autre des environnements. C'est donc tout pour l'instant. Je vous verrai dans la prochaine leçon. 8. Personnaliser la mise en page de Blazor: Hé les gars, bienvenue. Dans cette leçon, nous étudierons notre blazer. Sachez si vous êtes familier avec n'importe quelle forme de développement que vous savez que le style d'une application Web a vraiment juste à voir avec modifier et le CSS et le HTML pour nous assurer que nous pouvons offrir la meilleure expérience utilisateur à tous ceux qui vont d'interagir avec notre haut. Si vous êtes par extension familier avec les applications .net MVC ou les pages de résultats du serveur d'applications .NET Core MVC. Vous savez que nous obtenons ce fichier de mise en page layout.css HTML, qui définit fondamentalement le ton pour l'apparence de toutes les pages. Blazer le fait un peu différemment livres à la fin de la journée, c'est le même concept de HTML et CSS que nous avons vu sur la tournée. Nous avons un tas de fichiers HTML. Nous avons des fichiers CSS, et ce que nous allons faire, quelques modifications mineures vont transformer ce qui est à l'écran null pour ressembler à quelque chose de plus comme ça. Donc je le donne tendance au champ sombre, non ? J' enlève le surligneur violet pour tousser la barre en haut, et je déplace la section de navigation vers la gauche. Donc, pendant que nous faisons cette activité, ce n'est pas beaucoup, mais cela nous donnera une idée de l'endroit où nous pouvons aller pour modifier Watts. Et nous aurons aussi une petite idée de CSS entier. L' isolation Css fonctionne en blazer. Maintenant, juste le mandrin un peu. Donc, l'un des fichiers les plus importants sera modifié en général quand nous allons m'ajouter parce que certains thèmes, scripts personnalisés ou quelque chose comme ça à l'ensemble blazer up serait le fichier index.html parce que cela donne le ton pour l'index du document HTML désolé avec des balises de tête, tous les liens CSS, toutes les nièce js point, sa propre à l'avance, à droite, donc vous finiriez par modifier cela à un moment donné, cependant, au-delà, tout est chargé dans notre div avec l'ID vers le haut. Donc au-delà ou nœud index.html. Le fichier le plus important suivant serait nos principaux plateaux Leo sont qui rend alors une div appelée page, nous donne notre menu nav sur le côté, non ? Et puis il nous donne notre principale zone de contenu où nous avons l'affichage de connexion haut qu'un lien de bateau, et puis ce qui vient dans le corps. Donc, voici où beaucoup de magie se passe en termes de CSS et c'est là que l'isolation CSS intervient. Il n'y a pas un gros fichier css. Je veux dire, oui, nous avons des fichiers CSS à notre disposition dans le dossier CSS. Nous avons app.js, CSS, qui a un CSS général pour l'application qui correspond vraiment à l'ici ou au fichier d'index parce qu'il y a une référence, non ? Mais quand il s'agit de la mise en page principale, il a son propre fichier CSS comme nous l'avons vu auparavant. Donc, à partir d'ici, je peux contrôler certains éléments qui ne sont que dans ce composant. Et je peux appliquer ces styles CSS, quoi que ce soit en conséquence. C' est donc le pôle de l'isolement CSS. Je peux avoir un fichier CSS dédié aux composants Ariza séparé du CSS général UP. Commençons par un changement de couleur de la barre de navigation. Donc, pour accéder à la barre de navigation CSS, je peux dire OK, la barre de navigation suffirait. Le menu se trouve dans cette div appelée barre latérale. Si je passe au point principal Leodes, point CSS, je vois la barre latérale de la classe. Alors qu'est-ce que ceux qui ne savent pas est appris pendant le dégradé, c'est pourquoi vous voyez un peu de changement ombragé en violet si vous voulez courir à nouveau et le regarder. Mais c'est pourquoi il change d'ombre en violet. Donc, ce que je vais faire est juste de commenter ceci. Je veux dire, vous pouvez le supprimer si vous voulez que quelqu'un le conserve. Et je vais mettre dans un autre style comme sa couleur de fond, puis hashtag et ce saké de valeur et juste arracher ça. Et c'est ce qui lui donne ce bon accord de ne pas sombre type de fond, non ? Alors voyons à quoi ça ressemble. D' accord, j'ai fait le changement et j'ai chargé l'application et je ne vois pas les changements. Et maintenant, c'est juste quelque chose avec la mise en cache. Vous pouvez faire un certain nombre de choses ici. Vous pouvez effacer votre historique et réessayer, quel que soit le navigateur que vous utilisez. Ou vous pouvez maintenir le contrôle et appuyer sur F5. Donc Ryan, non, c'est le gradient mais cultivé pour la barre de navigation quand je contrôle F5, puis j'ai mon fond sombre. On y va. Bon, donc si vous rencontrez des difficultés avec ça, contrôle F5 et vous devriez aller bien. C' est donc ce qui se passe lorsque je change le CSS dans ce fichier CSS spécifique pour ce composant. Alors voyons ce qu'on peut faire d'autre. Je n'ai pas dit qu'on voulait enlever cette barre supérieure. Laissez-moi revenir à l'accord, au menu principal. Et cette rangée supérieure ici, il est, haut Reuters dans l'affichage de connexion, ainsi qu'un lien de résidence. Je ne veux pas de ça, donc je vais juste déplacer un peu l'affichage de connexion et prendre ça. En fait, dans la démo, j'avais l'affichage de connexion affiché menu nav. Donc, ce que je peux faire est de prendre l'affichage de connexion, n'est-ce pas ? Donc, ce n'est qu'une référence à l'ensemble du composant appelé affichage de connexion. Ensuite, je vais aller au menu nav et je suis toujours en mode débogage, mais rafraîchir plus tôt, bientôt, assez tôt, désolé. Et ce que je vais faire dans le menu nav est coller notre composant d'affichage de connexion, non ? Donc assez de menu a des boutons pour qu'est-ce qu'on a ici ? Nous avons la maison, où ont le comptoir et nous avons la récupération. Ce sont les trois nombreux objets que nous voyons, le comptoir de la maison Fitch. Et puis il a quelque chose à réduire le menu et c'est très bien. Donc, ce que nous devons savoir, c'est en fait s'assurer que l'affichage de la connexion est conforme à la façon dont tout le reste boucle. Parce que comme nous l'avons vu, il n'y avait vraiment que des liens dans la barre de navigation. Donc je vais me rafraîchir et là on peut voir à quoi ça ressemble. D' accord, et c'est ce que je vois. Donc je vois les deux liens. Le bar du haut est parti. Si accompli que ce que sont les outils, ils sont, ils ne sont pas tout à fait adaptés à la conception de notre barre de navigation. Alors modifions ce qui est dans l'affichage de connexion pour ressembler à ceci. Et je vais juste copier ceci parce que je sais que la façon dont les liens doivent regarder dans la barre de navigation dépend de ce bloc entier. Nous avons besoin de ça, et nous avons besoin de toutes ces classes en cours de route. Donc, je vais juste copier ceci, sauter à l'affichage de connexion. Et puis ici, nous verrons que nous avons autorisé sous des vues non autorisées. Cependant, nous avons aussi remarqué qu'ils ne sont qu'un tas de balises d'ancrage, non ? Donc, vous remarquerez que ce blazer est livré avec certains composants qui vous aident à émuler certains éléments HTML, n'est-ce pas ? Donc le lien de navigation serait un tel composant qui vous donne une balise d'ancrage ou c'est juste une façon blazer de voir Oncotype parce que vous remarquez qu'ils ont tous les deux la même référence H, n'est-ce pas ? Donc je peux rester cette référence H, la remplacer ici. Et je vais juste transformer cette LI. Eh bien, je veux dire que le LI va me donner le type de lien dont je dois tenir dans la barre de navigation. Donc, je suis vraiment en train de transformer cette balise d'ancrage en cette LI. Alors c'est ça qui s'insère, non ? Donc, le texte que je veux être divisé serait ce qui serait affiché ici dans cette balise d'ancrage, les noms d'utilisateur hello et nous remplacons la maison. Et pour ce serait les Profils. Donc, je pense que pour l'icône, je vais utiliser des personnes OID. Donc, nous avons tous, nous avons ces icônes à notre disposition à travers open iconic. Il est déjà inclus dans le projet. C' est comme ça que nous obtenons cette petite maison sur le signe plus et ainsi de suite, sur la barre de navigation. Juste au cas où vous ne seriez pas familier. Si vous l'êtes, alors vous devriez vous sentir bien du tout. D' accord ? Donc c'est celui pour si la personne est autorisée, ce qui signifie que la personne a déjà connecté que l'on dit profil, le suivant dit logos. Donc, je vais juste dupliquer ce que j'ai peu de code et remplacer ce que j'ai besoin de remplacer maintenant et regarder la différence avec cela. Celui-ci est un bouton. Celui-ci a été fait sur cryptologie. Celui-ci est un bouton. Voyons ce que fait le bouton. Le bouton a onclick événement qui dit Être commencer psi néant. Et puis en bas, vous voyez un bloc de code avec cet événement très clic commence psi néant. Et puis ce qu'il fait, c'est qu'il navigue vers cette URL. Donc je pourrais, vous savez, je pourrais garder le bouton, mais ensuite j'utilise des liens de navigation. Donc, au lieu de modéliser le top, je vais juste le garder cohérent de démêler ici, d'innover ici. Donc, ce que je vais faire est de définir le HRF pour le lien de navigation du logo pour être la même URL vers laquelle il aurait navigué. Donc, l'âge ref ici est les authentifications slash logos. D' accord ? Et puis celui-ci, je pense qu'il y a un logo icône Ouvrir. Si je ne me trompe pas, on y va. Le logo du tableau de bord, non ? Et puis je vais juste commenter ces deux-là parce que je n'en ai pas besoin. Je viens de les remplacer. L' étiquette d'ancrage pour le profil de la personne ainsi que le bouton du logo. Je les ai remplacés par des liens de navigation d'outils allant aux mêmes endroits, non ? Donc, vous pouvez faire une pause ici et vous pouvez essayer de faire la même chose avec ces deux-là. Je vais juste le faire. Donc, je viens de remplacer le login et de m'inscrire avec les balises LI correspondantes. D' accord, et pour le registre, j'ai o, i tiret Burson pour l'icône, puis pour la connexion ou la connexion en pointillés, connexion au tiret, désolé. D' accord. Et puis vraiment et vraiment ce bloc de code devient inutile parce qu'il n'y a rien qui va l'appeler de toute façon. Mais plus tard, nous commencerons à écrire le code et à comprendre ces blocs de code et événements. Cependant, regardons rapidement à quoi cela ressemble. D' accord, donc c'est ce qu'on a. Non, vous verrez qu'il ressemble un peu plus à la maison avec tous les autres liens regardent les deux en même temps. Ce n'est pas le cas, ils ne s'intègrent toujours pas. Et c'est un autre point du blazer, la partie d'isolation CSS du blazer où oui, ils sont dans le composant de la barre de navigation. Mais c'est un autre composant tout seul. C' est le composant d'affichage de connexion, et nous l'appelons simplement à partir de la connexion, à partir du composant de menu nav. Mais ce sont deux composantes différentes. Donc, le CSS qui s'applique au menu nav ne s'appliquera pas ici car il s'agit d'un composant entièrement différent. Alors ce que je devrais faire pour obtenir ces liens pour afficher comment tous les autres liens s'affichent. Et je vais juste prendre cet auteur entier que vous de la copie d'affichage de connexion et puis venir ici. Et au lieu de référencer le composant d'affichage de connexion, je vais juste faire tout ce contenu là. D' accord, alors nous avons l'autorisation, vous autorisez à ne pas connaître les alliés, qui devrait être affiché en conséquence. Et tout tombe dans les composants du menu nav, ce qui signifie que tout le style du composant sera maintenant appliqué. Donc c'est nous redémarrer et voir ce que cela. Et quand nous reviendrons, nous voyons quelque chose qui semble différent. Droit ? Donc ça me semble un peu mieux. Comme, oh, il a l'air de neige. Vous pouvez faire est d'aller de l'avant et de cliquer le long du chemin et vous voyez que le lien roman fonctionne là. Et si je reviens et puis je clique sur S'inscrire et voir que cela fonctionne là aussi. Nous pouvons donc être assurés que tous nos liens fonctionnent. Tout semble uniforme. Et encore une fois, il, dehors des nuances avec nous avoir à partager notre CS, ou ils ne sont pas sûrs du CSS à travers les composants. Vous pouvez voir où c'est plutôt la même chose quand il s'agit de style dans les blazers, juste qu'ils vous donnent la possibilité d'appliquer un composant CSS unique si vous le souhaitez. Mais finalement, vous pouvez tout coiffer d' une protéase comme avec n'importe quelle autre application. 9. Créer des composants de Blazor: Dans cette leçon, nous allons jeter un oeil à certains composants blazer et comment nous pouvons les créer, quoi ils peuvent être utilisés. Et ce n'est qu'un brillant par-dessus où et a commencé l'application AR que nous apprenons encore, notre environnement blazer et toutes les choses qu'il nous offre. Donc, je ne vais pas aller trop en profondeur, mais ce dont je veux parler est tout un, nous pouvons créer plus de pages. Et deuxièmement, comment nous pouvons créer des composants qui peuvent être incorporés sur les pages. Donc, quand nous parlons d'une page, nous voulons vraiment dire quelque chose que nous pouvons naviguer pour écrire. Donc, quand je clique sur le compteur, il change, il va à la page du compteur et vous pouvez le voir dans l'URL ii va du compteur barre oblique d'adresse de l'hôte local. Si je clique sur peigne, ça remonte, non ? Ceux-ci pour récupérer des données va essayer d'aller chercher des données, mais alors il est protégé contre un accès non autorisé. Et donc il va naviguer vers la page de connexion. On n'y va pas tout de suite. Mais ce que je veux faire est de créer une autre page, comme tout ce que nous avons le compteur pêche, puis de créer notre composant que nous pouvons ensuite intégrer sur cette page afin que nous puissions voir un haut de gamme devant nos yeux. Avant d'entrer dans cela cependant, jetons un coup d'oeil à ce que la page du compteur a. Donc, la page de compteur, qui est vraiment juste un composant, se trouve dans les pages et vous verrez cône Teradata rasoir. Et les raisons pour lesquelles c'est vraiment juste un composant. Si vous regardez partagé, vous voyez que tous sont là avec les tableaux sont. Et nous venons de passer par la dose d'affichage de connexion contre Nev Many contre tout ça, non ? L' hiver si froid et ceux-ci partagent une chose. Tous les rayons sont des composants. Cependant, partagé implique que ces composants sont utilisés dans de nombreuses applications. Versus le Pij est où le, le composant sert littéralement une page. Donc, lorsque vous regardez ce composant pour compteur, vous verrez qu'il a cette directive de haut à la page. Et puis il dit que le serveur racine ne cliquera que sur ou modifiera son sur le SRE de Colin. Il a dit l'adresse de l'hôte local barre oblique compteur. Eh bien, c'est pourquoi. D'accord, d'une façon ou d'une autre, j'ai tout le contenu. Nous nous souvenons que nous avions le mot « terreur côlon ». Nous ajoutons que les cônes actuels, et puis nous avons eu notre bouton. Et ce qui se passe, c'est que lorsque vous cliquez sur le bouton, il y a un événement onclick qui dit, eh bien, incrémenter par un. Encore une fois, nous allons entrer dans tous les onclick et ainsi de suite, peu plus tard. Donc je ne vais pas passer trop de temps là-dessus. Donc, si je voulais créer une autre page, je pourrais aller à Pages clic droit dire composant rasoir. Et puis à partir d'ici, je peux donner un nom à ce composant. Alors disons que je veux appeler celui-ci des gens. Ph, d'accord, parce que c'est tout ce que ça va vraiment être à ce stade. Donc je voulais juste échantillonner la page. Maintenant, la première chose que je voulais faire est de lui faire savoir que c'est optimiste. J' ai donc besoin d'avoir signé la page en haut et ensuite je lui donne son itinéraire. Donc, je dis barre oblique exemple de page. C' est ce que vous devez taper pour accéder à ces composants. D' accord ? Et laissez-moi juste dire que c'est un h3. Alors laissez-moi utiliser un H5 et dire que c'est une page pleine. Très bien, maintenant pour y arriver à partir du menu, parce que pas de survol nouvelle pièce que je veux naviguer pour avoir à aller à mon composant de menu nav, que j'ai encore tous ces commentaires, pas de problème. Mais alors je dois l'ajouter à la barre de navigation a vu rire est vraiment juste prendre une copie de cela et le changer. Donc celui-ci dit que c'est des données de récupération ref. C' est un compteur rugueux. Qu' est-ce que ça veut dire ? Eh bien, le compteur a les données de récupération du compteur racine a la barre oblique de la route chercher les données. Donc, pour accéder à ma page, j'ai besoin de barre oblique exemple de page. Donc, pour le nouvel élément de menu, je vais juste dire h ou f est égal à l'exemple de page. Bien sûr, je dois changer le texte pour qu'il soit clair que c'est pour ça. Et je ne changerai rien d'autre. Parce qu'une fois de plus, c'est un expérimental. Donc, quand je lance cette application, je vais voir ma nouvelle page d'exemple d'éléments de menu. Et quand je clique dessus, nous naviguons à la page d'exemple avec notre contenu droit ? Et notez la page exemple de barre oblique d'itinéraire. Donc, si j'ai dit une page 1, alors ça va dire pendant quatre jours rien à cette adresse. Il ne sait pas ce que c'est. Certains verbiages, cependant, me ramèneront toujours à ma page. Nous allons donc créer nos composants qui étaient, vous savez, des composants qui peuvent être réutilisables. Donc, si c'est quelque chose que nous voulons utiliser plusieurs fois plusieurs, s'il vous plaît est intégré ici, mais afficher entièrement là, que nous allons examiner. Encore une fois, ce n'est qu'un aperçu des capacités. Mais regardons en fait mettre cette partie dans un composant et ensuite intégrer ce composant sur notre terrain. Disons que je voulais des composants, mais que cela ne voulait pas vraiment les mettre dans le même dossier partagé, n'est-ce pas ? C' est donc aussi simple que de créer un nouveau dossier. L' organisation des fichiers est toujours très importante, donc je vais juste l'appeler composants, non ? Donc, nous connaissons les composants. On y va. Et puis ici, je peux dire ajouter un composant de rasoir. Et puis je vais appeler cela quelques personnes pij composant, notre exemple de composants de contenu de page. Et juste être très explicite pour que je puisse me souvenir de ce que c'était, non ? Donc maintenant, nous avons ce composant. Je peux y mettre tout ce que je veux. Je peux dire que je ne voulais pas que ça soit imprimé là. Je voulais le mettre à l'intérieur de ces composants peuvent être mis dans un bouton. D' accord ? Et celui-ci va juste dire Bonjour, monde, non ? Bien sûr, ils utilisent Bootstrap, prévu toutes les quatre classes Bootstrap s'appliquent. Je peux dire btn dark, juste pour lui donner un peu de caractère. Et maintenant j'ai ce composant, non ? Non, je veux que le contenu de ce composant soit incorporé dans cette page. D' accord, donc ce que je peux faire ici, c'est simplement appeler ce composant comme s'il s'agissait d'un remorqueur. D' accord ? Mais vous remarquez maintenant qu'il a une ligne rouge squiggly et qu'il n'a pas tout à fait ce vert. Voyons si je peux en trouver un autre, non ? Donc, quand nous avons affaire à des composants, vous voulez toujours voir ce vert embolder le texte. Vous ne voyez pas tout à fait ça ici. Pourquoi ? Parce que nous avons besoin d'inclure une bibliothèque pour pouvoir accéder à celle-ci car ce n'est pas dans le même répertoire que la page exemple. C' est dans un autre répertoire et il ne sait pas ou la vue ne structure personne. Donc, nous pouvons ajouter une instruction use ici où nous voyons en utilisant la gestion actuelle, c'est notre nom de projet, plantes de point de gestion actuelles sont, qui est notre nom de projet, qui est notre nom de projet, qui est notre dossier nommé comme espace de noms. Et une fois que nous avons cette instruction en utilisant, nous pouvons alors accéder au composant et vous voyez tout semble correct. Bien sûr, l'utilisation d'instructions peut devenir désordonnée. Donc, ce que vous pouvez faire alternativement est de les mettre dans les importations. Donc, dans les importations, vous pouvez les empiler en utilisant Zelda en utilisant toutes ces bibliothèques que vous connaissez, vous allez utiliser nos vues multiples croisées. Vous pouvez simplement aller de l'avant et les inclure dans ce fichier d'importation. Chaque vue va regarder cela ou tous les composants sont, sont les entrées candidates. Donc, il saura, sait que c'est là qu'il devrait regarder. Alors, lançons ça et voyons à quoi ça ressemble. D' accord, donc on est de retour dans notre haut et je regarde l'exemple de page et le voilà. Donc je vois du contenu et du composant d'ordures, non ? Donc, c'est l'exemple de page qui est h3 tag que Kim à l'origine avec le composant r. Il est là. Mais alors notre composant de contenu de page échantillon a son propre titre, a le contenu et le bouton Hazara que nous savons pour être cuir foncé ou ainsi de suite thème, à droite, donc c'est juste une fois de plus, une introduction rapide ou une brillance rapide sur la façon dont nous pouvons créer nos propres composants. Et au fur et à mesure que nous nous appuyons sur cette application, nous allons voir de plus en plus de fonctionnalités sortir. 10. Révision et ajouter des changements à GitHub: Salut les gars, bienvenue. Nous sommes donc ici à la fin de notre premier module où ce que nous avons fait était de créer une nouvelle application blazer. Nous avons eu une visite rapide de tous les fichiers, tenir le chacun jouer un rôle dans l'ensemble de cet écosystème. Ensuite, nous avons examiné comment nous pouvons personnaliser l'apparence et la sensation de celui-ci et même créer quelques composants pour nous-mêmes. Donc, nous n'avons pas beaucoup fait, mais au moins maintenant nous avons un TS trucs beaucoup blazer est et si cela semblait intimidant avant le milieu, vous réalisez probablement que c'est vraiment juste une autre application .NET Core à ce stade. Ou je veux juste garder une trace de l'endroit où ça change. Et nous allons prendre des cônes plus courts comme celui-ci à la fin de chaque module va juste vérifier ou citations sont dépôts GitHub afin que nous ayons nos points de contrôle de base dans l'histoire de l'évolution de notre projet. J' espère que vous avez déjà créé votre compte GitHub. Et ce que nous devons faire pour aller de l'avant serait simplement d'ajouter au contrôle de la source. Donc, si vous regardez dans le coin inférieur droit de vos sites Visual Studio, désolé, fenêtre. Vous devriez voir Ajouter au contrôle source. Donc, vous pouvez aller de l'avant et cliquez sur cela et vous devriez voir obtenir. Et puis cette fenêtre s'ouvre. Et si cela vous invite à vous connecter, alors vous fournissez vos informations d'identification GitHub. Il sait déjà qui je suis et il connaît le chemin local. Mes cônes, je suis le propriétaire, le nom du dépôt. Je peux lui donner une description. Je peux le rendre privé ou public. Je vais le rendre public pour que vous puissiez y accéder, bien sûr. Et je vous recommande de le rendre public en général afin que d'autres personnes puissent rencontrer et voir le travail que vous faites. Et cela peut vous aider à créer votre portefeuille pour qu'il puisse le partager avec les futurs employeurs. Donc vous pouvez aller de l'avant et le rendre privé. Cependant, si vous, si vous avez vu souhaitable d'admettre mon en public une fois de plus, puis dire simplement créer et pousser. Les résultats de toutes ces actions seront la création de votre propre référentiel GitHub. Encore une fois, si vous l'avez rendu public, alors quelqu'un peut venir sur GitHub et chercher votre handle qu'il peut trouver le projet. Mais le prochain arrêt, on va commencer à regarder des trucs amusants. Nous allons commencer à regarder un peu plus ajouter remorqué, le moteur d'authentification fonctionne, le moteur d'authentification fonctionne, ainsi que la façon dont nous pouvons commencer à mettre la base de données derrière notre application. 11. Aperçu de la section - Opérations de base de données: Salut les gars, bienvenue. Dans cette section du cours, nous allons examiner certaines des opérations liées aux données qui peuvent nous être offertes par le biais de toute notre application blazer. Donc, lorsque nous avions créé ou l'application nous ajoutons indique que nous voulions l'authentification sur les dispositions. Et hors de la boîte, ce que le bootstrapper a fait était de nous donner accès au serveur d'identité, que nous avons examiné brièvement difficile à Arras et identité et pages. Vous verrez que nous avons quelque chose ici qui indique des opérations liées à l'identité. Et l'identité est la bibliothèque que Microsoft utilise pour les sessions de gestion des utilisateurs, stockage, toutes ces choses. Donc, connectez-vous, déconnectez-vous, et toutes ces fonctionnalités merveilleuses sortent de la boîte à travers la bibliothèque de base d'identité. Par extension, ils auraient également inclus les bibliothèques Entity Framework Core qui nous permettent de faire mon grisâtre sur les configurations un contexte de base de données dans une première méthode de citation et en fait construire la base de données à partir de notre op, puis l'a scuffé par la suite. Donc, dans cette section, nous allons adopter une approche étape par étape pour comprendre comment toutes ces pièces se rassemblent et comment exactement nous allons construire notre base de données pour notre blazer, car cela n'a pas de sens. Nous commençons à construire toutes les fonctionnalités de souscription si nous n'avons pas d'espace de stockage, n'est-ce pas ? Donc, quand nous reviendrons, nous commencerons à regarder ces choses en morceaux. 12. Comprendre les dispositions d'authentiques provisions: Bon, bienvenue les gars. Dans cette leçon, nous voulons en quelque sorte comprendre toutes les dispositions d'authentification qui nous sont offertes à travers cet ensemble bootstrapped incluent l'authentification, la création de projet juste là quelques parties mobiles que si vous ne pas tout à fait comprendre ce que vous regardez peut sembler écrasant, Ou vous pourriez probablement simplement les ignorer et tout fonctionne. Mais c'est toujours bon quand vous travaillez sur un projet et vous aurez une pleine appréciation de la façon dont tout se réunit. Donc, je voulais juste vous faire découvrir certaines bibliothèques et les fonctions qui ont été incluses dans le projet depuis le début pour vous donner une idée, ce qui est là et ce qui est sorti de la boîte. Donc, je vais commencer dans ce fichier de démarrage pour notre projet de serveur. Et nous avons déjà vécu ça avant, mais je voulais prendre mon temps et souligner certaines choses à nouveau. Personne que nous ajoutons au service, bootstrapper services dot identité par défaut. Donc ça est sorti de la boîte, bien sûr. Et ce que cela fait, il dit que je veux ajouter une bibliothèque d'identité à mon application en utilisant le modèle qui est indiqué ici. Donc, par défaut, nous avons l'identité utilisateur. C' est notre modèle par défaut qui nous est donné par Microsoft dot ASP.Net identité de base. C' est donc un utilisateur par défaut qu'une fois que vous avez inclus l'authentification, vous avez accès à cet utilisateur. Cependant, que les utilisateurs en quelque sorte limité en termes de champs qu'il, il permet. Parce que parfois, vous savez, utilisateur loin de s'inscrire sur votre site Web. Tu veux le prénom, le nom, tu veux d'autres choses. Donc, ce qu'ils ont fait était de créer un bit de classe personnalisé basé sur les utilisations d'identité. Donc, il hérite de tous les champs de l'utilisateur d'identité. Et puis vous pouvez étendre ce verre et vous pouvez mettre dans le prénom, nom, date de naissance, ou les choses que l'utilisateur d'identité hors de la boîte n'a tout simplement pas eu. Quand nous avons scufflé base de données, vous voyez comment exactement ce qui est généré en fonction de cet héritage direct. Et puis nous verrons comment nous pouvons l'étendre par la suite. Donc, nous ajoutons une valeur par défaut et une entité sous la forme d'utilisateur d'application et disons simplement, vous savez, vous pouvez avoir plusieurs types d'utilisateurs. Donc, l'application utilise la valeur par défaut qu'ils nous ont donnée. On peut créer des bascules si on veut, je n'irai pas là-bas, n'est-ce pas ? Et bien que, et puis nous avons l'option. Donc, ici, nous pouvons pointer ou quel type d'options d'authentification cet utilisateur devrait respecter. Doivent-ils confirmer leurs cônes lors de l'inscription ? Droit ? Donc, en d'autres termes, nous devons charger jusqu'à mettre en place un mécanisme d'email, vous savez, comme lorsque vous vous inscrivez sur votre site Web et qu'ils l'envoient pour confirmer votre comptable et confirmer et ensuite vous pouvez dire et c'est ce que cet opsin fondamentalement dit. Tu veux faire respecter ça ? Donc je vais mettre ça les chutes au moins va Farnell ou ils ne sont pas prêts à aller dans n'importe quel e-mail pour l'instant. Donc je vais dire faux, ce qui signifie que vous pouvez poncer en rouge Nandan, désolé, il peut envoyer ou s'inscrire à null et puis il peut se connecter immédiatement après. Donc, c'est ce que cette option, peu près ceux et en fait cette section d'option est en fait facultative. Bon, donc vous n'avez pas à spécifier d'options. Vous pouvez le supprimer si vous le souhaitez. Et vous pouvez ajouter d'autres options si vous le souhaitez. Le CMMI qui tombe bien nul. Et puis nous disons que nous voulons ajouter tout cela aux contextes DB de l'application, qui représente notre connexion à la base de données. Donc, aurait souligné que dit plus tôt où il est à la recherche de la connexion par défaut que nos connexions à la base de données. Plus tard, cependant, nous obtiendrons toutes ces configurations dans, dans nos doigts et les comprendrons mieux. Ensuite, nous avons des services que le serveur d'identité, non, serveur d'identité est en fait un ensemble de bibliothèques qui, vous savez, il est utilisé pour contrôler l'accès pour les applications modernes. Et il inclut différentes fonctionnalités telles que la gestion des identités d'authentification unique, l'autorisation, l'API, la sécurité, toutes sortes de choses merveilleuses. Et il est basé sur la norme Open Auth. Donc, c'est comme au niveau de l'industrie, la norme OpenID. C' est comme une protection de niveau industriel pour votre application. Donc, même sans le noyau d'identité du serveur d'identité, cet ensemble de bibliothèques de base peut fournir beaucoup de fonctions, mais un serveur d'identité étend les capacités. Et il est généralement donné comme une application autonome pour la gestion stricte des identités, non ? Dans cette situation, ils ont inclus ces bibliothèques dans notre blazer et nous pouvons ainsi en récolter tous les avantages. Et plus tard. Eh bien, en plus d'ajouter le serveur d'identité, puis dit où ajouter l'autorisation d'API pour l' utilisateur d'application et cette zone de stockage. Très bien, donc l'autorisation API dirait à peu près qu'elle configure le serveur d'identité pour l'autorisation basée sur l'API, ce qui signifie généralement qu'elle va utiliser le serveur d'identité JWT. D' accord, donc JWT, jetons web JSON, c'est probablement les normes de sécurité les plus élevées que l'API peut avoir en ce moment. Tout ça sort de la boîte. Si vous avez cependant, mon autre cours sur blazer, alors vous verrez où nous construisons l'API nous-mêmes, nous mettons dans notre JWT nous-mêmes et ensuite nous ajoutons pour répondre encore aux dispositions, le JWT dans le côté client. Tout est connecté et branché hors de la boîte pour vous. Lorsque nous construisons notre blazer en utilisant cette section de configuration de modèle de projet, nous voyons que nous avons jusqu'à j'utilise le serveur d'identité, puis utiliser l'authentification et l'autorisation d'utilisation. Donc ces trois intermédiaires soient Skelly, juste un peu mettre la cerise sur le gâteau pour laisser notre application, ou que c'est ce que nous avons l'intention d'avoir. Nous voulons la possibilité de permettre à quelqu'un de se connecter et de s'inscrire, ainsi que la possibilité de restreindre. Toutes ces bibliothèques devraient être relatives aux dispositions qui nous sont données via le serveur d'identité. Une autre partie que je voulais pointer O serait les zones. Nous avons donc examiné ces domaines auparavant. Il n'est pas très détaillé, mais dans cette section, nous avons ces pages et les pages, elles sont vides. Tout ce que nous avons est cette connexion partielle. Cependant, chaque fois que nous exécutons notre application, nous cliquons sur la connexion ou l'enregistrement, nous voyons que le fait passe à une autre section. Reprenons rapidement. Très bien, donc quand je clique sur m'inscrire, puis il passe à l'application serveur sur une page de registre d'initialisme. Si je vais me connecter, il est toujours dans le serveur en me montrant une page de connexion. Cependant, nous avons déjà établi qu'il n'y a pas de pages avec ces noms sont des adresses dans notre application serveur parce que bien, nous n'avons pas de pages. Nous avons seulement ce contrôleur ici qui fait la configuration DC d'huile. Et bien, nous n'avons pas Pj est nommé registre et login. Donc, ce qui aurait à faire si vous vouliez obtenir ces pages et par extension sur personnaliser leur look et feel parce qu'il peut voir qu'ils ne ressemblent pas au site Web. Ils n'ont pas l'impression qu'ils font partie de notre application Web. Ce que nous pouvons faire ici est de cliquer avec le bouton droit sur les zones aller à Ajouter, puis nous verrons un nouvel élément échafaudé. Ensuite, nous descendons à l'identité, puis nous pouvons aller de l'avant et cliquer sur ajouter. Et puis il va faire un peu de travail en arrière-plan. Et puis ça va nous permettre de décider quels dossiers nous voulons faire échafaudage dans nos projets. Donc, je peux dire override off, ce qui signifie qu'il va juste nous matérialiser tous et les ajouter à toute cette structure de dossiers. Je peux être très sélectif et dire que je veux seulement les Leodes, je veux seulement peut-être le registre et la connexion et tout le reste peut aller bien. Donc je vais juste dire remplacer tous les fichiers, pas de mal dans ce droit ? Après les contextes de données, la majorité peut établir le contexte DB de l'application. Et puis je peux dire ajouter. Et après ça, nous verrons que nous avons maintenant un nouveau dossier et quelques nouveaux fichiers, non ? Et si je regarde dans un cône, je vais voir tout le jeûne. Vous devez donc vous inscrire et vous connecter. Et puis, eh bien, j'ai la coordonnée, je peux les modifier et les faire ressembler à une partie de ma barre d'application. Et ceux-ci prennent vieux certaines des choses qui le font, ça leur donne l'impression qu'ils sont hors de l'ensemble des enfants de la tendance optimale à construire. D' accord. Nous pouvons également modifier leur Laozi en créant notre propre Leo pij. Eh bien, il dit que le chemin léo déchirure dans le début de la vue est des pages barre oblique partagée slash layout.css. Et si vous regardez dans les pages, puis barre oblique partagée, nous ne voyons pas un HTML layout.css, donc nous pourrions créer notre propre petite hauteur, puis remplacer cela si nécessaire. Mais le fait est que toutes ces choses ici et personnalisable. Donc, si vous avez déjà travaillé avec le noyau d'identité dans les IRA MVC sont des pages, alors cela ne devrait pas être trop étranger pour vous. Tu devrais te sentir comme chez toi. Si c'est votre première fois, alors c'est exactement comme ça que vous pouvez commencer à personnaliser votre inscription, votre page de connexion, et tout ce qui est dans n'importe quelle application principale dominante. Ce n'est pas limité au rasoir. D'accord. Ou bien, Blaser Autre, ce n'est pas limité à blazer. Et je voulais passer des choses visuelles et parler plus la base de données parce que j'ai dit que cela aurait été le point central de toute cette discussion. Alors passons aux données. Et dans les données, nous voyons que nous avons deux bibliothèques à des dossiers, non ? Ou un dossier et un en-tête de fichier. Nous avons le dossier Migrations avec deux fichiers dedans. Et puis nous avons le contexte DB de l'application. Donc, quand nous cliquons sur les contextes DB d'application, nous voyons ici qu'il est le contexte DB d'application juste coincé classe. Il hérite du contexte DB d'autorisation API, qui est des contextes ou le chargement des utilisateurs de l'application. Donc, ce sont encore une fois des bibliothèques intégrées et même celles qui survolent l'autorisation de l'API, vous verrez qu'il s'agit d'une obstruction de base de données pour le contexte DB combiné utilisant le serveur d'identité et d'identité. D' accord, donc j'ai vu le contexte DB d'identité utilisé ici pour la, pour la classe héritante. J' ai vu le contexte DB utilisé ici. Mais alors parce que nous avons dit que nous voulions une autorisation API, n'est-ce pas ? Rappelez-vous que nous avons dit ici, ajouter l'autorisation API, n'est-ce pas ? Donc, nous avons le contexte DB d'autorisation API utilisé pour faciliter cela. Donc, nous envoyons des fonctionnalités globales de cette bibliothèque à nos contextes DB, nos contextes DB d'application incarnent toutes les fonctionnalités ici et tout ce que nous allons mettre dans. D' accord. Ici, nous avons un constructeur où nous permet de passer dans certaines options. Et vous vous rendez compte que beaucoup de choses sont très personnalisables et il vient à cela et ils nous donnent beaucoup d'options hors de la boîte. Donc la personnalisation, peut-être limitée à seulement Watson sorti de la boîte et peut-être des modifications mineures en fonction de nos besoins personnels. C' est donc notre fichier de contexte DB d'application. Si nous revenons un peu en arrière et que nous allons aux migrations, ce que vous voyez ici est la première migration permettant la création du schéma d'identité. Donc, tous difficiles la boîte, ils nous donnent ce que nous avons besoin de créer, toutes les tables liées à l'identité ou quand ils ont dit des tables liées à l'entité des rôles réseau SBI. Il s'agit de la table des rôles pour stocker les rôles et application dans tous les administrateurs, utilisateurs, etc. Nous avons également un tour sur les utilisateurs et les utilisateurs SBI net va être généré fonction des champs par défaut que j'ai mentionnés calme avec l'utilisateur d'identité, n'est-ce pas ? Alors rappelez-vous que nous voulons aller à l'utilisateur de l'application. On dit utilisateur d'identité. Si j'essayais d'examiner la définition de cela, alors laissez-moi voir. Expose ça. Eh bien, ils n' exposent pas vraiment les champs qui sont là et ce n'est pas un problème. Mais l'utilisateur d'identité va automatiquement incarner ID, nom d'utilisateur, e-mail, e-mail, confirmation mot de passe, hachage, tous ces champs. Donc, quand j'ai dit que nous pourrions avoir besoin d'étendre ces champs en ajoutant à l'utilisateur de l'application. C' est ce que je voulais dire. Peut-être que nous voulons FirstName, LastName et d'autres choses comme champs dans cette table de base de données. Donc plus tard, nous verrons à les prolonger. Mais Farnell, ceci, cette migration nous permet de créer toutes les tables par défaut et ensuite nous pouvons étendre. Vous voyez ici nous avons des écoles d'appareils. Ceci provient du serveur d'identité, car si vous utilisez le noyau d'identité, vous n'auriez pas vu cette bibliothèque. Vous ne verrez pas que les subventions persistantes sont réglées nettoie. Sbi, net User Claims, login utilisateur, toutes ces choses. Nous sortons de la boîte avec notre bibliothèque de base d'identité. D' accord ? Donc, ce que nous allons faire maintenant est en fait échafaudage cette base de données fait jusqu'à présent notre regard sur ce code, nous n'avons aucune preuve tangible de quoi que ce soit. Si nous avons essayé de nous connecter, à droite, normalement échouerait comme presque alpha. Essayons de se connecter car nous voyons qu'il va à la page de connexion. Voyons ce qui se passe quand tu essaies de le faire. Bon, donc je vais essayer de m'inscrire, et voyons ce qui se passe. Très bien, donc maintenant il est dit que j'ai échoué l'opération de base de données en essayant de traiter cette requête. Et puis il a dit qu'il ne peut pas ouvrir cette base de données et toutes sortes de choses qui nous envoient que nous devons appliquer la migration, c'est le même fichier que nous regardons, appliquer la migration et exécuter les commandes, et ensuite nous pouvons suivre à nouveau. Alors allons de l'avant et configurez ce que nous devons mettre en place pour que nous puissions commencer à créer ces tables dans notre base de données. Donc, dans l'OB settings.js sur elle a dit qu'il ne pouvait pas trouver un téléphone de base de données que x-y-z. Donc, il était en déduire que la base de données sera découvert l'adresse que nous avons décrite dans notre application settings.js fichier IN. D' accord, donc nous avons le serveur étant une base de données locale, qui est le serveur que j'ai fourni avec Visual Studio. Il est très attaché à Visual Studio. Nous n'avons pas besoin d'aller dans Management Studio pour ça. Toutefois, si vous souhaitez utiliser un autre serveur de base de données, comme vous avez peut-être une instance de développeur ou une instance SQL Express. Vous avez juste besoin de changer le nom du serveur juste là, n'est-ce pas ? Donc, vous pouvez le faire hôte local, vous pouvez le faire point SQL Express, peu importe ce qu'il est. Vous pouvez aller de l'avant et changer ça. Et je vais laisser ça fait la base de données locale parce que, vous savez, à des fins de développement, je le veux ici dans Visual Studio. Et je vais changer le nom de la base de données. Donc, il s'agit d'un nom par défaut, est tourner il tiret, tableau du serveur de point de gestion actuel, et une bonne valeur. Je n'ai pas besoin de tout ça. Quelqu' un va appeler ça un courant sur la base de données de soulignement de la gestion. Donc je vais enlever toutes ces choses et y arriver. D'accord. On y va. Donc, après avoir nettoyé mon application settings.js, fichier JSON, null Lionel où null, je vois que si cette base de données n'existe pas déjà, c'est celui que je veux créer. Donc, et il a dit ajouter la migration ou appliquer migration plutôt en exécutant la base de données de mise à jour. Ce qu'il voyait, c'est que quand je dis mise à jour de la base de données, il va créer la base de données si elle n'existe pas déjà, puis créer les tables de support en fonction de ce fichier de migration. Si vous faites attention à ce fichier de migration, vous remarquerez que c'est vraiment comme une traduction C-Sharp de ce qui va se passer dans SQL, n'est-ce pas ? Id, table, colonne, chaîne. Le type va être invité charge. Donc, si vous connaissez les bases de données, alors vous commencez à voir que c'est vraiment juste C-Sharp. Nous dire ce que la suite va être entendue. Ce n'est pas trop compliqué, ce n'est même pas que trouve C, Pour être honnête, il y a juste un constructeur. Et à la fin de construire tout ce qui ne devrait pas arriver, ça va juste s'exécuter, non ? Ça va juste créer. Voyons donc comment nous créons la base de données. Je vais donc aller à la console Package Manager. Si vous n'avez pas de déchirure dans votre Visual Studio, alors il peut toujours aller aux outils et au nouveau gestionnaire de paquets get et vous verrez la console Package Manager afin que vous puissiez toujours l'afficher comme ça. Et puis nous allons dire mise à jour base de données de tiret. Après avoir exécuté cette commande va construire un projet, puis laissez-nous savoir quand il est fait. Non, c'était très rapide. Il a commencé à construire, il a été réussi et puis il dit fait. Rien de visiblement. n'y a pas de différence, non ? Je ne vois pas que quelque chose s'est passé sur de nouveaux fichiers ont été ajoutés au projet, mais regardons la base de données. Donc, je vais faire apparaître l'Explorateur d'objets MySQL Server. Si vous ne voyez pas cela, vous allez simplement à View et vous verrez SQL Server Object Explorer. Vous pouvez donc simplement faire apparaître cela et regarder les bases de données DB locales. Et vous voyez que j'ai pas mal de bases de données, y compris ma base de données de gestion actuelle, qui est celle que nous venons de créer. Et si je développe cela et regarde dans les tables, alors je vais voir toutes les tables qui ont été décrites dans ce fichier qui est affiché à ma droite. Nous avons donc la table des rôles, nous avons la table des utilisateurs. Toutes ces tables sont là et disponibles pour notre utilisation. Très bien, donc il y a deux parties à quand nous voulons mettre à jour la base de données, où vous avez la migration, qui est ce genre de fichier C. Et ce sont les changements à l'atomique MBL. Bon, donc il garde une trace de chaque fois qu'on change la base de données, c'est comme en garder une trace. Donc, si vous êtes un développeur de base de données et traditionnellement vous avez construit la base de données, mais quand l'application est en cours de construction pour apporter des modifications, il est un peu plus difficile de camionner que vous modifiez cette colonne pour cela et c'est plus d'argent. Eh bien, quand nous faisons des migrations dans l'accord première séance, cela nous permet de voir qu'à ce stade c'était ce qui était en place. Le point suivant, c'est ce que les changements ont été apportés et cela nous aide à garder une trace. Alors faisons quelques changements. Et le changement que je vais faire est juste l'utilisateur de l'application, n'est-ce pas ? Nous avons dit que nous voulions l'étendre. Donc, je vais juste dire que je veux ajouter String prénom. Et je vais ajouter un nom de chaîne. D' accord, donc ce sont les deux choses que je veux ajouter. Et une fois de plus, vous n'êtes pas limité à regarder. Vous ne pouvez pas, vous ne pouvez pas date de naissance, il ne peut pas traiter ce dont vous avez besoin sur un utilisateur d'application, vous agonie, mais pas l'autonomie et les modifications de ce fichier. Et ce fichier est directement lié à mon contexte DB d'application, n'est-ce pas ? Ensuite, il va se rendre compte que la version qui était, qui existait et qui a créé une base de données la dernière fois n'est pas différente de ce que j'ai appliqué. Donc non, j'ai besoin qu'ils sachent que je génère un fichier de migration. Je peux dire ajouter une migration de trait d'union. Et puis je peux voir le nom ajouté à l'utilisateur. Quelque chose nous conduit quelque chose qui indique les changements qui ont été faits. Et puis je vais juste de l'avant et appuyez sur entrer une loi qui pour construire. Et puis il va créer un fichier de migration. Donc maintenant, si vous regardez dans les migrations, vous verrez qu'il y a un autre fichier même horodaté. Donc celui-ci est mis à zéro parce qu'il a grandi 0 littéralement, n'est-ce pas ? Celui-ci n'est cependant pas sur les horodatages à dire à ce stade de ce jour, vous avez fait cette migration avec le nom que vous lui avez donné. Et puis si nous regardons les fichiers, vous verrez qu'il va juste dire ajouter une colonne FirstName. Donc, la table est chez les utilisateurs. C' est le type et c'est nullable. Tu vois, c'est tout ce qu'il fait. D' accord ? Et puis vous allez voir que vous avez ou ne fonctionnez pas. Donc celui-ci est parce que le changement est plus petit, il semble beaucoup plus facile de lire et de comprendre ce qu'il fait. Et encore une fois, c'est vraiment juste du « C sharp ». Danny était qu'est-ce qu'un bateau dans, dans, en SQL ? Et le Ne voyez-vous pas en cela, devrais-je inverser la migration sont inverser les changements, alors c'est ce qu'il devrait faire, déposez la colonne et déposez cela. Donc nous avons l'OP qui dit ce que nous sommes sur le point de faire et ils ne voient pas ce qui devrait être brûlé, devrions-nous changer d'avis ? Très bien, remarquez que nous avons la Migration. On a juste une base de données. Après la migration, nous exécutons une base de données de mise à jour et la base de données existe déjà. Donc ça va littéralement faire sur l'obésité. S' il n'existait pas, le premier, alors il a créé et mis à jour. Donc, si je regarde en arrière la base de données et regarde ma table des utilisateurs réseau ASP et regarde les colonnes. Ensuite, nous allons voir que nous avons prénom et nom de famille. Donc, je ne vous ai vraiment pas montré qu'il n'y avait pas eu de près avant, mais sur la base de la migration initiale, first_name et last_name n'étaient pas là. Nous venons de les ajouter à l'utilisateur de l'application et savons qu'ils sont là. Très bien, c'est donc une belle introduction rapide à façon dont nous faisons les migrations et comment nous allons configurer votre identité et nous assurer que nous avons informations adéquates sur nos utilisateurs lorsque nous sommes sur le point de construire nos applications. En ce moment, je vais faire notre inscription à nouveau et voir, voir si nous pouvons passer. Donc, le mot à la mode que j'utilise est un mot de passe dehors d'un parce qu'ils sont très stricts à la politique de l'analyseur phi, disons négliger celui qui, eh bien, d'abord, si je ne les rencontre pas beaucoup, Vous voyez que c'est qu'il envoie moi tant que ça. Et si je néglige celle, ça me dit que c'est trop faible, non ? Donc, hors de la boîte, vous avez une politique de mot de passe assez forte que vous pouvez augmenter la force d'une fois de plus à travers les options. Mais je pense que c'est assez compliqué pour moi, non ? Et aussi son mot de passe, mot de passe avec un AdSense et numéro un à la fin, nous cliquons sur Enregistrer et voir ce qui se passe. Donc on va beaucoup plus loin que la dernière fois. Et regarde ça. Laissez juste cela en exécutant deux commandes. Je n'avais même pas besoin d'ajouter le prénom et le nom pour faire fonctionner ce truc parce qu'il travaillait il y a longtemps. Et je vais juste enregistrer ceci dans mon navigateur. Eh bien, tu vois ici nous, ça nous dit bonjour, non ? Rappelez-vous quand nous avons personnalisé notre écran de connexion pour déplacer ces boutons de navigation pour qu'ils le sachent en disant bonjour, la personne s' est connectée, non ? Ça me permet de me déconnecter. Et puis je pense que si je clique dessus, il fera apparaître profil, droit, authentification et profil barre oblique. Ok, donc ça revient au serveur, au gestionnaire d'identité. Désolé, serveur d'identité gérer puis indexer les écritures. On y va. Donc c'est ce que nous regardons en ce moment. D' accord, alors quand on scuffle les pages n'ont nulle part accès à toutes ces pages, c'est qu'on peut personnaliser, regarder et décharger un champ, non ? Donc en ce moment il montre le profil avec le nom d'utilisateur et le numéro de téléphone est le nom d'utilisateur, numéro de téléphone, encore une fois, James, un numéro de téléphone c. Donc nous pouvons donner toutes ces choses hors de la boîte avec très peu de personnalisations, avec très peu d'efforts, avec très peu d'efforts de notre part, nous pouvons faire fonctionner notre système de connexion et d'enregistrement dans notre application blazer. Encore une fois, continuez à modifier ceci. On dirait qu'on ne va pas entrer et sortir de l'application. Mais la réalité est que le serveur d'identité est vraiment comme une application autonome. Donc, tu sais, c'est, ça va dans les deux sens. Cela dépend de ce dont vous avez besoin sont même si vous voulez donner à l'utilisateur l'accès à toutes ces choses, parce que vous pourriez ne pas vouloir leur donner accès à changer leur numéro de téléphone et leur adresse e-mail à volonté et ainsi de suite. Vous voudrez peut-être contrôler tout ça pour vous-même. C' est donc une bonne introduction rapide à l'ensemble du serveur d'identité. Et whoa, l'identité fonctionne dans une application blazer. J' espère que vous le comprenez un peu mieux et que nulle part vont passer à la création de nos tables de base de données pour prendre en charge le reste des fonctionnalités de notre application. 13. Créer une base de données avec Entity Framework Core: Hé les gars, bienvenue. Donc, dans cette leçon, nous allons commencer à créer la base de données avec les tables de support pour nos applications de gestion actuelles en ce moment tout ce que nous avons déjà nos tables de support utilisateur pour la connexion pour le nettoyage par camion, tous ces choses merveilleuses ou pour les avoir. Et on a déjà discuté de la façon dont on les a entrés. Non, nous voulons créer nos propres tables à ajouter à la base de données ultérieurement. Donc, j'ai à l'écran ici diagramme de relation Nieto, un diagramme de relation d'entité. Vous savez, il porte beaucoup de noms, mais ce diagramme montre les tables de base de données et qui a des relations avec le travers. D' accord. Donc, ce que nous pouvons voir ici, c'est que nous avons déjà, nous connaissons déjà certaines de ces tables qui savent déjà que nous avons les écoles de périphériques persistent motifs toutes ces tables ASP net liées à l'utilisateur que nous connaissons déjà parce que Ils ont tous été échafaudés pour nous par le biais des services d'identité, n'est-ce pas ? À droite, cependant, nous avons d'autres tables que nous allons créer ce point. Donc nous avons des couleurs. Et je commence juste avec ceux qui n'ont pas de clés étrangères ou pas de dépendances. Donc nous avons des couleurs, nous avons des modèles, nous avons des micros, non ? Parce que c'est une voiture dans le système de gestion. Lorsque nous ajoutons un véhicule, nous voulons nous assurer de capturer la couleur qu'il est. Une modalité est ce qui en fait. Et dans le bruit du véhicule lié à tous ces coûts va avoir le modèle de marque et l'identifiant de l'appelant. Laisse-moi zoomer un peu au cas où c'est un peu petit, non ? Donc nous avons le Vin et nous avons d'autres champs que nous voulons capturer toute la voiture. Nous allons avoir des réservations pour que nous puissions suivre qui quand il a été loué par qui. Et il a fait en effet vieux et puis calculer le coût, toutes ces choses merveilleuses, mais ont les clients et les informations de base sur les clients et ainsi de suite afin que les clients ne seront pas les utilisateurs, ce qui est où nous avons un table de client différente d'une table d'utilisateurs. Si nous faisions en sorte que les clients puissent connecter et accéder au système et faire ce qu'ils voulaient faire, alors nous n'aurions pas à créer un client pourrait encore utiliser la table ASP net users étendue pour un type d'opération client. Et puis nous pourrions juste utiliser le pour stocker tout demeure des clients. Une fois de plus, le contexte est tout. façon dont vous concevez vos tables, sorte que vous concevez votre application sur toutes ces choses sont régies par les objectifs de l'une ou l'autre année sont les objectifs de l'entreprise pour laquelle ce système est conçu. Donc, ce que nous voulons faire maintenant, c'est commencer à créer ces tables. Nous avons donc 1236 tables que nous devons créer. Allons-y. Non, en ce qui concerne la mise en page de votre projet , l'architecture globale et ainsi de suite, ce jury, Zoltan, où est le meilleur endroit pour créer vos tables ou créer vos fichiers de classe qui deviendront ensuite des tables. Ce que je veux dire, c'est que nous avons déjà des projets clients où vous avez un projet de serveur. Cependant, le projet partagé, qui sert à avoir des fichiers de classe, sont toutes les ressources qui seraient partagées entre les deux en fonction du modèle que vous allez utiliser. Vous pouvez placer vos classes de données dans un dossier partagé, car vous ne voulez pas les faire dupliquer. Vous ne voulez pas avoir une version de ceux-ci dans le projet serveur, une version de ceux-ci dans un client. Vous venez de les mettre en commun sur les deux projets peuvent y accéder, ce qui est ce que nous allons faire savoir. Eh bien, je vous donne juste un contexte juste au cas où vous tricotez votre sourcil pourrait déjà avoir une autre idée qui n'est pas un problème. Dans d'autres situations, les gens rendent les couches d'accès aux données où ils créent les classes de domaine différentes, n'est-ce pas ? Ils signifieront, ce qui signifie les classes qui deviennent ensuite les tables. Ils créent un autre projet pour eux. Et puis ils obstruent le chaos de domaine est à partir des classes clientes, ce qui signifie que le serveur et la base de données liées opérationnel. Encore une fois, voir les classes de données dans le client utilise une version différente d'entre eux à des fins client. Et c'est ce que nous allons commencer à regarder ce modèle appelé comme MVVM, méfiez-vous des modèles de vue ou de l'API comme je les appelle détails. Donc plus tard, nous allons entrer dans les modèles. Je n'ai rien contre les boutons. J' adore les modèles et je vois où ils sont bons. Mais pour l'instant, nous voulons juste faire les bases pour le faire fonctionner. Parce que peut-être ceux voulaient construire une application qui peut parler à la base de données bleue à partir de la base de données et avoir l'air assez droit. Donc, parfois, vous n'avez pas besoin d'aller à ce niveau d'obstruction, mais alors les abstractions aident quand vous avez besoin de mettre à l'échelle l'application. Je mets plus de fonctionnalités sur plus de tables et ainsi de suite. Et vous avez moins de protéases vous Après l'entretien de Guandu, c'est un auto patrons violets. D' accord ? Donc rétinienne, ce que nous allons faire est de créer un dossier dans ce partagé. Et je vais appeler ce dossier, appelons-le juste domaine. D' accord ? Donc domaine va avoir toutes nos classes de domaine. Donc, vous pouvez voir ici avec une prévision est déjà assuré. Mais pourquoi est-il assuré ? Parce que notre contrôleur ici, prévisions météorologiques sont quand utiliser ce fichier. On y va, prévisions météo. Et dans tous nos clients ont dit que si nous regardons les données récupérées, ils savaient qu'il utilise aussi les prévisions météorologiques. C' est donc le but de le mettre en commun afin que ces deux projets puissent y avoir accès. Donc, non, nous ne allons pas mettre dans cette abstraction entre les classes de domaine pour les opérations de base de données sur pour le client. Je vais juste utiliser les mêmes fichiers de classe pour une sorte de trou d'affichage à un week-end de niveau de base faciliter la conversation avec les données. Donc on va commencer par les tables simples, non ? Donc ne veux pas dire nouvelle classe. Et l'une des tables les plus simples était moi. Très bien, donc notre table micro, et je vais rendre ce public pour que tout le monde puisse y accéder. Classe publique mc, nous pouvons ajouter, et voici juste une baignoire d'hélice deux fois et puis il génère ce verrou. Donc string et écrit moi serait comme Toyota Honda. Tu sais, c'est la marque. Donc, ils peuvent appeler ça la marque si vous voulez. C' est très bien. Nous avions aussi ce que nous appellerons des champs d'audit. Rouge, parce que bien sûr, nous avons besoin d'un champ ID comme jamais la table devrait avoir. Nous voulons également sentir que dire la date créée et mise à jour. Eh bien, le truc avec ces trois champs serait que ces trois champs se répètent sur toutes les tables, non ? Donc, chaque table va avoir un ID et nous voulons avoir la date créée et les actes mis à jour. Et nous pourrions même pousser l'enveloppe pour voir créé par une mise à jour par. Alors faisons ça aussi. Pour que nous sachions qui a regardé cordage créé par et mis à jour par. Ce seraient des ficelles. Parce qu'alors nous voulons stocker le nom d'utilisateur de la personne qui a effectué l'opération sur Terre. Donc chaîne mise à jour par chaîne créée par la date de création de D, le titre peint en rouge. Mais une fois de plus, ces champs vont se répéter sur toutes les tables parce que c'est moi quand je fais le modèle et est sorti ces frais à nouveau. Donc, ce que je vais faire est de créer comme un modèle de base, essentiellement une tomate. Donc, je vais juste créer une autre classe et je voulais l'appeler données de base, modèle de domaine Barbies. Laissez-moi l'appeler modèle de domaine. Ça n'a pas vraiment d'importance, mais le fait est que je voulais être une base, non ? Je ne veux pas le rendre public, abstrait, pas abstrait. Cela signifie que je ne peux pas instancier cette classe tout seul, non ? Mais alors cette classe abstraite va avoir dans ces domaines. Donc, je vais me retirer une pièce d'identité, mettre dans cette classe abstraite. Je vais également prendre créé par périodes de date dans tous ces champs d'audit. Et je vais les mettre à l'intérieur de cette classe de domaine abstraite. Et ce que je peux faire, c'est juste hériter. Bon, donc la classe publique fait côlon B Islam dans les mannequins. Donc, aucun micro n'aura vraiment n'importe quel champ là aussi bien que le, donc c'est le même principe comme ce que nous venons d'examiner avec notre identité utilisateur par rapport à l'application. L' application utilisateur utilise l'héritage de la classe de base ajouter l'utilisateur d'entité, puis nous pouvons l'étendre comme nous en avons besoin. Alors voici l'extension pour moi, non ? Alors tous les autres que nous allons faire peuvent suivre le même principe. Alors faites le modèle. Encore une fois publique. Il va hériter du modèle de domaine de base. Donc, le bouton indique les champs d'audit et ensuite je vais mettre le nom. Maintenant, la raison pour laquelle je n'ai pas mis de nom dans la base est que tous les conseils ne sont pas des noms. Je ne veux pas mettre quelque chose à l'intérieur la bête que toutes les tables ne vont pas être concentrées, n'est-ce pas ? Donc, alors qu'il peut sembler stupide d'avoir la marque et le modèle, fois avoir le nom et puis un autre va avoir le nom sous la forme de couleurs, de couleur, de couleur. Et nous allons aussi lui donner le nom du champ. Nous allons le faire hériter modèle de domaine basé sur. Et bien sûr, vous devez le rendre public. D' accord, mais c'est tout pour le nom 11-cis. Donc je vais maintenant porter près de lui. Alors entrons dans des tables plus compliquées. Et je vois toujours même, même en développant du code d'abord, les bases de données commencent toujours par les tables que baignoire et toutes les clés étrangères ne sont pas des dépendances. Parce que quand vous arrivez à la dépendance est les données dépendantes ou les données qui dépendent plutôt est déjà là, non ? Donc si nous voulions faire le véhicule ensuite, ce que nous faisons au domaine Gosse. Et puis le véhicule est le nom de celui-ci. Même traitement, héritage public de notre modèle de domaine de base. D' accord ? Et puis ce que nous voulons dans l'ensemble du véhicule serait l'ID du module de l'année, puis le champ virtuel pour le modèle, n'est-ce pas ? Donc ça représente notre, notre clé étrangère juste ici. D' accord, alors quoi, donc cela, ça va automatiquement dire, eh bien, je sais qu'il y a une table ou une classe de données correspondante, une classe domaine appelée modèle. Je sais qu'il a un champ ID, donc les ID du modèle vont automatiquement dans la mappage au champ ID dans la classe correspondante appelée modèle. Très bien, donc Entity Framework va le faire automatiquement pour vous. Si, si une base de données de construction normale en utilisant SQL server, vous savez que vous devez aller et dire manuellement, c' est notre relation avec cette Entity Framework a été généré avec infer cette relation pour vous. Et puis en incluant ce champ, qui est le modèle de type, et nous l'appelons simplement module. Mais ce nœud lui permet d'impliquer qu'une jointure interne peut être nécessaire. Donc, sans écrire tout le code pour une jointure interne, vous apporteriez automatiquement les données connexes pour nous. Donc, nous stockons l'ID, quel que soit le nom que nous pouvons accéder et qui l'a créé sur n'importe quel autre détail dont nous avons besoin. Nous pouvons devenir virtuels parce que le virtuel et la musique peuvent être remplacées si nous le voulions. Qu' est-ce que c'est bien. Nous pouvons Vous n'avez pas forcément à le rendre virtuel. Je suis l'hiver inclus cependant. Donc, nous avons une identification publique, int public, faire une identification avec les mêmes traitements. Nous avons la couleur avec l'ID couleur, le même traitement, le même principe. Et puis nous avons le Vin, le numéro de la plaque d'immatriculation, et ensuite nous avons la réservation. Voici donc un exemple parfait de la raison pour laquelle nous devrions créer la table requise en fonction d'abord. Donc, le véhicule a besoin de la table de réservation parce qu'il a une dépendance là-bas ou il y a une relation lointaine entre eux, sauf celui-ci. Vous ne remarquez pas qu'il n'a pas cet ID et cet appairage d'objet. Et ça devrait vérifier mon travail. Cela devrait en fait être une liste de recherche représentant les enregistrements de location. droite. Ainsi, un véhicule peut être sur plusieurs réservations. Laisse-moi changer ça de tous nos gains de symbole d'accord. Donc, c'est plus clair. D' accord, donc ce serait une liste de réservations pour n'importe quel véhicule. peu près ce que ça veut dire. qui signifie que lorsque nous créons une classe de réservation, et je peux juste pointer dessus et dire générer une réservation dans un nouveau fichier, classe générique dans un nouveau fichier. C créé réservation pour la réservation de classe publique américaine hérite du modèle de domaine obèse. Et puis la réservation va avoir une relation avec un véhicule, n'est-ce pas ? Donc pour ceux qui réservent, tu auras un véhicule, non ? Donc, nous allons avoir la date dedans alt, pas vrai. Donc u virgule u faire une réservation. À quelle heure ? Je voudrais juste aller de l'avant et inclure toutes les bibliothèques manquantes là-bas. Nous avons le client. Alors quel client ? Nous devons donc créer une table de clients, une fois de plus, la dépendance. Et puis nous avons les tarifs. D' accord, eh bien, je pense qu'en fait, non, c'est que je regarde mon design original. Je pense que le taux devrait probablement être sur le véhicule parce qu'en général, les réalités sur le véhicule, et aussi longtemps que vous prenez le véhicule, c'est combien d'argent sur la pièce. Donc, je vais mettre là en salaire ici. Donc je vais mettre sur un nouveau champ à l'intérieur du véhicule appelé Bilbo ou dans tolérer. D' accord, alors quand on aura mis le V pourrait dans le système, on va dire que ce véhicule sera comme 2 000$ sur oh, désolé. En Jamaïque point point serait les grades généraux 2000 lois sur tous nos droits sont doubles et Dasa D, puisque nous traitons de réservations, le vieux inondé. Donc, par jour ou par nuit, vous avez le véhicule. C' est un peu GOP. Et puis nous pouvons toujours calculer en fonction de ce qui est ici. Donc c'est tout pour la réservation. Mais bien sûr, nous avons toujours besoin de client pour faire la même chose. On génère juste les quatre clients, non ? C' est un OAEP ou un client. Et puis nous avons vu que nous héritons du modèle de domaine de base. Et puis nos champs ici seraient l'adresse d'idée de tucks, adresse e-mail et le numéro de contact. Et puis, bien sûr, nous allons vouloir nous assurer que nous avons une représentation pour la relation. Donc, le fait est que c'est comme une relation bidirectionnelle, c'est vraiment une relation bidirectionnelle où il s'agit juste de s'assurer que ces deux entités liées se connaissent. Donc, c'est une réservation ne peut appartenir qu'à un seul client, mais alors un client peut avoir plusieurs réservations, n'est-ce pas ? Donc oui, la réservation comme une représentation d'un client à la fois, mais alors le client a plusieurs réservations, tout comme nous l'avons vu avec les véhicules. droite. Donc, le même type de liste de réservations que nous avons dans les véhicules que vous devez mettre dans la table des clients et inclure les références manquantes. On y va. Et puis nous pouvons juste faire une construction pour nous assurer que tout va bien. On peut donc faire un projet de loi juste pour s'assurer que tout va bien. D' accord, donc nous avons tous nos fichiers de domaine dans notre projet partagé avec le dossier de domaine, c'est donc l'espace de noms. Sachez, afin d'obtenir notre base de données pour générer la table est qui correspondent à ceux-ci, n'est-ce pas ? Eh bien, nous devons faire est de passer à nos données dans notre projet de serveur, aller dans le contexte de base de données d'application. Et puis on doit les énumérer ici. Donc, pour les énumérer, remarquez pas à l'intérieur du constructeur, c'est notre constructeur. Donc, en dessous du constructeur point, mais dans la classe, nous devons commencer à voir VB public définir le type de données, puis le nom que nous voulons que les tables le hub. Donc remarquez que celui-ci est singulier, l'un est plèvre, non ? La classe, généralement, l'entité est singulière, l'herbe parce que notre classe représente une instance off. Mais alors la table est la collection de ces instances, n'est-ce pas ? Donc, le nom de la table serait véhicules, quelle est la classe dont la table est basée sur le véhicule éventuel. Très bien, donc encore une fois, ceux-ci vont de l'avant et incluent la bibliothèque manquante en utilisant dat actuel. Non, il sait d'où il trouve ces choses. Donc, nous pouvons aller de l'avant et inclure cela. Donc, suivez ce modèle, ensemble DB public, crochet d' angle, le nom de la classe, fermer le crochet angled, le nom de la classe pluralisé, puis obtenez onsets afin qu'il puisse juste aller de l'avant et inclure cela pour tous pour la couleur, MY modèle de réservation client. D' accord ? Donc, une fois que vous avez fait tout cela, l'étape suivante serait de créer une migration parce que null, lorsque nous créerions une migration va regarder contexte DB d'application de sauvegarde. Et remarquez que la dernière migration n'avait pas de neige. C'est là. Il est clair que j'ai des changements à faire. Laisse-moi documenter ces changements, non ? Donc, Package Manager, console, ajouter la migration de trait d'union. Et puis nous allons voir ajoutés, disons des tables d'application. Et puis une fois que nous le faisons, cela va construire. Et puis cela va nous donner nos fichiers de migration montrant une fois de plus, ce qui a fait des sous-balles hoodoo est sur le point de créer une table appelée couleurs. Et les colonnes incluent la colonne ID, qui est int, et il définit automatiquement l'identité. Donc, vous savez que si vous l'avez fait vous-même dans la base de données, vous devrez le définir comme clé primaire identité synthétase. Cela se passe tout seul. Il déduit que la colonne id va être la clé primaire là, elle est, a dit la clé primaire comme la colonne ID, non ? Clients, même traitement. Et puis pour les relations, vous verrez qu'il y a quelques contraintes de clé étrangère ici. Dit une clé étrangère pour les couleurs, couleurs, ID, FK, véhicules. Donc, c'est un véhicule stable et il voit dans la configuration clé étrangère entre la table des véhicules et la table des couleurs, où l'ID de l'appelant relie la colonne ID de la table de l'appelant. Tout cela est mangé FRD pour vous par Entity Framework. D' accord ? Et de la même façon que nous avons le web qui ne porte pas sur le nouveau, nous pouvons juste inverser les changements. Donc, le fait est que chaque fois que vous êtes sur le point d'apporter une modification ou que vous avez apporté une modification à la, que vous ayez ajouté une nouvelle table ou que vous avez ajouté de nouveaux champs ou que vous modifiez les champs. Une fois que vous avez fait ce changement, tout ce qu'ils ont à faire est la migration ADA. Il va passer par et comparer ce qui est nouveau avec ce que null obtient. Et puis il documentera les changements de cette manière. Et puis une fois que vous avez fait cela, vous pouvez dire mise à jour de la base de données. Donc, parfois, vous savez, lorsque vous apportez certaines modifications, cela peut entraîner la perte de données. Comme si vous pouviez changer ce type de données ou supprimer un champ. Il vous avertira. Jusqu' à présent, je n'ai rien fait qui conduirait à la perte de données. Mais jetons un coup d'oeil à ce qui est un auto-généré. Voici donc le couloir de la base de données de gestion actuelle soulevé la dernière fois. Si je me rafraîchis, puis je vais jeter un coup d'oeil à nouveau, alors nous allons voir nos nouvelles tables, nos réservations, nos couleurs, clients, nos modèles, nos véhicules, toutes ces choses. Et à peu près que si nous avons généré un diagramme de ceci, il semblerait sinon juste comme alors très similaire à ce que j'ai affiché au début de cette leçon. Maintenant, nous avons créé nos propres tables en plus de tout le reste. Ensuite, nous voulons voir comment nous introduisons des données dans la base de données. L' ensemencement signifie que nous mettons des exemples de données dans certaines de ces tables. Et puis nous reviendrons, nous allons jeter un oeil à ça. 14. Configure Configure données: Bienvenue les gars. Dans cette leçon, nous allons examiner les données de cession et je vais semer les données a le but essentiel de nous donner quelques exemples de données pour commencer. Vous savez, comme nous voulons nous assurer que je l'utilisateur est toujours dans le B2B est quand l'application commence ou nous voulions nous assurer qu'il y a quelques auto-informations d'enchère de base dans les tableaux. Chaque fois que l'application commence. Quand je parle bulle, quand l'application commence, je veux dire que si nous devons installer ce site différent, nous finissons l'application sur notre machine, mais je devrais la déployer sur un serveur différent. Lorsque nous exécutons l'application pour la première fois et la chargeons, les sièges remplissaient la base de données avec les données de base. Donc ils voulaient juste jeter un oeil à la façon dont cela fonctionne. Tellement calme et les choses qui s'asseyent. Peut-être des règles par défaut. Donc peut-être, j'ai vécu le rôle d'administrateur par rapport au rôle d'utilisateur sur tout ce qui pourrait prédéfini serait peut-être des marques par défaut sur les modèles dans notre situation et nos couleurs. Des choses que vous ne voulez probablement pas nécessairement que les gens aient à se gérer eux-mêmes, ou du moins il voulait donner des données de base une fois de plus. Donc, pour semer certaines données dans notre base de données, ce qu'il faudrait faire est de créer un remplacement pour notre fonction par défaut sur la création du modèle. Donc, une fois que nous avons le contexte DB de l'application et qu'il hérite de n'importe quelle forme de contexte DB. Il va avoir une fonction qui est protégée et nous pouvons la remplacer. Et être appelé vide et voir dans les sens me disent quelle fonction il est que j'essaie de construire, donc sur la création de modèle et il fera tout cela pour vous, pas de problème. Donc quoi que ce soit, vous pouvez le laisser tranquille. Mais en dessous de cette valeur nulle, on peut commencer à voir ce qu'on veut. Donc, je peux dire quelque chose que le point de constructeur a des données. D' accord ? Le point Builder a des données. Je suis désolé, je saute l'arme ici. Apologues entité juste là entité, nos parenthèses et puis nous voyons les entités. Donc, dans ce cas, disons que nous voulions et les couleurs par défaut, commençons par les couleurs. Donc l'entité serait de couleur. D' accord ? Et puis ouvrez et fermez l'accolade. Et puis nous disons point a le, nous y allons. Sauter un peu le pistolet. Ensuite, nous ouvrons et fermons. Eh bien, je vais juste ouvrir et fermer nos parenthèses à l'intérieur, à l'intérieur de ces parenthèses et d'autres cette ligne pour que nous puissions la voir très clairement. Nous avons besoin de nouvelles instances de cette entité que nous sommes sur le point de créer une nouvelle couleur et ensuite nous remplissons les champs, non ? Donc créé par, je vais juste dire système, non ? Parce que ce n'est pas le cas, je l'ai utilisé. C' est le système qui crée littéralement Entrée. Il a créé, je vais le dire date, heure, point null. Donc, chaque fois que c'est le cas, il est créé. C' est le moment et je vais juste me casser. Alors ne t'éloigne pas trop de l'écran. Donc, virgule, le champ suivant sera des données ou des données, qui est également allé à point datetime. Non. Merci. Guan serait son nom. Et je suis allé voir, disons bloc. C' est une couleur de voiture très commune et mis à jour par est égal au système. J' ai donc fait sa façon de grignoter POSIX. Vous pouvez le commander si vous voulez ou quel est le point dans lequel vous voulez les sentir, et cela devrait être entre guillemets sous forme de chaîne. On y va. D' accord, je n'ai pas besoin de mettre l'ID parce que si je ne fournit pas l'ID, alors il lui donnera automatiquement l'ID et tout pour incrémenter avons-nous vu quoi ? Si je mets l'ID, alors il lui donnera la valeur d'ID que je lui ai donnée. Donc si je voulais que celui-là soit Ib 10, alors je pourrais dire que la pièce d'identité est 10. Je ne veux pas ça. Je veux que le système fasse tout ça. Et puis pour chaque couleur que je voulais ajouter, je peux séparer les différents modèles. Donc je viens juste de faire créer celui-ci. Je peux dire une virgule, puis crée un modèle1. Et disons que celui-ci est bleu. Et puis nous pouvons les séparer, continuer et encore et encore. Et puis cette méthode est vraie pour tout ce qui peut être porté pour créer notre graine. Donc, je peux prendre tout ce bloc de code et ensuite répéter cette entité point du constructeur. Et cela dit que je voulais les voir faire ou quelques entités de mélange. Point doux, point, point, point a des données, puis dites simplement nouveau micro, puis remplissez simplement ces modèles en conséquence. Maintenant, comme si je le fais pour chaque table, si, si, si le faire pour les chercheurs de Joe pour monter cet espace de mode, imaginez le faire cinq fois de plus pour plus, potentiellement plus d'enregistrements. Et je n'aime pas ça. Je n'aime pas que mes fichiers ressemblent à des spaghettis, pour être honnête. Donc ce que nous sommes, ce que je vais faire est d' obstruer ça dans une autre fonction, non ? Ou un autre dossier tout à fait. Et je vais créer un dossier ici dans mon projet de serveur et je vais l'appeler Configurations. Donc les configurations New Folder, assurez-vous que je reçois qui tourne autour d'elle. On y va. Et puis encart de Configurations, je vais avoir un dossier mère car les configurations peuvent avoir plusieurs choses. Donc, je vais juste dire des entités. J' aime toujours séparer ces choses en différents fichiers sur la plénitude. Je sais exactement où aller pour trouver des watts. Donc, ces entités null, je peux créer un fichier de configuration par table pour lequel je souhaite faciliter les sièges. Donc, créons une classe et je vais l'appeler couleurs sont la variation de configuration des semences, d' accord, la configuration des graines de couleur. Maintenant, afin d'obtenir ce fichier de configuration pour connaître la norme qui doit être obtenue avec l'ensemble du constructeur et ainsi de suite. Ce que nous ne sommes pas allés faire est de le laisser hériter de la configuration de type d'entité I. Très bien, et cela peut nécessiter des bibliothèques manquantes. Donc, Microsoft Entity Framework Core, nous allons de l'avant et incluons cela. Et puis je spécifie l'entité que j'avais besoin de savoir, un bol, qui dans ce cas est la couleur, qui allait ensuite à des exigences qui comprennent une autre bibliothèque, leur but. Et puis je vais devoir implémenter l'interface qui apporte ensuite ce fichier de configuration, n'est-ce pas ? Configurer. Eh bien, la méthode est désolé. Donc, configure va ensuite injecter un constructeur basé sur la couleur, qui est fondamentalement basé sur le même constructeur ici pour le ModelBuilder. Donc, tout ce code que j'avais ici, je peux savoir que tic peut le couper et le coller à l'intérieur de cette méthode. Maintenant, je n'ai pas besoin de beaucoup de code et c'est là que je sauterais le pistolet parce que c'est ma méthode habituelle. Et quand ils utilisent cette méthode, il sait déjà qu'il s'agit de couleurs. Je n'ai pas à dire que l'entité point du constructeur est couleur car il sait déjà que le constructeur est basé sur la couleur. Donc, je peux dire que le point de constructeur a des données et c'est là qu'il était. Mon esprit était au départ quand je créais tout le morceau de code ici. Donc maintenant que nous avons cette configuration configurée dans ce fichier qui n'est clairement pas en dehors du contexte DB d'obligation. Maintenant, j'ai besoin des contextes d'application et dv, ou au moins cette méthode pour savoir qu'il devrait appeler cette méthode configure ici, non ? Donc, dans la création indésirable ce que les autres disent points de constructeur, appliquez la configuration. Et puis je vais instancier notre configuration de graines de couleur, non ? Et puis, bien sûr, inclure les références manquantes, et puis c'est tout. Donc vous voyez que nous venons de transformer tout ce LAN, toutes ces lignes de code en une seule ligne de code. Et pour moi, ça a l'air plus propre. Vous savez, quand vous regardez le contexte DB de l'application, vous devriez être en mesure de rechercher les subventions de données et avoir une bonne idée si vous voulez les détails, vous allez ailleurs. Alors nous allons ici et puis nous voyons les détails de ce qui est assis. Et donc ce principe peut se poursuivre pour toute autre entité que vous souhaitez voir des données. Disons que nous voulions ensemencer en mélange. Qu' est-ce que, allez, les carburants, Voyons voir, Toyota et BMW, non ? Donc je te mets au défi de faire une pause, non ? Sachez, créez votre propre configuration de semence et faites-les entrer. Donc pour moi, Donc sur Toyota et BMW. Et puis vous pouvez probablement tendance semer vers des modèles qui correspondent aux modèles Toyota et BMW. D' accord, donc j'espère que tu t'es arrêté et que tu l'as essayé tout seul. Sinon, vous pouvez le faire. Non. Mais ce que j'ai fait était de suivre la même technique. J' en ai créé un pour le micro, j'ai créé un modèle à photon, puis j'ai les fichiers respectifs ici. Donc pour le micro. J' ai deux micros dans les forums de BMW et Toyota. Et puis pour les modèles que j'ai créés quatre, non ? J' ai créé des largeurs de Prius, qui, si vous connaissez les voitures, sont celles de Toyota. Et puis les trois séries sur un X5 qui appartiendrait à la BMW. D' accord. Ainsi, vous pouvez aller de l'avant et vous créez vous voyez l'inflammation et vous venez de créer ces fichiers de configuration. Je veux dire, si vous n'aimez pas faire les fichiers de configuration, c'est bon. Vous pouvez toujours tout mettre à l'intérieur du modèle en créant ce que nous avons déjà discuté. Pourquoi ? Personnellement, je n'aime pas ça. C' est pourquoi je vous montre cette méthode. N' importe quel OMS, une fois que nous avons fait ces configurations, nous devons si vous avez terminé ma phrase en disant migration ADA, alors vous êtes sous camion. Nous devons donc dire ajouter la migration. Et puis je peux dire voir la valeur par défaut. Et disons les données de voiture. Bien sûr, tu veux le raconter, c' est une histoire dans le nom, non ? Donc, nous pouvons aller de l'avant et ajouter cette migration et nous permettre de jeter un coup d'oeil rapide à ce que ce fichier de migration crache. Et whoa, d'accord, je reçois une mauvaise erreur. Il est bon pour nous de voir ces erreurs parce que nous les rencontrons de temps en temps avec notre migration. Il est donc bon de comprendre ce qui aurait pu se passer. Donc, il dit que l'entité de base pour la couleur du type d'entité ne peut pas être ajoutée car les valeurs non nulles requises pour l'ID de propriété considèrent de fournir une valeur négative à, ok, mais ensuite en regardant mes configurations de base qui n'ont pas d'ID. Mais alors je me demande maintenant si cette virgule la fin est ce système pensant que je voulais mettre un ID. Laisse-moi juste prendre o.com. Je ne sais pas si tu as ce problème. Si vous le faites, alors vous pouvez essayer cela aussi. Si vous ne le faites pas, alors vous avez eu raison la première fois, quelqu'un à essayer à nouveau. Et il y a aussi un processus de dépannage. Eh bien, ça n'a pas aidé. Donc, ce que je vais faire alors est d'essayer d'être explicite avec l'id. D'accord, donc l'un des avantages à être explicite avec l'ID de toute façon serait que si nous créions des enregistrements que C avait des dépendances. Donc, je vais ensemencer dans les véhicules par défaut par exemple, puis ajouter pour mettre la couleur, je suis désolé, l'ID de l'appelant et l'ID Meek et ainsi de suite. Ensuite, en étant explicite avec le MC et les ID entiers sont tous les ID de ces entités. Ensuite, je peux explicitement dire que le véhicule devrait avoir cet ID appelant, cet ID Meek, parce que je sais que par défaut ces ID devraient être présents. Alors mettons-nous ces identifiants. Et il y a des chances que tu sois probablement entré dans la même ère que moi et ce n'est pas un problème. Nous pouvons voir exactement ce que l'erreur est en attente. Solide. Donc, mettre ces valeurs d'ID dans la couleur, la marque et le modèle. Essayons encore et ce style. Et on y va. Nous arrivons donc à notre migration. Donc non, on voit, d'accord, alors oui, je t'ai un peu trompé. Nous devons mettre cette valeur d'identifiant dès le début. D' accord ? Donc, notre fichier de migration dirait insérer les couleurs et ensuite c'est casse-tête les colonnes. Et puis il nous donne les valeurs qui vont dans chaque colonne. Donc ID, système d'ID, nouvelle datetime pour le créé. La même chose pour la date mise à jour et ainsi de suite. Donc, il fait cela pour toutes les tables pour lesquelles nous avions spécifié l'ensemencement, voir ces données, non ? Et puis l'aube renverse bien sûr ça. Donc, quand nous mettons à jour la base de données, puis exécutons cela. Et puis en attendant, ce que je voulais faire juste aller à l'Explorateur d'objets du serveur et rafraîchir. Et nous pouvons juste jeter un oeil aux données qui sont maintenant dans notre tableau de couleurs. Donc, si je fais un clic droit et dire des données de vue, alors nous voyons nos ID ACR jeu de données, même s'il sera généré automatiquement lorsque nous sommes sur le système est utilisé par les utilisateurs. Nous sommes en train de semer, nous devons fournir ces valeurs d'identification, ce qui est logique, non ? C' est tout ce qu'on fait pour les couleurs. Donc, si vous le souhaitez, vous pouvez essayer de semer des données pour un véhicule, pour certains véhicules par défaut parce que nous avons déjà fait quelques modèles. Et disons qu'on démarre la flotte avec deux véhicules. Je ne suis pas sûr de vouloir nécessairement semer des véhicules dans le système cependant. Je vais probablement vouloir que l'utilisateur ou quiconque utilisera cette obligation sur une base quotidienne le fasse réellement. Mais une autre chose que je veux vraiment intégrer dans notre base de données serait rolls, parce que nous allons avoir des rôles différents dans le système, allons avoir admin user_roles, n'est-ce pas ? Alors faisons juste les rangées et ensuite on peut l'appeler un jour pour cette opération. Donc, vous savez l'exercice que je défie encore une fois, allez-y et faites vous-même et nous pouvons comparer les notes. D' accord, donc si vous patron Don, vous assistez à une minuscule coincée, ce n'est pas un problème. Et je suis là pour t'aider. D' accord, donc la chose avec la règle est que j'ai dit roll, mais le type de données requis n'est pas une règle comme, oh, vous avez un utilisateur d'identité pour les utilisateurs, vous avez un rôle d'identité pour les lignes. Donc, notre fichier de configuration de rôle aurait une règle d'identité comme contexte ou comme entité, n'est-ce pas ? Et quand nous construisons tout ce que nous avons une nouvelle règle d'identité et nous avons des noms et des noms normalisés. Donc celui-ci, nous ne le faisons pas, nous n'avons certainement pas besoin de mettre un ID parce que l'ID de nos tables réseau ASP serait GUID, n'est-ce pas ? qui signifie que c'est, c'est difficile pour nous de mettre l'ID là que nous pourrions, mais nous n'avons pas besoin d'ajouter ce point à moins que nous allions voir les utilisateurs qui planeront était, nous devions indiquer explicitement l'identifiant. dire quelque chose comme id est égal à point nouveau bon point toString. Donc, il générerait un GUID explicite et ensuite le mettre, mais c'est toujours un peu aléatoire parce que nous ne sommes toujours pas sûrs de la valeur que cela fournirait. Donc, vous pouvez vraiment aller de l'avant et obtenir ce bon ailleurs. Vous pouvez le trouver en ligne et générer un GUID. Et tu viens de mettre cette bonne Valérie ou moi. Donc, vous savez que c'est une bonne valeur pour le rôle d'utilisateur. Et puis nous pourrions dire que cela pourrait légèrement modifier, qui se dissoudre pour être une grande modification, la strophe quatre à 56 à elle, et ce ne serait rien de trop fantaisie. C, C T, T, T, T à F, F, non ? Et puis c'est notre bien. Alors nous avons celui de demain, nous connaissons les identifiants. Donc, si nous devions utiliser comment les utiliser plus tard, nous pouvons le faire. Donc je vous montre juste qu'il y a tellement de dynamiques existantes beaucoup moins tôt fait arabe faire cela d'une façon, alors il peut essayer d'une autre façon et nous pouvons travailler la nôtre en conséquence. Alors maintenant, j'ai ajouté ces rôles. J' ai besoin d'ajouter la configuration du rôle ici. Droit ? Ainsi, lorsque nous ajoutons une nouvelle migration, puis celui-ci est C. C, les rôles sont des règles par défaut. Alors si on y jette un coup d'oeil, on verra ici que ça nous ajoute les rôles. Ça va faire tout ça. Et puis il voit toujours les configurations ici, mais il ne fait aucune mise à jour. n'y a rien à mettre à jour en dur, non ? Pour que nous puissions aller de l'avant et mettre à jour notre base de données. Et puis quand je passe à ma base de données et regarde les règles, je ne les vois pas avec les valeurs d'identification mêmes ainsi fournies et les données en conséquence. n'est donc qu'une introduction rapide car tout le week-end met en place des valeurs par défaut dans notre système. Car lorsque notre application est installée, les utilisateurs auraient quelque chose à utiliser. Quelque chose comme des règles devront certainement être en place. Parce que lorsque les utilisateurs s'inscrivent sont créés, nous devons les affecter à sont tous, tous difficiles la boîte, n'est-ce pas ? Donc, ce sera bien si dans votre temps vous allez de l'avant et semer dans l'administrateur par défaut, l'utilisateur, n'est-ce pas ? Quiconque nous sommes dit juste que nous devrons nous inscrire comme notre utilisation régulière de plus tard. Mais nous allons regarder ça. Mais en ce moment, vous voulez vous concentrer sur au moins obtenir dans un utilisateur administrateur par défaut, sorte que vous créez l'utilisateur. Mais en cédant celui-ci, vous devez voir l'utilisateur Andy off pour initier les user_roles. D' accord, donc tu peux aller de l'avant et faire ça comme un défi. 15. Rôle de l'utilisateur et l'utilisateur en utilisateur et en Seed Comparez les notes: Très bien les gars, bug de bienvenue. Donc, comme je suis sûr que vous l'avez déduit du titre de cette leçon, c'est vraiment juste pour comparer les notes parce que je vous ai laissé avec une mini-affectation de codage et j'espère que vous l'avez essayé. Sinon, alors l'histoire de l'école ensemble dans les deux sens. L' affectation consistait donc à s'assurer que vous voyez l'utilisateur ainsi que le rôle d'utilisateur. Parce que ce que nous voulons, c'est cet utilisateur par défaut avec le rôle d'administrateur dans notre système. J' ai donc créé une configuration pour l'utilisateur et la configuration pour le rôle utilisateur. Donc, nous avons déjà fait le rouleau ensemble sont les rôles où nous avions ou rôle d'identité que nous avons créé nos propres bonnes valeurs sont définis explicitement les ID. Le fait est que, bien sûr, si vous avez des dépendances, vous voulez toujours mettre des données dans l'ordre des dépendances. Donc, la même règle qui est appliquée ou que j'aurais encouragée lors de la création des tables. Il s'applique lors de l'ensemencement des données Cozy Car B, l'ensemencement, un utilisateur associé à notre rôle lorsque vous n'avez pas les règles, sont les utilisateurs, d'accord ? Nous avons donc le rôle. Nous avons créé l'utilisateur. J' ai donc la configuration d'amorçage de l'utilisateur où j'ai configuré un utilisateur. Et je veux dire que votre utilisateur pourrait être différent que si vous aviez des difficultés avec ce truc, alors pas de problème. C' est pour ça qu'on est là. Ce qui se passe, c'est que j'ai dû utiliser un plus dur. Nous n'avons donc pas fourni de bibliothèque par les bibliothèques de base d'identité appelées le mot de passe plus dur, et nous la contextualisons à l'utilisateur de l'application. Et puis avec ce week-end HobShare, créez les mots de passe hachés. Donc je suis juste en train d'initialiser ça. Ensuite, nous avons dit constructeur a le, il va créer un nouvel utilisateur d'application avec l'ID explicite, ce qui est juste un autre bon, l'adresse e-mail, l'e-mail normalisé. Donc, l'email et l'email normalisé seront les mêmes sauf normalisé signifie que tout est en majuscules, n'est-ce pas ? Nous lui donnons Prénom, Nom, Nom d'utilisateur, Normaliser le nom d'utilisateur, même principe que l'e-mail et vous normalisez l'e-mail et puis un hachage de mot de passe doit être une version hachée de n'importe quel mot de passe. Donc, c'est un boss par défaut ou que nous utilisons. Bien sûr. Mais nous ne pouvons pas stocker ce texte dans la base de données, mais nous pouvons le trier dans le code source car nos clients ne verront probablement jamais le code source. Mais au niveau de la base de données, nous ne devrions jamais, personne ne devrait jamais être capable d'aller dans notre base de données et de voir ce processeur. Donc, dans un mot différent, désolé, noyau d'identité avec toujours hacher le mot de passe. Et donc quand nous sommes assis, c'est ce que nous devons fournir un mot de passe haché. D' accord ? Donc, nous fournissons ce mot à la mode et c'est l'utilisateur. Et puis dans la configuration du rôle d'utilisateur, mêmes céphalopodes que nous venons de traverser sauf que nous utilisons rôle d'utilisateur d' identité et que cela doit être contextualisé à la chaîne. D' accord ? Et puis ce que nous allons mettre ici, nous n'avons pas besoin de l'ID ici, mais ça va vraiment, je ne pense pas que cette chose est stable, utilise un ID, mais nous avons besoin de l'ID de rôle. Donc, je suis allé aux configurations de base de rôle et assurez-vous que j'ai l'ID de personnage, que j'avais sur le dessus. Laisse-moi rencontrer ce courage à droite, et tout l'administrateur, d'accord. L' identité dont nous avons besoin est l'administration, la seule. Là, nous allons, et puis l'identifiant de l'utilisateur est faux, toutes sortes. Je vous montre juste, assurez-vous que vous obtenez ça correctement. Donc, l'identifiant d'utilisateur à utiliser est celui-ci correct ? Donc après que nous avons fait ces corrections, je veux dire, ces axons parce que je suis sûr que vous êtes déjà le camion de souscription. Ensuite, nous pouvons aller de l'avant et semer nos valeurs par défaut de l'utilisateur, droit, donc mises à jour, Base de données. Et désolé, nous devons ajouter des apologistes de migration. Alors ajoutez une migration de tableau de bord, non ? Et puis nous disons ajouté les utilisateurs par défaut. Je charge cette migration pour qu'elle s'exécute. Et c'est la deuxième fois que nous voyions cette bande jaune. Si vous l'avez lu la première fois, je n'ai pas indiqué que c'est vieux, mais cela dit essentiellement qu'il y a des éraflures et que cela pourrait entraîner la perte de données. J' ai donc fait allusion à cela plus tôt lorsque nous avons découvert comment les migrations fonctionnent que parfois vous rencontrez des changements qui pourraient affecter les données existantes. Donc, vous arriverez à, c'est un avertissement de dire, hey, vous savez, faites attention parce que vous pourriez effacer des données. Juste donner un avis rapide juste pour s'assurer que salé veut vraiment. C' est tout ce qu'il voit. Et ces fichiers de migration comme nous le voyons, nous pouvons toujours les modifier si nous le voulons, n'est-ce pas ? Donc, ici, nous voyons des insertions dans ces tables, ces valeurs, pas de problème. Et puis nous savons que le prochain point d'action est notre mise à jour, qui devrait alors nous donner quelques utilisateurs par défaut. Donc, nous avons déjà enregistré I utilisateur. Et donc quand je regarde dans ASP net use, je devrais maintenant voir deux utilisateurs. Celui qu'on a enregistré, non ? Rappelez-vous test sur blazer.com, C'était l'utilisateur que nous avons mis en place initialement. Et voici celui que nous venons de le semer dans la base de données, qui est notre utilisateur administrateur. D' accord ? Donc, vous voyez que cela fonctionne et nous n'avons pas fourni prénom et de nom lorsque nous avons enregistré l'utilisateur parce que bien, nous en avons besoin, nous devrons modifier l'enregistrement pour cela. Mais alors nous avons les champs utilisateur admin ici, le Prénom, Nom, selon ce que nous voyons que ce qui, bien sûr, ils étaient facultatifs de toute façon. Et si je passe aux rôles, on sait que nous sommes des zéros. Eh bien, laissez-moi juste me concentrer sur la table des rôles utilisateur où il nous montrera quelles utilisations associées à quel rôle. Donc, comme je l'ai dit, il n'a pas de colonne d'identification de toute façon, n'est-ce pas ? Donc, nous voulions juste savoir que cet ID d'utilisateur, qui est notre utilisateur administrateur, il E pour, pour cela, E pour, pour leur faible correspond à cette règle. Donc, c'est essentiellement tout ce qu'il y a à ensemencer les règles par défaut, les utilisateurs par défaut dans notre application. 16. Révision et ajouter des changements à GitHub: D' accord les gars, alors on est là et on est à un autre point de contrôle et on veut juste revoir tout ce qu'on a fait pour cette section. Donc, tout d'abord, nous avons commencé à examiner nos allocations de base d'identité de serveur d'identité. Nous avons examiné ce qui se trouve dans le fichier de démarrage qui nous permet de nous connecter à la base de données, ainsi que de nous connecter à notre serveur d'identité et à toutes ces fonctionnalités. Ensuite, nous sommes entrés dans la mise en place de nos propres notes d'échafaudage de base de données, les tables de serveur d'identité afin que nous puissions stocker les utilisateurs sous des rôles et tous les bits de données supportant qui sont entrés dans la création nos propres modèles de domaine et les ajouter à la même base de données. Et puis nous sommes allés de l'avant et regardé toute la semence de week-end notre crée quelques enregistrements par défaut dans notre système à l'exécution. Donc, après avoir fait tout cela, je suis sûr que vous auriez absorbé du tout et il peut toujours ne pas le faire et l'examiner et essayer de l'obtenir, concrétiser comment tout fonctionne, ce qui est à ce stade, nous voulons juste vérifier nos changements à notre dépôt pour nous assurer que nous gardons un bon compte rendu rapide de tout le travail effectué. Donc, ce que nous faisons ici est de passer pour obtenir des changements, et ensuite nous lui donnons un joli petit message de commit. Et ce message, bien sûr, devrait être assez clair pour, vous savez, vous-même dans le futur ou votre futur, ainsi que pour toute autre personne qui pourrait venir chercher à leur dire, vous savez, ce qui a été fait exactement. Vous pouvez donc toujours faire défiler et voir tout ce qui s'est passé avec les échafaudages sur nos pages d'identité. Nous avons examiné les configurations d'ensemencement, toutes ces migrations. Donc, la chose cool est que si quelqu'un d'autre vient après vous et obtient ce que vous êtes sur le point de vérifier dans cette citation, ancien référentiel de logiciels, tout ce qu'ils ont besoin de faire est de modifier, peut-être qu'ils sont en place settings.js fils à n'importe quelle base de données serveur et nom de base de données qu'ils souhaitent avoir. Et puis ils sont une mise à jour a besoin d'une base. Et puis il va automatiquement passer par toutes les migrations et appliquer tout dans le même ordre qu'il est aligné notes. Très bien, donc si vous perdez cette machine sur laquelle vous travaillez null, mais vous avez une copie de votre projet sur GitHub, alors à ce stade, vous n'avez pas perdu de données parce que toutes les données sont juste par défaut éléments capturés dans ces fichiers de migration. Donc vous avez juste besoin de sortir ce projet de cet instantané où le poulet et ensuite vous exécutez ma base de données. Vous allez de l'avant et créer la base de données, en mettant toutes les tables et la structure et le big data pour vous. Et puis tu es là, mais j'ai la case 1. Alors maintenant, allons juste de l'avant et dire que tout s'engager et couler. Donc, ce comité misérable localement et il va synchroniser avec le bon travail Stacy engagé localement. Et puis il pousse et puis il a réussi à synchroniser avec notre référentiel GitHub. Donc, quand nous reviendrons, nous allons continuer à apprendre plus de problèmes à cette application blazer entière fonctionne avec Entity Framework sur toutes les pièces mobiles. 17. Aperçu de la section - Configuration de l'API REST et de l'accès à la base de données: Hé les gars, bienvenue. Dans cette section du cours, vont jeter un oeil à la façon dont les API de repos interagissent avec blazer. Non, j'avais déjà fait allusion à cette interaction et je vais juste donner un bref résumé dans cette vue d'ensemble où nous allons jeter un oeil à un, le fait que le projet serveur est vraiment un projet API. Et ce que nous allons créer des contrôleurs d'API Ruby comme nous le voyons ici avec le contrôleur de prévisions météorologiques exemple, où nous avons un contrôleur d'API et ce qu'il expose vraiment nos points de terminaison. Donc, si vous n'êtes pas trop familier avec les API de repos, vous pouvez regarder mes cours Bien que sur le développement d'API de repos avec .NET Core Five, ou mon cours de développement de bout en bout blazer et d'API Web, où effectivement enseigné, parler de la construction de l'API en tant que entité séparée et de créer des clients pour se connecter à elle. Et ces clients seront des clients blazers. Cependant, dans ce cours particulier, je ne me concentrerai pas trop sur Rest, API et toutes les pratiques qui vont. Et je veux juste vous assurer que lorsque vous avez ces modèles de projet et que vous voulez une application blazer, vous allez finir avec notre application cliente que nous avons vu application serveur et comment nous allons construire la fonctionnalité API pour servir ce client. Donc, tout ici est interne à une grande application. Il dit qu'il fait des pièces mobiles et je veux juste que nous ayons une pleine appréciation de tous les points de contact différents et de la façon dont ils se réunissent. Donc, quand nous reviendrons, nous continuerons notre discussion sur nos contrôleurs API va créer les nôtres et voir exactement comment nous pouvons le tester pour nous assurer qu'il fonctionne. Et puis on ira de l'avant à partir de là. 18. Créer et tester les points de terminaux API REST: Nos gars, nous sommes de retour et dans cette leçon, nous allons regarder créer, anticiper nos points de terminaison API de repos. D' accord, donc nous avons déjà établi que ou les points de terminaison sont exposés à travers ce que nous appellerons ça un contrôleur API. Et une fois de plus, j'utilise juste le contrôleur de prévisions météorologiques comme 0 parce que c'est ce qui nous est donné. Et nous voyons ici, Si vous les utilisez VC, c'est vraiment juste un autre contrôleur a juste cette annotation pour spécifier qu'il s'agit d'un contrôleur API. Il hérite de la base du contrôleur, mais tout le reste est à peu près le même. Également sur les axones, nous traitons les ventes aux enchères ni comme les endpoints, et nous avons ce que nous appelons les verbes restants. Donc, les verbes RS seront get, post, put et delete. Et d'une façon ou d'une autre, ce sont généralement les opérations chantées auxquelles nous sommes habitués, non ? Obtenir serait lu, post serait créer, mettre serait mettre à jour, et Supprimer est supprimer, non ? Ce sont donc les verbes qui nous aident à faciliter nos opérations chantées. Maintenant, dans le, en termes de test de nos points de terminaison lorsque nous exécutons notre application ici. Nous savons que nous avons notre interface web, c'est ça. C' est ce qui nous est présenté et c'est très bien. Mais alors nous tous, nous avons déjà établi que les applications client et serveur sont en cours d'exécution de la même adresse ici, qui est localhost deux-points 443. Si je l'ai fait dans mon cas, vous auriez probablement un numéro de port différent. Mais le fait est que le client et l'application serveur, ils utilisent la même adresse, ce qui signifie alors que je peux utiliser mon outil de test API appelé Postman et heureux cette même adresse dans une requête get. Et ce que je voulais tester, c'est si je peux obtenir les données météo. Donc, il dit « obtenir ». Donc, après assurez-vous que ma demande est que je reçois. Et puis la façon d'y arriver serait par le contrôleur racine. Et le contrôleur signifie soit le nom du contrôleur, qui dans ce cas est de savoir si pour les prévisions de récolte, désolé. Donc, je peux voir HTTPS deux-points localhost, barre oblique deux-points, barre oblique, désolé, deux-points localhost, le numéro de port, puis le nom du contrôleur, qui est des prévisions météorologiques. Alors quand j'envoie cette demande, eh bien, dans ce cas, je récupère un statut pour 01 sur autorisé pourquoi je reçois cet argent ? C' est parce que nous avons ces annotations autorisées, donc vous devez être un utilisateur connecté et tout. Et nous avons traversé tout le flux identitaire et tout. Donc, si vous n'êtes pas une tendance utilisateur connecté à accéder à ce point de terminaison, il vous rejettera. Donc, si je commente cela, pas autoriser et réessayer, alors je vais obtenir une réponse différente où j'obtiens un 200 OK et je récupère les données de la base de données. Très bien, donc c'est tout et l'API fonctionne. Je parle de ce JSON, et c'est le JSON qui va, eh bien, cela ne vient pas de la base de données d'abord et c'est tout quelqu'un qui a été cuit dans, dans l'action ou le point final. Mais représentons simplement le système d'exploitation exécutant une requête, obtenant les données et ensuite les renvoyant à celui qui demande les données, ce qui dans ce cas pourrait être perdu par Postman ou notre application côté client blazer, c'est pourquoi dans le client projet. Maintenant, voir avec les données de récupération de la page, ils vont aller chercher des données. Il a fait la même opération. Il est allé et il a dit, Je veux des données de ce point de terminaison. Donc je ne veux pas que vous regardiez ce code tout de suite. Je ne vous montre pas que c'est pour ça que ce discours sert, quelles données font. Vous n'étiez pas en mesure d'y accéder avant parce qu'il a l'auteur que je commence. Et à l'époque, nous n'avons pas configuré l'ensemble du système de connexion de l'utilisateur et ainsi de suite correctement. Donc maintenant, vous pouvez réellement aller le tester, mais cela prédit l'application côté client. Alors que cet auteur comme odeur, prédit le point de terminaison d'un accès non autorisé, mais ensuite via l'authentification intégrée dans notre application jusqu'à présent, alors nous sommes en mesure de simplement authentifier du côté client. Et puis cet auteur que je commence, nous verrons que c'est notre, c'est une requête authentifiée venant par le client à ce point final, donc il va lui permettre d'interrompre. Donc je vous donne juste un aperçu de ce qui se trouve dans l'échantillon. Nulle part va créer le nôtre. Donc, créons S1 et un simple. Commençons par une de nos tables plus simples comme moi. Très bien, nous allons donc vouloir que les points de terminaison pour permettent au client d'interagir avec notre table de base de données pour moi. Et le client va le faire via l'API. L' API doit donc être en mesure de communiquer avec notre base de données. Maintenant, la bonne chose à propos de Dante Corps qu'ils nous donnent échafaudage pour que je puisse juste faire un clic droit aller à, aller au nouvel article. Et puis je peux choisir ça. Je veux un contrôleur API. Je vais en choisir trois, non ? Donc, je voulais aller aux contrôleurs, aller à Ajouter, puis dire contrôleur. Et puis je vais obtenir cette boîte de dialogue demandant quel type de contrôleur aimerais-je ? Eh bien d'abord, je veux un contrôleur d'API puis je veux un avec des actions en utilisant Entity Framework. Non. Je suis allé le construire dans deux travaux différents. Parcourez le code, puis expliquez en quelque sorte pourquoi les gens implémenteraient d'autres modèles au-dessus de l'Entity Framework afin que les capacités minton soient plus faciles à long terme. Mais pour obtenir une application de base qui peut lire, écrire et interagir avec la base de données et le client. C' est tout ce dont vous avez vraiment besoin. Donc, les actions de contrôleur API en utilisant Entity Framework, nous cliquons, nous lui donnons Doyle qui doivent spécifier la classe de modèle. Donc, la classe de modèle ici signifie quelle classe elle n'est pas vraiment ni curable les nuages est celui qui est domaine ne sont pas. Bien sûr, nous avons la responsabilité de nous assurer de choisir le bon. Alors j'en veux une pour douce, non ? La classe de contexte de données serait application sur le contexte DB, puis tout dégénère le nom du contrôleur de mixage. Vous pouvez changer ça, mais je pense que c'est assez clair ce que ce contrôleur sera obligé de quitter. Et puis je suis allé à aller de l'avant et cliquez sur ajouter. Et puis après quelques secondes et un peu de dollars a grandi Ward, nous aurons maintenant notre contrôleur. Donc, vous verrez ici, il a le contrôleur de barre oblique de l'API racine. Si vous comparez cela avec les prévisions météorologiques, celui-ci dose-contrôleur. Donc, la différence est que nous pouvons réellement spécifier l'itinéraire. Donc, je ne veux pas qu'il dise api slash, je voulais juste dire contrôle. Donc, en d'autres termes, pour arriver à ce contrôleur, à ces racines, nous avons juste besoin de voir les marques, d'accord. Il nous donne le contrôleur API d'annotation. Si nous voulons le protéger, nous pouvons ajouter l'annotation d'autorisation en haut, ce que nous ne ferons pas encore, donc je vais juste le mettre là pour que vous vous souviez de le faire plus tard. Et puis le reste est vraiment juste de dire que, ok, nous avons une classe avec ce nom héritant du contrôle obèse, nous avons un contexte DB d'application en lecture seule privée, et notre objet est sur les contextes de partition. Et puis ce qui se passe ici est appelé injection de dépendance, où nous injectons le contexte DB de l'application qui sert toute l'application sur l'API entière, où l'injecter dans ce contrôle particulier et faire un copie locale. Et c'est ce qui se passe ici. Donc, nous faisons notre domaine privé. Nous laissons le constructeur ni qu'il devrait attendre, vous savez, l', l'objet du contexte DB de l'application, qui représente nos connexions à la base de données. Et puis nous voulons faire une copie locale. Donc, nous assimilons ou champ local aux objets envoyés, puis nous continuons nos opérations avec notre champ local. Ensuite, vous remarquerez que nous avons aussi tous ces verbes sorte de généré pour nous. Nous avons le verbe HTTP Get, web, HTTP Get avec la spécification ID et puis ils peuvent je donner des exemples. Donc mélange de slash de la NSA. Donc, il dit mélange de slash API parce que par défaut c'est un contrôleur de slash API. Nous avons enlevé la barre oblique de l'API cyrillique et sûrement ce que nous devrions avoir est juste mélanger, non ? Ce sont des commentaires que vous n'avez pas à passer inchangés et j' explique juste pourquoi nous allons l'enlever, non ? Donc, quand vous appuyez sur mix, il va frapper le get par défaut. Et puis il va alors appeler cette méthode. Donc, le point final ici, cette méthode est vraiment juste une méthode qui a toute action doit être effectuée. Cependant, le nom de la fonction ou un nom de méthode n'est pas ce que nous mettons dans le chemin. Tout ce que nous avons à faire est d'appeler ceci parce qu'alors il en déduira que lorsque vous rencontrez ce genre de qualité, vous faites une demande get. Et donc j'appellerai cette méthode automatiquement. Très bien, alors vous remarqueriez que celui-ci obtiendrait le même nom de méthode sauf qu'il prend un paramètre de type ID et qu'il devrait se disperser en ID que vous espérez obtenir. Et il effectue toute cette opération. La même chose avec le nom de la méthode put. Il s'attend à ce que l'ID et attend des données à la carte 22. Que dois-je voir une entreprise cet identifiant ? Et je ne vais pas passer par trop de code pour l'instant parce que nous allons faire un gros refacteur avec cela. Mais je fais juste remarquer que tout ça va marcher hors de la boîte. Donc, ce que nous allons faire est de lancer ceci et de tester. Bon, donc on est de retour à Postman et je vais changer ça pour dire mix. Souvenez-vous maintenant que nous avions la somme échafaudée. Mélangez initialement dans la base de données. Donc, cela signifie que j'ai des données qui devraient pouvoir revenir lorsque j'envoie cette demande. Là, nous obtenons Bach ou des données ou obtenir sur Toyota avec l'ID1 créé par bien que cela par toutes ces choses merveilleuses. Tu vois, toutes les données sont en train de revenir. Juste au cas où vous êtes ici, pensez que cela ne fonctionne pas vraiment sur la tendance de glisser la STM quand mettre un point d'arrêt ici sur cette getMethod. Alors essayons à nouveau. Je clique sur envoyer, puis Visual Studio va m' avertir que j'ai atteint le point de rupture sur cette méthode, qui va ensuite exécuter cette connexion à la base de données de requête, me chercher la table de marques et mettre tout là à une liste et le retourner. C' est à peu près toujours faire. Il va automatiquement le sérialiser dans le bloc de texte JSON et le renvoyer. Tu as voulu en tester un autre. Disons que nous voulions tester le Get avec l'ID. D' accord, donc je peux dire un outil de mélange de neige fondante. Et puis cela devrait me ramener seulement les objets BMW parce que alors la méthode dit, aller à la base de données et trouver l'enregistrement dans la table de mixage qui a cet ID. Et puis si c'est si ce n'est pas si vous n'avez pas trouvé quoi que ce soit retourné, pas téléphoné, sinon ça a tourné les Beatles. Donc, si je mets dans ID Tin ceux, je n'ai pas dix mix dans la base de données. Donc, alors il revient, pas appelé cette déclaration if et il a retourné pas plier car il, toute cette fonctionnalité est sorti de la boîte. Tout ce que j'ai fait c'est de cliquer trois ou quatre fois et nous avons un contrôleur entier. Et le fait est que vous pouvez générer ces contrôleurs pour toutes les fonctions, toutes les autres tables et points de terminaison que vous devez exposer à votre client afin que vous puissiez aller de l'avant et faire tout cela si vous le souhaitez. Juste pour expliquer ce que ceux mis prend l'ID et il prend les données pour le micro, qui signifie que je suis sur le point de faire mon bateau pour mettre à jour certaines choses pour envoyer sur l'objet avec les données mises à jour. Il s'assurera que les ID correspondent. Sinon, il retournera une flèche 500 ou une mauvaise requête. Ensuite, il va dire, ok, base de données, cherchez l'enregistrement correspondant sont basés sur l'ID, l' enregistrement dans la neige de base de données, puis changer son état pour le modifier et puis juste enregistrer les changements parce que je viens d'obtenir données mises à jour, donc NOR qui est modifié et dans CVE, quelles que soient les modifications qu'il y a à l'enregistrement existant. Et puis c'est éclater dans une capture d'essai juste au cas où il y aurait conflit notre tentative conflictuelle de mettre à jour le même enregistrement. C' est à peu près tout ce que ça fait. Le post est le Crée, n'est-ce pas ? Donc quand on fait un post, ça veut dire que je dois changer le verbe. Donc le verbe dans Postman doit être changé coordonnent ceci, je vais le changer pour poster. Ce sera la même barre oblique Meeks. Mais ensuite le corps. Et ce que je vais faire, c'est juste en prendre un qui a déjà eu. Je dois donc fournir des données similaires à cela dans une demande de poste. Donc, dans le corps. Très bien, je vais dire que je voulais possible point JSON et PS ensemble là-bas. Cette fois, je vais mettre une Honda. Donc c'est le nouveau micro. Et cette Honda est montée sur ID3. Eh bien, en fait, je ne devrais pas fournir l'identifiant. Donc, à ce stade, je ne fournit pas d'ID parce que je suis en train de créer quelque chose dans la base de données. Donc la base de données devrait être responsable de ses propres points d'idée, non ? Donc honda créé en analysant un système la même manière parce que nous ne sommes pas tout à fait prêts à voir l'utilisateur qui est connecté fait l'opération, laisser les horodatages que les choses d'audit. Donc maintenant, on peut s'en sortir avec ça. Et ce que je vais faire est de soumettre cette demande de poste. Donc, cela devrait me renvoyer l'objet qui a été créé. Il y avait des prêts, donc c'est plein sur créé. Et ça me montre que Honda a été créée avec l'ID3, avec toutes ces données, non ? Donc, ce Endpoints est une base de données, Donnez-moi la table et ajoutez-y tout objet qui arrive par notre requête et voyez si ces changements. Et puis renvoyez l'action created_at, qui est la grande. Et dis que tu peux aller me chercher avec cette pièce d'identité et c'est l'objet. Plutôt beaucoup. Tout cela nous a donné ce retour, ce résultat de retour. Et si je vais ici, emplacement, si je vais aux en-têtes et regarde l'emplacement, c'est ce qui n'a pas acheté créé aux enchères. Donc ça veut dire que c'est sédentaire où je peux aller chercher les détails. Supprimer les œuvres. De même, une fois de plus, je dois juste passer les suppressions. Ce que je ferais, c'est dire mélange et disons deux. Mais puis supprimez. Voilà ce que je ne veux pas créer cette voiture factice. Donc voiture factice. D' accord, donc je vais envoyer une autre demande de poste pour notre voiture factice. Laissez-moi envoyer MCAR avec ID quatre. Je réalise, oh non, c'était une erreur. Je n'aurais pas dû faire ça. Donc, je reviens, allez à supprimer et je vais changer le verbe pour supprimer les marques est pour l'ID pour. Et puis quand j'envoie va dire outil pour aucun contenu. Donc tout ce qui est un code 200 est réussi. Et puis, tu sais, ça peut varier. Tout ce qui est un 400 est, est relativement infructueux, généralement infructueux, et 500 est certainement pas réussi. Donc, cet outil pour aucun contenu, même s'il ne dit pas de contenu et il pourrait ressembler à une réponse négative si vous connaissez les verbes restants et ce qu'ils signifient ADA risque plutôt. Et ce qu'ils veulent dire, vous verrez que cet outil est en fait une bonne réponse. Donc, ce que nous obtenons, ce que nous faisons dans cette méthode de suppression est l'endroit où le trouver. Si c'est nul, alors nous, si ce n'est pas, non, désolé, alors nous le supprimons et ensuite nous enregistrons les changements, puis retournons. Pas de bons résultats. C' est à peu près ce que nous sortons de la boîte pour notre contrôleur. Maintenant, comme je l'ai dit, c'est assez simple d'aller de l'avant et érafler ce genre de contrôle pour tous les autres récupérés pour moi. Donc je peux y aller et le refaire pour nos mannequins. Je peux le refaire pour les véhicules. Encore une fois, refais-le pour tous. Le problème, celui qui arrive quand peut-être il y a certaines personnalisations qui doivent être faites. Lors de l'enregistrement des modifications, je peux vouloir faire quelque chose de différent. Ou d'autres opérations de base que je pourrais vouloir inclure à 1 et ne pas inclure. C' est un autre point. Il y a certaines choses qui rendent la maintenance difficile. Comme notre obligation se développe lorsque nous utilisons simplement l'alt off the box code, comme vous le voyez ici. Donc, ce que nous voulons dans la leçon suivante est d'implémenter un modèle appelé unité de travail, où nous résumons ceci, toute cette opération de base de données du contrôleur directement. Nous n'interagirons pas directement avec la base de données du contrôleur, mais nous allons mettre une autre couche entre les deux qui nous permet d'orchestrer ce qui se passe, finit au niveau Nitobi HIS. Tu sais, c'est un peu plus minutieux et plus génériquement. Donc, ne pas difficile de taper fortement toutes ces choses tout le temps. Et puis nous pouvons voir où la maintenance peut devenir beaucoup plus facile à long terme. Donc je ne suis pas de celui qui a éraflé un autre tout de suite. Je vais aller de l'avant et mettre dans l'unité de travail, puis nous pouvons érafler, arrêter et mettre en œuvre la fonctionnalité de l'unité de travail dans ces moments. 19. Appliquer l'unité de travail: Hé les gars, bienvenue. Dans cette leçon, nous allons implémenter le modèle de codage populaire appelé unité de travail. Sachez, avant d'aller dans l'unité de travail Potter et je voulais juste souligner que pendant que je vais vous montrer le modèle et alors que je ne vous encourage à apprendre ce modèle, ce spotter et peut-être pas nécessairement être nécessaire pour vous sur votre contextes. Parce que comme nous l'avons dit, et nous avons déjà établi, nous pourrions facilement en quelques clics, il suffit de générer le contrôleur qui a déjà une connexion à la base de données et nous permet de manipuler les données, smoking données, tout de la base de données et de notre application en conséquence. Donc, dans votre contexte, vous n'avez peut-être pas besoin d'aller aussi loin que l'implémentation de ce type de modèle. Cependant, lorsque vous pensez à la capacité d'échelle et à la maintenabilité, à la lisibilité du code et à ne pas répéter certaines bibliothèques critiques partout. Et avoir à faire trop de changements à chaque fois que vous voulez faire une mise à niveau ou une modification, puis vous commencez à penser aux modèles. Donc, mon arme de choix en ce qui concerne l'accès aux données, modèles seraient l'unité de travail car elle permet une implémentation très générique des opérations de base à travers plusieurs types de classes sans avoir à être trop spécifique avec la citation. Plus votre code est spécifique plus vous devez faire de maintenance lorsque quelque chose doit être changé. Donc, quand vous pouvez le garder générique, alors c'est bon. Donc, nous allons implémenter le référentiel générique Potter et ainsi que les unités de pots de travail sont. Et en plus de ça. Alors, allons y entrer. Donc, pour cela, dans le projet serveur, je vais créer deux nouveaux dossiers. Donc, je vais en créer un et je vais l'appeler dépôt I, qui va stocker les interfaces. Et puis j'en aurai un autre. Je vais juste copier et coller et renommer que puis est allé au dépôt d'appel. D' accord, donc nous avons deux dossiers, un pour stocker les interfaces, un pour stocker les implémentations concrètes. Donc la première interface que je vais avoir est la, est notre classe. Je vais juste le créer en tant que classe sans goning pour ajouter un référentiel générique. Donc, vous pouvez dire classe ou interface. Si vous faites l'interface, n'oubliez pas que je dois le changer en public. Si vous faites la classe, alors rappelez-vous que vous devez le changer de l'interface en verre. Donc, j'ai généré juste faire la classe et puis le changer parce que parfois j'oublie l'interface publique de toute façon. Bon, alors parlons des génériques maintenant si vous êtes nouveau dans le C-Sharp, peut-être sept ou ça, des génériques ont été introduits. Et j'ai générique me permet de spécifier, ne sont pas difficiles à spécifier ou autre nom de classe. D' accord, donc je veux que ce dépôt ait des fonctions qui me permettront d'interagir avec plusieurs classes. Et quand je dis classe, je veux dire ces modèles de données, non ? Donc, ce référentiel générique, il va prendre une clé de type T. Et puis je vais spécifier que t va représenter notre classe, signifie que ça ne peut pas être autre chose que le Dr classique a trouvé la meilleure interface Darren de coup ou N'importe quoi, vous testez la vitre arrière. Ensuite, à l'intérieur de cette interface, je vais spécifier une fonction de carburant, non ? Alors je vais le faire. une fonction qui va me permettre d'obtenir, d'accord, et je l'ai juste tapé dire que vous pouvez faire une pause, réplique son seul, non ? Mais ensuite je vais expliquer chaque ligne de toute façon. Et c'est vraiment juste une méthode avec tous les paramètres que je viens d'écrire la ligne parce que je ne voulais pas aller trop loin de l'écran. Donc j'ai une tâche. Nous retournons une liste Ion de type T. Donc T, ce générique, quel que soit le type de données transmis, c'est le type que nous allons faire, c'est le type de données sur lequel nous allons nous concentrer. Lorsque cette méthode est exécutée. Il appellera la méthode get all. On ouvre les parenthèses, on prend Parramatta numéro un, qui est une expression, non ? Ce qui est vraiment juste une expression lambda. Je vais aller de l'avant et inclure ça. Donc, j'avais pris une expression lambda comme une expression métallique nue, où prendre une requête ordonnable comme paramètre, puis une liste de chaîne appelée include. Donc, nous pouvons vouloir accéder à tous les paramètres. J' ai toujours vu que nous avons des relations différentes entre nos tables, non ? Il se peut donc que nous voulions obtenir toutes les réservations et continuer à inclure tous les détails des véhicules et du client par réservation. Nous devrions donc nous assurer d'inclure les données supplémentaires. Et j'ai mentionné plus tôt que ce genre de jointure intérieure implicite est disponible pour nous par le biais de la droite. Ensuite, nous avons une autre tâche. Et remarquez que j'utilise des tâches. C' est donc une partie de la programmation asynchrone. Nous verrons plus de cela quand nous mettons en œuvre les méthodes, nous avons une autre tâche de type T. nous avons une autre tâche de type T. Et on comprend comment on a encore cette expression. Donc le même type d'expression, mais celui-ci n'est pas nullable. Donc celui-ci dit que vous n'avez pas à passer une expression. Si vous passez à celui-ci, si je comprends, ceci représente une entité, alors vous devez me dire laquelle vous voulez. Donc tu dois me donner l'expression, d'accord ? Et puis nous autorisons la liste des inclusions aussi. Et puis d'autres méthodes incluront et d'autres les mettront là et vous guideront à travers eux. Ou insérer une entité T. Droit ? Donc, lorsque nous voulons ajouter à la base de données, nous appelons notre méthode d'insertion. Nous pouvons insérer une liste d'entités si le besoin se présente. Nous pouvons en supprimer un en fonction de l'ID. Nous pouvons supprimer notre bossing de plage dans tous ceux que nous voulons supprimer. Et puis nous avons mis à jour l'entité t. D' accord, donc c'est notre référentiel générique. Non, nous devons avoir la classe concrète pour notre référentiel générique. Donc, nous allons passer au dépôt, pas au dépôt ire en ce moment, mais le dépôt va ajouter une classe. Et c'est en fait un système de classe. Où vous donne ce même nom juste avec tout le référentiel générique I0, I0 et ensuite référentiel générique, nous cliquons sur ajouter. Et puis nous devons laisser celui-ci aussi être générique. Et il va hériter du dépôt générique I. Bien, lequel est bien sûr de type T ? Désolé, ai-je construit par inadvertance ? Et puis nous faisons la même chose où nous disons où t est verre. Je vais juste copier cela parce que nous voulions juste être un très explicite, mais alors j'ai besoin d'inclure le Conseil de référence manquant qui, après avoir inclus la référence manquante devra implémenter l'interface. Alors allez-y et faites ça. Et puis vous verrez qu'il est généré tous les poêles de la méthode point correspondent aux méthodes que nous avions tous alignés. Bon, alors allons travailler dans notre référentiel générique. Pour cette section, nous devons également injecter notre contexte de base de données. Initialiser notre ensemble de bases de données à n'importe quel type de données est passé à St. Donc, je vais créer mon propre champ privé local en lecture seule contexte DB application. Donc, après ce contexte nul, rappelez-vous que point représente nos connexions à la base de données incluent l'obligation de référence manquante sur le contexte DB, et je vais juste appeler celui-ci sur les contextes de partition. D' accord. En plus de cela, je vais initialiser un autre privé en lecture seule où j'ai db sit. Ce mot clé vous sonne une cloche et le téléviseur est de type T. Parce qu'une fois de plus, je ne sais pas ce qu'il va être à un moment donné. Je fais cela aussi générique que possible et je vais appeler cette base de données de soulignement. J' ai donc besoin d'inclure une référence manquante ici. C' est très bien. Et puis j'ai besoin d'un référentiel générique au format constructeur afin que je puisse écrire le CTO du raccourci clavier pour stub deux fois et il génère cet arrêt du constructeur pour moi et ensuite j'ai besoin d'injecter. Donc, de la même façon que nous avons vu que la bande passante du hub d'injection rend le contrôleur là il est. Ce même type d'injection nous avons besoin d'injecter cet objet dans le référentiel générique. Et puis je suis littéralement juste copier sur les lois de base est la même citation est le même concept que nous avons besoin d'initialiser ou copie locale à l'objet injecté. Et puis après cela, je vais initialiser mon champ RDB objets DB pour être jeu de points de contexte de type T. Donc, en d'autres termes, DB sait quand représenter l'ensemble de base de données connecté de type T, quoi que ce soit t pour être à l'époque. C'est une méthode. Donc, vous mettez dans votre département de l'environnement fait et fermer. C' est le sien ou réglé pour le générique ou le bluster. Donc, chaque fois que ce dépôt va être initialisé, va injecter cette connexion à la base de données. Et puis il doit être initialisé par rapport à une classe particulière. Alors ça va dire, OK, je suis connecté à l'écurie. Et puis nous allons voir quand ces méthodes sont appelées, sont appelées à l'action. Que devrait-il se passer ? Commençons donc par les simples. Supprimer est très simple, est en fait très, très simple parce que ce que nous devons faire un est de trouver les entités. Je dirai entité var, ou je peux dire que la carte rect var est égale à. Et puis nous allons commencer à une programmation asynchrone ne peut pas dans un peu. Donc, quand nous avons, quand nous travaillons avec Entity Framework Core, ils nous donnent un tas de méthodes asynchrones parce que si vous dites juste db dot, vous commencerez à voir ajouter asynchrone, Iberian JS sync. Tous ces éléments, la plupart d'entre eux ont une version asynchrone pour eux. Chaque fois que nous allons faire quelque chose qui est asynchrone, nous devons précéder cet appel avec le mot-clé wait. Bon, donc je veux trouver un évier, et je ne trouverai pas quand je trouverai un évier, pas vrai ? La différence entre les deux est que asynchrone signifie que D fonctionne un peu sur des threads différents. L' obligation sur touffe va décrocher en attendant les résultats de ces appels de fonction. C' est donc ce que l'AC, c'est un avantage que la programmation asynchrone apporte. Donc, je vais juste dire trouver un évier et ensuite trouver attend quelques objets. Eh bien, je vais passer la carte d'identité. Donc, comme nous l'avons vu dans le contrôleur de portée principal est le même genre de logique, exact ? Dans la suppression, il a dû trouver l'enregistrement. Et puis ça va appeler ça supprimer, non ? Mais alors nous ne traversons pas autant d'étapes essai dans le contexte qui rend cela, nous ne sommes pas si explicites parce qu'ils sont génériques. Donc la BERD incarne tout ce qui a été passé, Trouvez-le stockage asynchrone et carton rouge. Et puis je vais dire sur le point db de score, supprimez ceci requis. Donc, il n'y a pas de fonction asynchrone correspondante à supprimer. Donc, c'est bien. Je vais juste déplacer l'utilisateur. Et je vais dire supprimer le dossier. Non, remarquez que j'ai lu des lignes. Un. J'ai besoin d'oh, j'ai dit que nous devons précéder ça avec attendre. D' accord. Donc nous devons dire, oh, il est remarqué que les points disparaissent, mais ensuite celui-ci apparaît parce qu'une fois qu'on fait une attente, la méthode doit être un évier. Donc, une fois que vous faites un appel asynchrone et que vous allez devoir utiliser le mot-clé wait. S' assure que la méthode effectuant l'appel a le mot-clé async. Notez que les deux s'allument quand je mets en surbrillance un seul. D' accord, donc on va avec supprimer. Supprimer la plage est bien, moins de lignes de code parce que j'aime voir est honnête score db point supprimer la plage. Et ils suppriment la plage attend un paramètre, une collection de tout ce qu'il devrait supprimer, qui passaient sous la forme d'entités. D'accord. Donc c'est tout pour supprimer. Un. Comme je l'ai dit, j'ai affaire à un fruit à faible pendaison. Donc celui-là peut être verbeux, ce gang se moque. Donc, nous allons sauter vers le bas pour insérer dans la chirurgie dans les mises à jour générales sur là nous pouvons revenir en arrière. Donc, insérer est relativement simple. Tout ce que j'ai à dire pour insérer est un poids d, b, ajouter async et entité. Et encore une fois, si on utilise un poids, je dois m'assurer que la méthode est un évier. Si nous faisons la plage d'insertion, nous avons un code similaire sauf que c'est le sang de chaque centimètre qu'on a une vue. Donc à portée et encore une fois, un évier. D' accord, et puis un peu, ce que nous devons faire ici, donc pour la mise à jour de ce côté, ce qu'il a fait, c'est que j'ai trouvé ou qu'il vient de dire que l'entropie change d'état à modifié, accord, puis enregistrer les changements, et C'est très bien. D' accord ? Ce que nous pouvons faire de ce côté-ci, mais ce que je vais faire à ce sujet est légèrement différent. Eh bien, c'est une ligne supplémentaire où je vais dire soulignement DB dot-dot touch entité. Et la raison pour laquelle nous faisons cette partie d'entité attachée est que lorsque nous faisons le get, ils obtiennent tout où se détachent de la base de données. Donc, fondamentalement dans mix, chaque fois qu'une requête est ne sont pas ces entités sont lancées les nôtres, elles sont toujours attachées, la base de données surveille toujours tout ce que cet objet traverse, qui peut avoir des conséquences sur les performances lorsque vous avez des milliers d' enregistrements qui dans différents marchés ont tendance à garder un suivi à tout moment en mémoire. Donc, ce que nous allons faire, c'est quand nous, quand nous faisons le get, nous allons dire pas de suivi, ce qui signifie qu'ils sont détachés. Donc, quand je suis sur le point de faire une mise à jour, la réattacher cette entité. Donc, la base de données à la collection. Alors, il commence à le camionner. Et une fois qu'il est camionneur, non, je peux voir l'entrée de l'entité. Quelle que soit l'entité qui est notre entrée de point de contexte, l'entité passée dans cet état est égale aux entités, états modifiés, ce qui est la même chose qui se passait ici. Encore une fois où être générique afin que nous ne spécifions pas micro parce que je ne sais pas si c'est sur moi, donnez-lui un modèle. Si c'est un vaguement ressemblant peut-on ne pas le savoir. C' est pour ça que nous sommes très vagues avec nos noms ici. Je l'appelle m entités par opposition à moi peut modéliser et tout noeud spécifique . Laissez-nous revenir un peu en arrière et aller à notre Git et obtenir tout. Alors aller à, obtenir est plus facile. Commençons par Git. Donc, la première ligne à obtenir est d'initialiser une requête. Bon, donc je interrogeable thé, et je interrogeable est un type de données très spécifique, ce qui signifie, qui représente fondamentalement le premier type de données que vous obtenez lorsque vous interagissez avec la base de données. Et à partir de là, vous pouvez effectuer certaines opérations plus efficacement sur les collections de bases de données que vous ne pourriez le faire si vous aviez une liste stockée que je énumérable ou autre chose, n'est-ce pas ? Donc, nous initialisons notre requête de ce BB. Donc ici, tous les enregistrements sont chargés en mémoire. Et puis je vais voir si ça inclut. Donc nous aurions passé des inclusions. Incluts n'est pas égal à null, ce qui signifie que quelque chose a été envoyé dans cette liste. Droit ? Ensuite, nous voulions voir si pour chacun, je peux juste faire ça et dire baignoire, baignoire, var. Je vais juste dire, disons l'accessoire. Utilisons un mot prop dans La liste des inclusions. D' accord, alors nous voulions voir la requête qui représente la connexion à la base de données. Les requêtes de base de données sont-elles égales aux points de requête inclus ? Et puis je vais juste sauver l'accessoire. Donc c'est une chaîne non perturbée, tout ce dont vous avez vraiment besoin est le nom de ce qu'il devrait inclure, donc nous allons sceller qui fonctionne plus tard. Pas de problème. Et puis après tout cela, vous remarquerez que c'est, est lu. Nous devons retourner un point de requête. Et puis je voulais voir plus de suivi. Donc voici où je vois détacher de la base de données. Mais je veux que vous retourniez le premier notre valeur par défaut et je vais choisir la version asynchrone de cette méthode. Et puis je passe l'expression. Très bien, donc si vous n'êtes pas familier avec les expressions lambda, eh bien, expression lambda, l'expression lambda est ce qui aurait été configuré ici. On le contrôle, non ? Donc, vous pouvez voir sur certains experts lambda bluff ici dans ce micro existe méthode où nous disons des contextes dot, point n0, et alors c'est une expression lambda. C' est donc ce genre d'expression ou ce genre de valeur qui passera dans cette méthode. Et puis il effectuera cette opération. Droit ? Bien sûr, j'ai vu un évier ici. Donc ça veut dire que j'ai besoin du mot clé, j'attends. Et si j'ai besoin du mot-clé o h, cela signifie que je dois faire de ma méthode ici un évier. On y va. D' accord, donc c'est l'enregistrement get Juan, Juan, à droite, basé sur ces expressions lambda. Donc, il pourrait être par ID, il pourrait être par nom égal b par année. Je veux dire, je ne sais pas. Ce pourrait être le véhicule de Vin vivo en regardant au-dessus de ICO de Vin, vous savez, assurez-vous juste que nous mettons l'expression appropriée pour nous assurer que nous récupérons la valeur que nous recherchons, n'est-ce pas ? Quatre devient tout nul. Nous commençons en fait avec le même moins de lignes de code. Donc j'ai besoin du, eh bien, j'ai besoin d'abord de la requête, non ? Et puis je ne suis pas sûr si je vais arriver à une expression, donc je ne veux pas aller de l'avant et l'essayer, jouer une expression, surtout si elle est nulle, cela me donnera une erreur. Donc, je vais voir si l'expression n'est pas nulle. Essaie encore ça. Si l'expression activée, si elles vont s'exprimer n'est pas égale à null, alors je veux filtrer la requête. Rappelez-vous donc que cela représente toutes les tables de la base de données. Donc, je vais dire que la requête n'est pas censée être filtrée par l'expression. Donc nous n'avons pas tous ceux dont nous savons que nous n'avons pas besoin si une expression a été donnée. Donc si on m'a dit de me donner tous les véhicules tout ce bloc, alors on passe ça pour me donner tout le noir. Donc, tous les véhicules qui filtreraient vers le bas à ceux qui ne sont que bloquer. Et puis. Basé sur le champ. Et une fois que nous faisons la même chose inclut, donc je vais juste copier ce bloc ici. Donc, s'il inclut, alors nous allons de l'avant et incluons les détails dont nous avions besoin. Et puis nous avons aussi l'ordre de laisser tomber tous les services o pour que nous puissions nous souvenir d'eux. Donc nous avons l'expression, puis nous avons l'ordre BY. Donc, après avoir inclus, alors nous pouvons passer sur commande. Donc, nous allons dire si l'ordre par n'est pas nul, alors ce que nous voulons est Query être égal à. Et puis nous avons cette méthode ordre par requête, n'est-ce pas ? Donc les rabbins aiment vraiment une méthode et ça va juste les réorganiser en fonction de ce qui a été spécifié. Ensuite, à la fin de tout cela, nous voulons juste retourner des points de requête. Une fois de plus les détacher de la liste des points de base de données. Et je vais rencontrer cet asynchrone, si c'est une synchronisation, j'ai besoin d'attendre. Et si j'attends, alors ma méthode doit être un évier. D' accord, et là, nous avons un référentiel générique qui semble bien jusqu'à présent ? Maintenant, la chose avec le référentiel générique, alors que c'est un générique, oui, nous allons toujours devoir l'instancier chaque fois où il est allé interrompre avec cette table différente. qui signifie que si dans une loi de contrôle nous pourrions avoir besoin d'interagir avec plusieurs tables, nous devrons l'instancier plusieurs fois. Donc je vais mettre un autre niveau d'obstruction. Et une autre chose qui manque est la Sauvegarder les modifications. Donc, un autre niveau de travail va entrer. Et je suis allé implémenter cela dans le dossier du dépôt ire. Et je vais créer une autre interface. Alors laissez-moi juste créer ceci comme une interface est le temps, et je vais l'appeler, j'ai besoin d'une fourchette. Et encore une fois, n'oubliez pas de le rendre public. Maintenant, cette unité de travail i, je vais juste hériter de jetable parce que ce que nous voulons arriver, c'est que quand vous finissez d'utiliser les unités sont la force, il meurt en mémoire. Nous ne voulons pas la persister à l'altérer. Donc, c'est bien. Mais alors ce que nous pouvons faire dans cette section, null est en fait un peu créé comme notre registre pour toutes les implémentations potentielles du référentiel générique de sorte que nous n'en aurions qu'un seul ferait une seule fois assez bien pour faire jour chaque fois que vous avez à interagir avec plusieurs tables aura seulement comme je m'inscrit une fois. Donc, je créerais un référentiel générique ij pour moi. Par exemple, donnez-lui son nom. Donc je vais l'appeler mélanger des gens. Si vous, si vous avez un oeil à ce modèle, sinon il peut voir certaines personnes l'appeler qui rend le dépôt à être très explicite. Mais une fois de plus, ce n'est que le point de repère NIMA. Mais la classe est ce qui est vraiment important. Donc je vois implémenter un référentiel générique pour notre micro, non ? Et rappelez-vous la classe requise du référentiel générique, Cool, puis mélanger. Donc, chaque fois que nous appelons un mélange de mots dur IU, il va mettre en œuvre automatiquement cela. Et il va automatiquement passer par cette connexion à la base de données. connectez cette table. D' accord, donc on peut le faire pour toutes les tables vraiment. Donc on peut dire modèle. Encore une fois, voir le véhicule, tous, n'est-ce pas ? Lorsque nous ajoutons une nouvelle table, je devrai avoir un nouveau dépôt. On va juste l'ajouter au registre. On n'a pas à revivre tout ça chaque fois qu'on a une nouvelle table. Donc, vous pouvez aller de l'avant et les ajouter tous. Mais pour l'instant je vais travailler avec ceux que je viens de travailler avec moi. Activez ces besoins parce que nous avons le contrôleur de mixage, donc je vais juste travailler avec moi et vous montrer comment ce refactoring va se produire. D' accord, donc après ça, non, nous avons besoin d'un cours concret pour nos unités hors travail. Je vais également implémenter la sauvegarde de la tâche. Donc, cela va représenter nos Save Changes et n'importe quelle autre opération sur elle est que nous pourrions avoir besoin d'effectuer un jumelle où économiser. Permettez-moi donc de créer la classe concrète ni pour l'unité de travail. Donc, je vais retourner au dépôt, ajouter une nouvelle classe, et je vais annuler chaque unité. Donc, je unité de travail et les unités sont fork créer que cela va hériter de IU et c'est tout fourche. Et puis bien sûr, de la même manière que tout autre hérité, nous devons aller de l'avant et implémenter ou interface. D' accord, donc ici, il va essayer d'initialiser le mix générique, droit à la méthode de disposition créée parce que nous avions l'héritage de la disposition, et ensuite nous avons la méthode de sauvegarde en cours de génération. Donc à partir d'ici, je vais faire quelques choses. Je vais avoir le même genre de lecture seule que nous avions pour le contexte. Quelqu' un pour créer cette référence de contextes DB d'application ici. Et puis je vais aussi avoir une version privée de ce dépôt public pour moi x. alors laissez-moi juste faire ça. Donc, je fais privé en lecture seule. J' ai conçu le micro du dépôt, mais alors c'est privé si complètement dans ce mot-clé ou cette convention de nommage plutôt que je vais l'appeler mix, non ? Je vais aussi avoir besoin d'un constructeur. Alors c bar, d'accord ? Et ce constructeur, si je m'attends à l'utiliser, alors je vais certainement devoir injecter dans l'objet, comme je l'ai fait avant cela. Et allez-y et instancier, nous l'initialisons à l'injecté. On y va. D' accord, c'est tout cela qu'on appelle l'injection de dépendance, encore une fois, la procédure standard et il est très facile à travers dominate core. Alors concentrons-nous avant de me concentrer sur la flèche, concentrons-nous sur ce qui se passe avec la disposition, sur ce qui se passe avec la Sauve. Donc, dans cette pose, ce que je vais faire est de dire, premièrement, de me trouver le contexte et d'en disposer. Donc, quelle que soit la copie locale du contexte que j'utilise lorsque l'unité de travail est faite son travail, il suffit de l'éliminer. Et puis je vais aussi appeler la collecte des ordures et voir suppressive, analyser cela. Donc ces unités d'objet de travail le tuent en mémoire, mais c'est à peu près ce qui se passe là-bas, non ? Pour l'opération de sauvegarde, je vais dire, j'attendrai, contextes Enregistrer les modifications asynchrones. Bien sûr, c'est nos poids, donc j'ai besoin d'un évier. Sachez que ce qui se passe ici, c'est que nous pouvons, nous avons l'occasion de mettre plus de choses dans notre opération de sauvegarde quand nous avons cette méthode, n'est-ce pas ? Parce que nous avons où nous voulons faire la dernière mise à jour et créé par un toutes ces choses. Imaginez si nous ajoutons tous ces contrôleurs, juste construits comme ça. Et puis à chaque fois que quelque chose se passe, pas comme une mise à jour. Je dois me souvenir de ça. Je dois dire que les points doux mettent à jour la date et l'heure mise à jour, aucun point de bys bêta égal à celui qui a été connecté. Et je dois le faire religieusement, non ? Et souvent faire ça partout. Si j'ai dix contrôleurs pour le faire dans les contrôleurs Alton, si quelque chose change, un champ change, les changements de nom sont quelque chose après. N' oubliez pas de le changer dix fois. Lorsque nous avons la possibilité de mettre tout cela dans un seul endroit, cela apporte un avantage majeur parce que je peux ici personnaliser cette méthode pour effectuer ces ajustements avant de sauvegarder les changements. Et donc je le fais une fois. Et c'est le pouvoir d'un modèle. Mais nous ne sommes pas encore prêts à y arriver. Ce que je vais faire pour finaliser cette vidéo est de vous montrer ce qui est nécessaire pour cette ligne. Donc, pour la méthode publique et le moyen facile de faire cette initialisation est d'utiliser une expression lambda. Et puis nous l'utiliserons. Et voir sur le mix de partitions était la version privée. Score fait que spreaded fors sur ce. Et puis nous allons juste voir si ce n'est pas nul, alors il devrait être égal à. Donc, cet opérateur signifie simplement s'il est nul, alors faites-le égal à. Et puis nous allons lancer un nouveau dépôt générique de type micro dans cet objet, non ? Et puis nous allons passer dans le contexte qui a été initialisé ici. D' accord, donc c'est à quoi ressemble ce morceau de code. Et ça ne devrait pas être des apologistes en lecture seule. Donc, cela ne devrait pas être en lecture seule. Et cela veut dire qu'il a besoin, ok, ok, ok, alors laissez-moi, laissez-moi revenir en arrière et cartons donc des erreurs. Donc, quand nous mettons le savon dans le registre des unités i offertes, cela ne devrait pas être Gets it, cela devrait juste être obtenir. Alors enlevons ce set, non ? Ceux-ci ne devraient pas être obtenir des ensembles. J' ai créé toutes ces images zones alors à partir de no. Très bien, donc ça devrait être juste me prendre n'importe où, juste obtenir cet objet. Et puis le nœud public va récupérer cet objet et le mettre là. C' est à peu près à quoi ressemble notre unité de travail. Maintenant, quand nous reviendrons, nous verrons comment vous refactoriser notre contrôleur make pour profiter de l'unité de travail et l'exécuter à travers quelques tests. Ensuite, nous pouvons implémenter tous les objets de domaine que nous allons avoir dans notre programme. 20. Les contrôleur de Refactor existants pour utiliser l'unité de travail.: Bon, bienvenue. Maintenant que nous avons nos unités de configuration de travail, ce que nous voulons faire est de commencer à refactoriser nos contrôleurs. Mais avant que nous puissions laisser nos contrôleurs interrompre l'unité de travail, nous devons laisser le Bootstrap ou savoir qu'il s'agit d'un type de service injectable dans notre application et tout ce qui peut vouloir l'avoir redouté. Donc ce que nous devons faire est d'aller au démarrage. Et puis à droite sur les genoux, le serveur d'identité publicitaire, JWT, Je vais ajouter une ligne, ajouté des unités i transitoires hors unités de travail 04. Nous pouvons aller de l'avant et inclure les références manquantes en conséquence. Et ce qui se passe, c'est que nous faisons, je voudrais tendances Indianola, je voudrais transitoire, ajouter portée et ajouter Singletons. Singleton signifie qu'il va être un encens pour l'ensemble de l'exécution offre de votre application. Sculpt signifie que ça va créer, eh bien, ça va être une instance pour la durée de vie d'un certain ensemble d'actions. Et puis je passerais signifie que chaque action va tourner son propre point sur à peu près. Donc, nous voulons nous assurer que les unités de travail ne sont pas, vous savez, c'est, elles sont uniques à chaque fois. Et bien, nous avons déjà la collecte des ordures, donc dès qu'elle n'est plus nécessaire, elle se débarrassera de toute façon. Donc c'est entier ou unités ou quatre, il est injecté ou se prépare pour l'injection. Donc, un null n'importe où que nous voulions la même chose, vous pourriez injecter des contextes DB d'application ou tout autre service. Je peux savoir injecter mes unités i, donc 4k, donc je vais à l'affacturage Snyder juste ici dans le contrôleur de mixage où je vais dire des unités de travail i. Donc, je ne veux plus interagir directement avec mon contexte. Je veux commencer à utiliser l'unité de travail i comme intermédiaire, non ? C' est aller de l'avant et inclure toutes les références manquantes. Et puis je vais appeler cette unité de travail. Et donc la valeur nulle d'injection ne sera pas des puces de contexte DB obligation. Vous descendez du travail, non ? Et puis l'initialisation suit à peu près le même modèle qu'avec tout ce que nous avons fait qui impliquait l'injection. Notez donc que nous avons l'unité i TO pour remplacer les contextes RDB. Nous avons une foule d'erreurs que nous devons résoudre. Et voyons exactement ce qui se passe. Donc ici, il a dit retourner un énumérable de Mick et il est allé à la base de données, la table, puis converti cela. Donc ça aurait été mené II interrogeable dans une liste. Donc ce que je vais faire ici, c'est dire unités i, donc quatre mélanger. Et puis je peux voir, donne-moi les coups. D' accord. On y va. Non, je reçois une erreur ici et c' est partiellement dû au type de retour par rapport à ce que je retourne réellement. Donc, je vais faire un peu plus que ceux qui ont besoin d'une couleur de base. Et je vais en fait construire tout ce contrôleur la façon dont je me sens plus à l'aise avec ma manette. Donc, je voulais changer cela pour être juste une tâche de type. Les résultats de l'action sur le moment de décoller ce type de données fort. Donc, la tâche désactive tapez les résultats réels. Et puis il s'attend à une forme de HTTP. Réponse à retourner, quelqu'un d'étendre cela un peu. Var mix est égal à, et puis nous avons passé cet appel téléphonique. Et puis je peux voir le retour. Et je voulais bien. Alors rappelez-vous que lorsque nous regardions les types de retour, qui aurait vu l'ancienne clé ou le contenu et ainsi de suite. Donc tout k est une réponse 200 qui me permet de mettre dans les données qu'il devrait retourner si tout va bien et c'est tout ce que vous avez, non ? Donc oui, plus de lignes de code sont loin. Une ligne de code de plus. Mais pour moi, c'est beaucoup plus lisible et c'est plus facile pour moi de le maintenir. Et d'après ce que nous avons mis en œuvre, vous voyez que tout fonctionne de toute façon. Donc, il n'y a rien de mal à changer le code généré tant que vous comprenez pourquoi vous changez et une fois que vous comprenez ce que votre changement dans le proche ou sur la bonne voie. Donc, faisons une opération similaire pour le Get avec le paramètre. Donc la tâche I axone résultats. Je supprime le type de données fort. Et puis ce que nous allons faire ici, c'est voir beaucoup trop dur mélange de points de travail. Donc je vais juste remplacer tout ça. Mais cette fois, c'est un get. Et au lieu de passer la carte d'identité, encore une fois, on aurait pu en avoir quatre, obtenir par carte d'identité. On aurait pu faire quelque chose d'autre, non ? Donc, la flexibilité de l'expression est que nous pouvons mettre dans les experts lambda ici et dire q point. Et puis je peux voir que l'ID est équivalent à l'ID. C' est mon expression lambda. Donc, cette condition va être exécutée comme nous l'avons vu, comme nous l'avons implémenté dans le dépôt générique. Et il va aller de l'avant et retourner ce micro. Et puis ici je peux revenir, ok, avec le micro comme données retournées. Encore une fois, si vous êtes habitué au poignet, à la conception des principes de risque, l'API de repos, au développement, alors tout cela aura du sens pour vous. Si ce n'est pas le cas, alors pas de problème, c'est pour ça que nous sommes là. C' est pourquoi deux points de terminaison ne sont pas seulement quelques-uns à aller. Donc, pour notre mise à jour, les modifications que je vais faire seront sur le score Unit 04 point, fait des points. Très bien, donc à cause du registre, nous pouvons accéder et mélanger directement pour environ 2 qui a dit plus tôt. Eh bien, nous pouvons dire mise à jour et ensuite nous passons juste dans l'entité qui est hors micro, non ? Donc moi, qui est le MIC entrant par le paramètre ici, et nous envoyons tout. Donc, cette ligne de code va être prise en charge dans le dépôt. Donc personne n'a besoin de regarder notre contrôleur et de connaître les secrets sombres de ce qui se passe vraiment. D' accord, c'est cette abstraction. Et puis pour une opération comme celle-ci, lorsque nous avons modifié les données, nous devons appeler notre Enregistrer les modifications. Donc je vais prendre ça vieux et je te verrai quand il sera éteint à quatre points. D' accord. Et puis c'est tout. Alors passons à autre chose. Donc, vous voyez, le refactoring n'est vraiment pas beaucoup, mais pour moi c'est, il y a pas beaucoup de bases de données d'activité lourde qui se passe dans notre contrôleur. Nous voulons les garder légers et clairs autant que possible. Donc, pour le poste, nous voulons que l'unité de travail mélange point et ensuite nous verrons insert, non ? Et ce qu'on insère, c'est le micro. D'accord. C' est asynchrone. Oh, et c'est asynchrone et j'oublie de mettre l'attente, vous voyez une ligne squiggly verte. Donc et puis il y a tous asynchrone qui est prêt à me répondre revenir en arrière et mettre un évier. Et puis à partir d'ici, je vais aux unités SI sont quatre points sauver. Et puis je peux supprimer cette ligne et tout le reste coulera en conséquence. Pour le SAC, une fois de plus, le bouton est là. Cela fonctionne, mais vous n'en avez peut-être pas besoin. Donc je ne te dis pas que tu dois te développer avec ça, mais je te guide dans l'ensemble. Vous pouvez procéder à l'implémentation. Alors que voulons-nous supprimer ? Rappelez-vous que supprimer, supprimer seulement besoin de l'ID, n'est-ce pas ? Donc, ce que nous pouvons faire ici, c'est que vous sortiez du travail, point, point, supprimer, passer l'ID null, où en fait un peu de contournement certaines des ticks les plus essentiels que nous voyons ici. Parce que ce qu'il fait est de trouver si l'enregistrement existe, si ce n'est pas le cas, alors il va revenir, pas téléphoner. Et puis, bien sûr, ils voulaient enregistrer des changements après ça. Droit ? Donc juste réduit tout cela en plus comme deux lignes de code. Mais alors, comme je l'ai dit, ce chèque est un peu essentiel. Donc nous pouvons probablement faire ce contrôle où nous disons micro. Donc on va prendre le micro. Et puis rappelez-vous qu'on a déjà fait ça quelque part ici où on a fait ça. Donc on peut faire la même chose se préparer. On dit juste de me donner le micro. Si le micro est équivalent à null, retournez NOT_FOUND auto comme nous continuons avec cela. Et puis on peut enlever tout ce qui est là. Et c'était C. Et puis nous avons cette méthode qui dit « Faire existe âme ». Vous pouvez implémenter dans l'unité de travail C. Lorsque vous passez dans ID, vous vérifiez le cas échéant. Mais nous avons déjà cette méthode qui va vérifier si quelque chose est là quelqu'un pour l'utiliser et remplacer cela existe quelque part pour dire que var me eq est égal à cela, euh, et alors il devrait retourner un booléen. Donc, je vais dire que le retour est équivalent à null. D' accord ? Notre âme ici, c'est asynchrone, la méthode ne l'est pas. Donc, ce que je peux faire est en faire une tâche asynchrone qui renvoie un C booléen, u, que je sais que tout le monde est heureux. Et puis bien sûr, l'appel de méthode doit avoir l'excès de poids ici. Donc c'est tout, tout sorte de flux, non ? Donc c'est juste le reflet pour les micros. Si vous aviez généré, ils seront contrôleurs et il peut aller de l'avant et faire ça. Sinon, nous allons toujours le faire ensemble de toute façon. Mais prenons ce contrôle refactored pour un tour. Notez que nous utilisons des unités de travail. Et vérifiez juste que cela fonctionne de la part du facteur. D' accord, donc je vais commencer par une demande get. Donc, si j'envoie alors nous obtenons tous les véhicules ou désolé, tous les modèles ou le mélange ou autre dans le système. Donc, vous voyez, ça marche, ça marche toujours. Cela rend notre citation terminée à plus propre et la segmentation est en quelque sorte en place. Si nous voulions créer, c'est le même principe. Je peux aller à l'école ici et voir Send, et puis ça crée une nouvelle voiture fictive. Les enfants travailleront de la même façon. Tout va l'indiquer. Voyons donc ce qui se passe lorsque je supprime un ID qui n'est pas là, provoque la suppression. Nous avons déjà supprimé le mélange avec l'ID pour nous permet de voir ce qui se passe. Voir 404 Pas de téléphone. Si je le déplace à cinq, ce qui est le mannequin qu'on vient de créer. C' est un contenu nul, donc tout fonctionne toujours. Aucune chose que je voulais souligner, c'est que quand nous créons notre, vous savez, quoi que ce soit, nous ne nous attendons vraiment pas à obtenir ce truc de tous nos clients, d'accord, donc créé par grand créé tout cela ne devrait pas être empêché par le client et le facteur devrait vraiment imiter ce qu'un client ferait. Donc, dans cette situation, si je voulais créer cette voiture DO make, quoi que ce soit si MCAR ID cherche, et alors ces champs devraient vraiment être remplis automatiquement, non ? Donc vous voyez ici null, je ne sais pas qui a créé. C' est je ne sais pas quand il a été créé ou mis à jour ou quoi que ce soit. Je ne sais rien de tel. Nous devrions donc vraiment mettre cela en œuvre. Non, j'avais souligné que ce que nous aurions à faire pour faciliter quelque chose comme ça serait que sur la mise à jour, qui est la mise à jour, je devrais me voir pointer, créer nos données numériques est égal à cela. On ne veut pas faire ça. Encore une fois, nous ne voulons pas avoir à faire cela à travers dix contrôleurs sont chaque fois que nous arrivons à notre contrôleur, nous devons le faire contre l'entité manuellement. Donc, ce que nous allons faire est d'implémenter dans notre opération sécurisée la possibilité d'obtenir les contextes HTTP et de modifier les objets avant qu'ils ne deviennent C. D'accord, alors concentrons-nous sur l'ajout des actes. Donc, le scénario est que lorsque je crée quelque chose que D a créé et que les données mises à jour devraient être les mêmes. Cependant, quand j'ai fait quelque chose à cette date, mis à jour et mis à jour par devrait changer. D' accord, donc ce qu'on veut faire, c'est cette opération sûre, on va sauver Var. Je vais l'appeler entrées est égal pour m'obtenir le contexte dot changer les camionneurs. Parce que rappelez-vous que j'ai dit qu'une fois que les données arrivent, ou je veux dire, une fois que vous créez quelque chose, une fois que nous sommes en orbitant quelque chose, il ne suit pas l'objet. Une fois que nous l'avons récupéré, parce que nous avons dit que le suivi du Nord, il n'y a pas de suivi. Donc la structure du hasard va vraiment voir d'accord. Tout ce que je fais du camionnage, donnez-moi toutes les entrées et c'est une méthode. Et puis je vais juste le dire point à Nous sommes, donc je vais exécuter une expression lambda sur, sur la base de données ou la requête pour voir où l' expression Lambda Q état point est équivalent à NTT State, qui est vraiment une énumération. Donc je n'aime pas avoir toute cette qualification complète. Il y a des entités théâtre et inclure la bibliothèque manquante où les entités, états point modifié. Ou je vais passer à la ligne suivante pour que ce sont l'état q point. Donc l'état qui est ce n'est pas le cas. Alors rappelez-vous quand nous avons fait la mise à jour, qui est l'état, l'état entité de l'outil droit DOT modifié. Donc je peux voir point modifié, notre état d'entité est mort point. Donc ça veut dire qu'il est sur le point d'être créé de l'art. Il a été juste ajouté outil que le suivi, ou du moins en ce qui concerne, il dit peu d'identifiant pour trop. Ensuite, je vais les parcourir tous. Donc, je voulais dire pour chaque entrée dans ce qui est revenu dans les entrées. Parce que la réalité est que lorsque nous appelons c, Si nous pouvions avoir touché beaucoup de choses différentes , à droite, nous avons tout update_many qui aurait pu modifier sur la marque et le modèle. Et nous essayons de faire une opération de sauvegarde et nous ne savons pas. C' est pourquoi nous recevons juste de toutes les entrées. C' est notre bateau à sauver pour m'obtenir tous les résultats sont modifiés et tous ceux qui sont ajoutés. Et puis pour chacun d'eux, je veux changer leur modifié et le modifier par, à droite, nous ne sommes pas prêts pour le modifié en se concentrant sur la rétine de données. Donc, ce que je devrais faire est de voir les points d'entrée et ensuite dire entité. Mais alors le problème est que les entités très génériques. Il ne sait pas ce qu'il ressent, c'est, il ne sait pas, non ? Donc, l'un des avantages avec ceux qui utilisent cet objet de domaine BCE est que nous pouvons toujours coûter et entité dans cet objet de domaine de base, qui nous donne ces frais d'audit que nous savons ce que chaque champ, chaque objet de domaine unique sont autorisés. Donc, je peux dire que b est le modèle de domaine ici. Et puis je peux envelopper tout cela entre une grande parenthèse, donc il le verra comme un grand objet du modèle de base de type. Ensuite, je peux voir point mis à jour, données mises à jour. Concentrez-vous sur l'entonnoir est le temps, datetime point néant C. Et puis je vais voir si l'état, donc dans l'arbre. Si cet état est équivalent ajouté, alors il a tendance à obtenir un traitement spécial car en plus d'obtenir le temps de données, il doit également obtenir la menace créée. Donc, je vais copier cela et je vais juste changer ceci en créé, date, date de création. D' accord, donc fondamentalement, je dis que chaque fois l'opération de sauvegarde est faite obtient tout ce qui a été modifié ou ajouté. Et puis pour chacun d'eux que vous avez les données à connaître parce que clairement il est en cours de mise à jour et que l'un d'entre vous a été ajouté, allez-y et remplissez-le donc si c'est en cours de mise à jour, je n'ai pas besoin de mettre à jour la partie ajoutée. Et après tout cela, nous allons aller de l'avant et enregistrer nos changements indépendamment. D' accord, ça ne devient pas plus, beaucoup plus compliqué que ça pour ça. Donc, une fois de plus, ce système de scanner à ce moment-là d' avoir à se rappeler que sur chaque commande, à chaque opération, j'essaie de suivre tout cela parce que juste l'automatise ici. Alors allons aller plus loin et regardons comment nous suivons l'utilisateur. Parce que je suis connecté en tant qu'utilisateur et que je fais mes opérations quotidiennes, je ne sais probablement pas que vous me suivez, donc je ne devrais pas avoir à taper mon nom d'utilisateur à côté de tout travail que je fais lorsque je clique sur Soumettre, vous devriez suivre cela. Je suis celui qui clique sur Soumettre et nos champs d'audit le font. Mais alors comment obtenir les données de la personne utilisant le blazer jusqu'à la base de données ? Eh bien, nous allons permettre l'inclusion de ce que nous appelons un contexte HDTP. D' accord, donc vous savez, je sauve opérationnel, nous mettons dans ce contexte HDTP paramètre, qui vient de notre contrôleur. D' accord ? Parce que nous savons que c'est ce que nous appelons à l'abri. Chaque fois qu'on appelle sauvé, c'est de là qu'on le trouve. Donc, bien sûr, si je le mets à jour ici, je vais devoir le mettre à jour dans l'unité de travail. Donc C-F devrait avoir un paramètre de type contextes HTTP. Alors bientôt revenir en arrière et mettre à jour les contrôleurs en conséquence. Donc, quand nous obtenons les contextes HTTP qui nous donne accès. Donc peut-être le nom d'utilisateur, choses incertaines, un bateau, un contrôleur, donc toutes les demandes qui arrivent. Donc, je peux dire que l'utilisateur var est égal à. Et puis je peux voir l'utilisateur de point de contexte HTTP. On a cette identité de point, nom de point. Donc ça me donne le nom d'utilisateur. D' accord, donc je voulais camionner quel utilisateur a besoin de beaucoup. Eh bien, la voilà. Je sais comment le nom d'utilisateur. Bon, donc je peux aussi voir que chaque fois que quelque chose est sur le point d'être mis à jour, que la mise à jour par est l'utilisateur, non ? Et puis le CreatedBy est utilisateur. Et puis à partir de notre contrôleur, je vais devoir m'assurer que chaque fois que je sauve, je passe dans ce contexte HTTP point. Et puis je dois dire, eh bien, oui, ce contexte HTTP point. Donc, c'est vraiment suffisant. Je pense que je n'ai même pas besoin du mot-clé qui est réellement suffisant. On y va. Donc, je viens de Boston les contextes HTTP, donc il va automatiquement au camion. Ok, cet utilisateur était celui qui faisait la demande parce que les contextes HTTP, c'est camionner tout sur tout ce qui se passe, qui se passe, la connexion qui est utilisée, l'utilisateur, ils demandent le Wrthing responsive est dans ce objet, donc c'était possible sans objet. Et puis les unités sont fourche CM opération va juste être une grosse voiture de guerre pendant qu'il est de mettre les choses dans la base de données et de le mettre sur tous les audits. C' est donc un bon moyen d'obtenir la journalisation d'audit dans votre application. Oh, peut-être en fonction des développeurs pour s'assurer qu'ils le mettent dans ou en fonction de vous-même pour se rappeler que le met dans tout le temps. Alors testons ça. Voyons ce que le Facteur va être vu. Nous essayons de soumettre des données à la base de données. Donc je vais mettre un point d'arrêt ici dans notre opération sûre et ensuite nous laisser tester la création d'une autre voiture fictive. Alors je vais voir Send. Et puis notre opération de sauvegarde saute en action. Donc quand je regarde le nom, voyons quel nom est là. Laissez-moi juste faire F 11, puis l'utilisateur, tandis que l'utilisateur est nul parce que personne n'est connecté. D' accord, c'est pourquoi l'utilisateur est toujours nouveau, mais c'est bon. Donc, quand je regarde les entrées, je veux dire juste F 11. Donc, quand nous regardons les entrées, nous allons pouvoir voir que nous avons cette entrée en cours d'ajout, C, c'est un état en cours d'ajout. D' accord, vous pouvez essayer de décomposer, mais encore une fois, tout à ce niveau, c'est très générique, donc il ne va pas montrer quelque chose de spécifique ou de spécifique, c'est pourquoi nous avons dû faire tout ce type de distribution pour aller à Tin. Mais je vais juste appuyer sur F5. Continuons. Et quand je regarde les résultats, vous voyez la voiture factice et les données. On sait que C, notre D, ça revient. Donc, je n'ai pas fourni de bits, mais les dates reviennent parce qu'elles ont été mises automatiquement par notre code et mises à jour par, et créées par notre null. Parce que dans la mesure où il est parti, expéditeurs et tous les utilisateurs associés à la demande, la demande juste écrémage. Très bien, c'est donc l'une des façons d'automatiser notre journalisation et notre journalisation d'audit, désolé, avec l'unité de modèles de travail. Donc, à ce stade, nous avons fait des choses très critiques. Nous avons une mise en œuvre ou des unités de perles de travail. Je vous ai montré comment le faire pour un dans une table, mais nous avons déjà établi que cette section i unité de travail est vraiment comme un registre. Donc quoi que nous ayons fait pour l'un, nous pouvons le reproduire à travers les autres. Pour l'unité de travail, vous devez faire la même chose ici pour les véhicules, pour les modèles partout, bien qu'un. Et nous n'avons pas besoin de retourner à la startup parce que nous avons déjà traité notre injection là-bas. Donc, c'est bien. On n'a même pas à faire quoi que ce soit de plus. Et à peu près si vous avez éraflé d'autres contrôleurs, alors vous devez les refactoriser. Sinon, si vous n'avez pas éraflé à d'autres, alors je suggère que lorsque vous faites app.controller, vous créez un contrôleur API juste avec les actions de lecture, d' écriture afin que nous fassions probablement et difficile de faire autant de travail que vous faites avec l' Entity Framework et il vient de faire quelques changements alors ce n'est pas un problème aussi. Donc je vais vous défier de le faire dans la prochaine vidéo, nous allons revenir et je vais juste comparer les notes avec vous juste pour m'assurer qu'ils vous montreront ce que j'ai fait. Et donc vous pouvez juste regarder ce que j'ai ajouté et vous assurer que vous êtes sur la bonne voie. 21. Les contrôleur de Refactor existants pour utiliser l'unité de travail - Comparez des notes de notes pour les notes de Refactor de l'échanges et: Hé les gars, bienvenue. Donc, je vous ai laissé une petite tâche la dernière fois, mais nous sommes là pour comparer les notes et je vais juste vous signaler certaines choses que je suis sûr que vous avez obtenu si vous ne l'avez pas fait, alors pas de problème. Je vais les signaler pour vous et vous pouvez aller de l'avant et terminer l'activité. Donc, ce que je vous avais montré était une configuration des unités sont pour, et nous ne l'avons fait que dans le contexte de la table de mixage. Donc, au départ, nous aurions eu seulement 11 chose, citation unquote enregistré dans ces unités d'interface de travail. Nous sommes donc allés de l'avant et avons enregistré tous les autres pour le véhicule modèle , le livre de couleurs, le roi, le client, et tout autre objet de domaine. Maintenant, vous pouvez avoir besoin d'inclure, vous pouvez aller de l'avant et simplement continuer cette liste. En plus de cela dans la classe concrète, qui aurait à faire nos champs privés correspondants pour ceux. Donc faire, nous ajoutons micro, Boa pour se rencontrer pour les modèles, couleurs, réservations, et cetera. Et bien sûr, nous avons dû faire l'initialisation des objets publics, non ? Donc un espace sans retenue pour que vous puissiez les voir plus facilement, n'est-ce pas ? Donc, de la même façon que nous avons fait, littéralement je viens de copier et coller, puis juste changé le micro pour le modèle et le texte correspondant. C' est vraiment tout ce qui devait être fait et est fortement tapé. Donc si tu faisais une erreur, tu verrais une ligne rouge. est donc ce que nous avons fait pour l'unité concrète de mise en œuvre du travail. Maintenant, après avoir fait tout ça, je suis allé de l'avant et j'ai échafaudé tous les autres contrôleurs. Ainsi, vous voyez sur les commandes que vous voyez les réservations, les couleurs, les clients, les modèles et les véhicules que nous avons créés se mélangent. Et pour être honnête, tout ce que j'ai fait était de copier la plupart du code du contrôleur de mixage, puis de passer aux modèles, puis de le coller et ensuite fini par le contrôle F, où j'ai cherché quoi que ce soit dans ce document actuel qui a dit Mick et moi l'avons changé en modèle C ou bien, Ken Pienta et modèle. D' accord, et c'est tout ce que j'ai fait. Et puis remplacer parce que ce qui se passe est que nous avons déjà l'unité de travail. Si elle a dit obtenir moi x, puis après avoir fait cela, remplacer serait savoir, dire obtenir des modèles, si vous aviez dit fait ici va maintenant voir des modèles. Tout change juste ces AS même les variables. Maintenant, si le capital m est ce qui est offert peu de conséquences du grand schéma des choses. Donc je vous montre juste que, si vous avez travaillé, si vous avez travaillé, ils n'ont pas fait la copie et basés sur et ainsi de suite, c'est bon. Peut-être que vous vouliez le faire pour avoir leur expérience et c'est bien. Pas de problème. On va commencer par là. Je suis juste en train de partager avec vous une procédure accélérée à Hawaï. Donc si c'est moi que tu n'as pas fini avec l'opération et que tu trouves ça fastidieux, alors c'est un indice. Pour vous aider à le faire plus rapidement. Pour la racine, rappelez-vous simplement que nous n'utilisons pas de barre oblique API. Sonya les a éraflés, vous auriez un contrôleur API slash. Donc, j'ai traversé et je me suis assuré que je devais appeler la barre oblique de l'API Alltop, tous. Donc, ils disent aussi juste contrôleur. D' accord ? Et c'est à peu près tout pour notre API de repos. n'y a pas grand-chose à faire, c'est beaucoup plus que nous devons faire ici. À ce stade, il est bien préparé et prêt à servir notre application client Web Assembly. Et donc dans la prochaine vidéo, nous allons juste frapper notre point de contrôle où nous allons de l'avant et vérifier notre code. 22. Révision et ajouter des changements à GitHub: Vous êtes tous les gars ? Nous sommes arrivés à la fin de cette section où nous passons notre temps préparer notre API de repos pour servir notre application client. Ce que nous avons fait était de nous assurer que nous avons testé ou endpoints. Nous avons créé un point de terminaison qui parlait directement à la base de données et nous l'avons vu fonctionner. Mais alors nous avons discuté de la raison pour laquelle il est bon d'implémenter d'autres modèles au-dessus de ce qui est échafaudé pour nous hors de la boîte. Et cette raison, la raison en était vraiment pour la maintenabilité et certains types d'automatisation que nous pouvons mettre en avant. Donc, l'arme de choix était l'unité de travail au-dessus du modèle de référentiel générique, où nous avons le référentiel générique en cours d'implémentation pour être, comme le mot le suggère, ce générique. Donc, nous, nous ne sommes pas fortement taper à une classe, mais tout type de classe qui est son jeûne, nous avons ces opérations qui peuvent être effectuées en conséquence. Et puis en plus de cela, nous avons l'unité de travail où nous avons enregistré les différentes implémentations sont les implémentations fortes et typées de ce référentiel générique. Et cela nous permet de leur téléphoner à volonté. Nous avons également examiné la personnalisation de la méthode onreceive, où nous pouvons aller de l'avant et injecter nos contextes HTTP, nous permettant d'obtenir l'utilisateur qui effectue une opération. Ensuite, nous examinons méthodiquement tous les dossiers, un bateau à tamiser, et vérifions lequel est modifié, lequel est ajouté, lequel est ajouté, et fixons ces valeurs de vérification en conséquence tous avant que le bec ne sauve. Après avoir examiné tout cela, nous nous sommes assurés de l'enregistrer dans notre fichier de démarrage, ce qui permet de l'injecter dans n'importe quelle autre partie de l'application. Et en particulier, nous regardons nos contrôleurs où nous avons refactorisé celui que nous l'avons éraflé pour ensuite utiliser l'unité de travail plutôt que parler directement au contexte DB de l'application. Suite à cet exemple, nous échafaudés sont créés contrôleurs pour tous les autres points d'accès aux données que nous pourrions avoir à l'avenir. C' est la norme que nous utiliserons si nous devions étendre cette application. Donc, à ce stade, nous allons juste aller de l'avant et vérifier tous nos changements pour que je puisse apporter des changements que certains ne voient pas ici. Ce que je vais faire, c'est juste aller à View et ce sont de bons changements. Donc, à partir d'ici, j'écris mon missile et c'est un éditeur de message simple, les points de terminaison API et l'unité de modèle de travail. Et puis allez-y et validez tout et synchronisez. Et à ce stade, nous avons nos bits de code mis à jour. Alors on se voit dans la leçon suivante. 23. Aperçu de la section - Travailler avec Blazor et des données: Salut les gars, bienvenue. Je voulais juste vous donner un bref aperçu de ce que nous allons faire dans cette section. J' ai donc ouvert les composants de données de récupération qui seraient venus dans le cadre d'une application de la création de ces projets blazer. Donc, je voulais juste souligner quelques choses et nous donner un aperçu de ce que nous allons couvrir dans cette section entière où nous allons parler d'utiliser blazer pour communiquer avec notre API et manipuler les données en conséquence. Donc, cette récupération des tableaux de données ou du composant un, représente un composant similaire à ce que nous allons créer. Nous avons déjà un peu passé par la façon dont nous créons un composant ou des infiltrations et notre partagé et toutes ces choses. Nous avons donc une idée de base des objectifs de création de composants entiers. Mais ce que nous ne nous sommes probablement pas concentrés sur ce qui se passait à l'intérieur des données de Fichte où nous autorisons. Donc, vous avez vu que lorsque nous essayons de naviguer pour récupérer des données, nous devons nous connecter pour continuer. C' est un. Eh bien, vous remarquez que nous injectons également ce nouveau bit de code appelé client HTTP. Sachez que ce client HTTP ne représente qu'une bibliothèque. Et la façon dont vous auriez vu les configurations pour ce client HTTP ici dans notre program.cs. Et il est configuré pour regarder le projet serveur, l'API serveur comme adresse. D' accord, donc en d'autres termes, il va regarder l'API automatiquement. Donc, le client HTTP est configuré pour regarder l'API qui nous est donnée à travers le projet de serveur. Et puis cet objet nous permet de profiter de certaines des fonctions qui nous permettent d'interagir avec l'API restante. Donc, je vais juste passer à la dernière partie du code où ce qu'il fait, c'est qu'il initialise, vous savez, une liste de données à prendre des pics. Et puis quand il est initialisé, il va essayer de récupérer via notre objet client HTTP. Et puis il a des fonctions intégrées pour tous les verbes que nous avons traversés dans l'API. Ils ont le poste, le Put, tous ceux que nous regarderions. Et puis il était C réaliser que les données JSON que nous avons vu du facteur à partir de nos tests. Vous allez un peu sérialiser toutes les données qu'il récupère dans la classe correspondante. Jusqu' à présent, tous les noms de champs que beaucoup il remplira réellement la, cette classe et il va juste récupérer tout cela sous la forme de ces objets et les stocker dans des prévisions, que nous voyons juste une collection de données provenant de la appel d'API. Maintenant, ce qui est ici dans la chaîne serait l'adresse qu'il provoquera une prévision météo ici correspond au contrôleur de prévision météo dans l'API. Donc, notre subvention HTTP signifie que les requêtes GET et nous voyons, nous voyons notre verbe, HTTP GET, qui est vraiment juste de retourner quelques choses aléatoires sous la forme d'un tableau. Très bien, donc c'est vraiment un synopsis de tout. Nous allons effectivement laisser les composants blazer parler à l'API de reste. Vous pouvez voir que ce n'est vraiment pas si difficile. Donc, quand nous reviendrons, nous commencerons par créer un composant de liste où nous pouvons répertorier toutes les données dans la base de données sur un pH blazer et affichées dans les données. Et puis nous regardons toutes les autres opérations brutes. 24. Données d'affichage Blazor - Liste: Salut les gars, bienvenue. Donc, après notre rapide aperçu de cette section, nous allons y sauter directement et nous allons examiner comment nous pouvons créer un composant qui répertorie les données de notre base de données. C' est donc toujours une bonne idée d'organiser vos fichiers dans des dossiers comme nous l'avons fait jusqu'au nez. Donc, je vais commencer avec la page est des parties de la voiture et le projet client point de gestion. Et je vais créer un dossier que je vais appeler qui commence par micros. Donc, bien sûr, vous voudriez avoir la possibilité de voir tous les fichiers par table dans votre base de données avec quelques exceptions, n'est-ce pas ? Mais le fait est que nous avons des réservations, nous avons des couleurs, nous avons des clients de mix, nous avons des modèles, nous avons des véhicules. Donc, cela signifie que pour toutes les opérations brutes que nous allons faire, nous allons vouloir les faire sur chacun de ces types de données. Donc, je voudrais en quelque sorte regrouper tous les composants associés par table ou par ensemble d'opérations dans un seul dossier. Donc, si j'ai un dossier mix, alors je vais avoir un dossier de modèle et ainsi de suite. Donc, je vais juste aller de l'avant et créer tout le dossier. Très bien, donc c'est le genre d'organisation que je vais maintenir. Sachez pour cette section, je vais faire deux exemples. Nous allons faire un exemple avec le mix, ce qui est tout simplement suffisant parce que vous savez, il n'a vraiment que quelques champs de toute façon. Et puis nous allons en faire un avec peut-être quelque chose de plus compliqué comme des véhicules, qui ont des entités liées, non ? Alors je suis allé faire ces deux-là. Et puis, bien sûr, vous savez, notre modèle est que je vous montre le concept, puis vous l'essayez par vous-même, et ensuite nous reviendrons et comparerons les notes. Alors passons à l'intérieur. Donc, dans cette leçon, une fois de plus, nous regardons couloir vont récupérer des données et afficher dans une liste ou sous forme de tableau pour notre formulaire tabulaire pour nos utilisateurs. Nous commençons donc par créer nos nouveaux composants. Donc je commence avec mix, je vais créer un nouveau composant de rasoir. Ensuite, je vais appeler ces composants ce que je pense que le pH devrait être appelé. Donc je voulais l'appeler index. D' accord. C' est toujours, en fait, je vais dire qu'il est recommandé de penser que c'est vraiment nécessaire. Mais je suis, si ce n'est pas nécessaire, les lambdas recommandant que nous nommons toujours ou des composants avec des majuscules. Bon, donc index comme l'épithélium, je vais de l'avant et je frappe OK. Et maintenant, nous avons notre composante. Nous avons déjà vu des composants. Nous l'avons déjà examiné lorsque nous avons fait notre échantillon plus tôt. Donc, ce n'est rien de nouveau pour nous. Cependant, nous allons essayer de nous assurer que notre racine est là quelqu'un à dire au signe page ouvrir et fermer guillemets ? Et celui-ci, je vais juste voir Slash mix, ce qui signifie que quiconque navigue et dit Slash mix devrait pouvoir frapper ce composant. Et tout ce que je vais m'assurer de faire est d'injecter notre client HTTP. Donc, revenant juste pour récupérer des données, vous voyez que pour injecter un client HTTP dans le trou, dans le, dans le composant afin qu'ils puissent parler à l'API. Donc, nous avons vraiment besoin de ça. Nous pouvons également chercher à injecter certains de ces, mais qui mettent ces en utilisant des instructions comme nous allons certainement avoir besoin d'accès au cisaillé. Et ils signifieront sexuels et qu'est-ce qu'on ne te montrera pas comment faire ça d'une manière plus propre, plus globale. Nous n'avons donc pas à le faire chaque fois que nous en avons besoin dans chaque composant. Donc, je vais commencer par l'injection. Et j'appelle mes clients de soulignement, c'est ma convention de nommage, mais, vous savez, vous pouvez le nommer comme vous vous sentez plus à l'aise avec le nommer. Je voulais changer ce titre h3 pour être du titre de la carte de classe. Et je vais changer le texte pour dire Make list art ou, vous savez, probablement list of mix. Notre voiture fait quelque chose que l'utilisateur, je suis désolé, je suis juste d'être invité pour ces petites choses. Et je veux dire, nous pouvons travailler sur certains éléments de conception. Vous avez peut-être toutes les idées à l'esprit, mais je suis juste de mettre dans ces éléments bien que la règle horizontale et puis un point de rupture, notre balise de rupture, désolé, pour séparer le titre en haut du reste du contenu. Sachez que je vais me concentrer sur ce que nous mettons dans le code. Donc je vais commencer dans cette section de la cour. Ce que nous devons faire, c'est de voir d'emblée que nous avons un modèle de pH sur le type de données qu'il s'agit. Donc, je vais dire privé. Et puisque je fais face à des micros et que je ne suis ni une liste de mixage, je vais initialiser la liste de micro de type, non ? Remarquez que mic not mix cosmic est le type de données de la table à laquelle nous avons affaire, non ? Tellement doux. Et puis je vais juste appeler le modèle objet. On pourrait appeler ça des marques, on pourrait l'appeler comme je veux l' appeler modèle parce que c'est le modèle de la Peach. Maintenant, je vais faire est de donner une flèche parce qu'une fois de plus, j'ai besoin de m'asseoir dans les instructions d'utilisation afin qu'il sache d'où il peut faire référence à cela. Donc, au lieu de le faire comme je viens de le souligner, données Fitch le font là où il fait l'instruction using directement à l'intérieur du composant. Ce que je vais faire, c'est passer aux importations. Et puis à partir d'ici, je peux définir une sorte de global en utilisant des déclarations, non ? Donc, je peux voir ici en utilisant la gestion actuelle ancrée, domaine point cisaillé. Et puis en faisant cela, tout composant qui nécessite quoi que ce soit du domaine le saura alors qu'il est déjà dans l'importation. Donc je n'ai pas besoin de revenir ici et de le revoir. Donc je l'ai fait une fois. Je le fais seulement sur ce composant, mais à l'avenir, vous remarquerez que vous n'avez pas à refaire cette partie. Bon, maintenant que notre modèle est défini, ce que nous voulons faire c'est faire sortir notre protection, c'est le remplacement de l'évier, la tâche de remplacement. Et cette tâche C'est un multiple, mais ne vous inquiétez pas, va faire est appelé asynchrone non initialisé. C' est donc une méthode intégrée que chaque composant a asynchrone non initialisé. Que voulez-vous que je fasse quand je suis initialisé ? C' est à peu près tout. Remarquez que c'est un remplacement. Donc, la classe de base sur laquelle chaque composant est basé, juste là c'est. La composante b est. Désolé, composant de tâche basé sur l'asynchrone initialisé. Donc, nous remplacons celui par défaut et nous allons dire ce que nous voulons faire lorsque ce composant est initialisé. Ce que je voulais faire, je veux obtenir le stockage des données et les modèles. Donc je vais dire qu'un modèle est égal à et ensuite je peux, je vais attendre, mon client passe un appel. Ainsi, le client, le client HTTP a la méthode intégrée. Donc, je peux dire obtenir de JSON un évier. Très bien, c'est, ça va automatiquement aller et désérialiser tout ce qu'il obtient. Alors, qu'est-ce qu'il obtient ? Sortez pour spécifier quel type de valeur je m'attends à obtenir. Donc je voulais dire, eh bien, je m'attends à avoir une liste de micro type. D' accord, alors ça va dire, d'accord, vous voulez lister le micro, où voulez-vous qu'il soit de soft pour mettre l'adresse de l'endroit où je m'attendais. Et ils adressent serait le point final. Alors rappelez-vous que lorsque nous avons regardé le program.cs, il a déjà réglé le client HTTP pour regarder l'adresse de base de notre application, n'est-ce pas ? Adresse de base, ce qui signifie quelle est l'adresse ? Notez donc que le serveur et le client, ils partagent tous les deux la même adresse juste au cas où vous auriez oublié pelouse settings.js sur l'hôte local pour 4385. Et si nous faisons la même chose pour le serveur, c'est la même adresse. Donc, l'adresse de base, il sait où est l'API. Cependant, nous devons lui dire quelle API de décalage de point de terminaison. Et puis sur la base de notre nom ici, ce qui, je crois, va causer un conflit. Donc, nous allons probablement devoir changer vous-même, mais commençons juste à voir l'erreur et ne l'a pas corrigée par la suite. Mais nous avons dit que le point de terminaison devrait être les noms des contrôleurs, ce qui dans ce cas signifie make est où je veux aller. Où sont-ils testés API et regardé tous ces points de terminaison cependant. Donc, je vais voir, aller aux marques de terminaison. Donc, ce composant, une fois qu'il est initialisé, va faire cet appel d'API à cette adresse et obtenir la liste. Et nous savons que ça revient en JSON. Donc, cette fonction ou cette méthode va automatiquement reconstruire les données JSON dans une liste de moi, fortement, fortement tapé, désolé, afin que nous puissions l'utiliser et manipuler tout ce que nous souhaitons. Très bien, donc cela prend à peu près soin de cette API, va m'obtenir la liste des marques dans la base de données et les stocker ici à l'intérieur de cet objet appelé modèle. Alors non, comment affichez-vous tout ça, n'est-ce pas ? Je vais voir tout d'abord, si le modèle extérieur sont, désolé, je n'ai pas besoin que ça m'a sauvé les fesses. Donc, si le modèle est équivalent à null, alors je veux afficher quelque chose en voyant le chargement ou il va mettre dans un div. Et je vais lui donner que la classe va, rappelez-vous que nous utilisons Bootstrap, donc alerte et alerte moi d'être dans son intégralité. Alerte dans son intégralité. Je crois que je l'ai réussi. On y va. Et puis je vais dire que le chargement fait le mélange de chargement. C' est bleu, quel que soit le message de chargement que vous voulez. Donc, le fait est que nous allons toujours commencer à vide. Cela va être nul car cela signifie qu'il est nul. Mais une fois cela terminé, nous voulons afficher une table. Donc ça va l'être. Affiché pendant que tout cela se passe, quel soit le temps qu'il faut pour accéder à l'API, cela sera affiché. Ensuite, la chose cool sur les blazers qui veut que les données changent. Il envoie un message à l'interface utilisateur pour dire, Hey, vous savez ce que les données ont changé. Donc la simple pensée, c'est encore ça, vous savez, c'est surveiller quand ces données changent, je peux voir si c'est nul, faire ça. Et puis quand il change, il va toujours réévaluer si c'est la normale. Non, ce n'est pas le cas. Ok, que dois-je faire ici ? C' est vrai ? Donc, c'est presque comme une boucle while sans la boucle, c'est tellement cool. Bon, donc ce qu'on va faire, c'est C, tu veux une table peut-être. Et puis j'utilise des classes Bootstrap pour ma table. Donc, je vais définir ceci pour avoir une table et une table qui est réactive. Et si vous n'êtes pas si familier avec Bootstrap, nous pouvons regarder les autres que vous voulez probablement inclure, mais je voulais coller la table réactive et peut-être SM Eh bien, non, laissez-moi juste vous donner cette table et le concessionnaire réactif. Et puis définir tenir cette table devrait regarder donc nous avons notre tête T, qui a un TR, qui a alors le th est que je vais avoir th pour le nom comme dans MC, nom, juste à la recherche micro de sauvegarde, faire vraiment ou le nom et l'ID de la couche basé sur le modèle de domaine basé et créé par un nombre slovène de détails que vous voulez inclure en passant par eux maintenant j' juste besoin du nom et je vais avoir une autre colonne appelée enchères, qui va accueillir, vous savez, modifier les boutons, supprimer les obligations, et cetera. Puis après avoir défini la tête, je vais mettre le corps TI. Et puis dans le corps de l'équipe est où nous faisons la partie amusante où nous devons parcourir nos données, revenir, vous savez, le modèle que nous savons est de type, liste off mix, non ? Donc, je vais dire pour chaque élément dans le modèle, je veux un nouveau rôle, TR, avec la première cellule jouant à la maison pour item.name. D' accord, donc tu vois que j'abandonne tous les objets parce que le mobile est de type, de marque. Chaque article représente le fabricant. Et puis je voulais avoir un autre T d, désolé, dans la même règle, qui va ensuite stocker tous mes boutons. Maintenant, c'est à ça que je veux que mes boutons ressemblent. Je veux des étiquettes d'ancrage. J' ai deux balises d'ancrage sur, j'ai un bouton pour que vous puissiez faire une pause, jeter un oeil à ce que ce code est, puis continuer. D' accord, donc ma première étiquette d'ancre a le HRF pour mélanger la vue slash, non ? Donc nous allons mettre en place tous ces éléments, mais celui-ci signifierait que je veux regarder les détails de ce dossier. Donc, je crée le bouton de vue et je passe à l'ID d'élément. Celui-ci signifie que je veux éditer peut-être. Donc, je transmets la carte d'identité. Celui-ci est la suppression, mais remarquez que ce n'est pas une balise d'ancrage, c'est un bouton. Ils utilisent tous les mêmes classes Bootstrap. rivage ne sont que des variations basées sur l'exploitation. Mais alors le bouton a un événement onclick. Donc, si vous avez déjà travaillé avec des parcs éoliens ou même des forums Web, vous seriez habitué à cliquer sur des événements. Donc, c'est comme un petit événement de clic où il va voir que je veux appeler cette fonction appelée delete et PaaS dans l'ID de point make. D' accord, désolé, je l'ai frappé. D' accord. D' accord, j'avais un micro. Le fait est que vous voulez probablement le faire parce que, vous savez, quand vous voyez le modèle, quand je vois le mod 2, ils en avaient 10 ou 12. Alors rendons ça un peu plus convivial pour les lecteurs, non ? Donc, c'est une liste de mix. Tous les micros entrent et font ça. Et là où j'ai dit que mod lambda va me voir x à la place. Très bien, et au lieu de voir l'article parce que vous savez, le code quand c'est une grosse piste qui peut être plus difficile à lire pour quelqu'un d'autre regardant. Alors rendons le lecteur aussi convivial que possible. Donc, en changeant tout le vague ou par exemple, l'élément sur le modèle pour dire quelque chose de plus comme moi. Très bien, alors faites l'ID point et ensuite nous avons notre référence de méthode de suppression ici, mais il n'y a pas de méthode de suppression à appeler. Donc, ce que je veux, c'est que lorsque la personne clique sur Supprimer, lorsque l'utilisateur clique sur Supprimer, nous lui donnons juste une invite rapide. Tu es sûr de vouloir supprimer et s'ils disent oui, alors on va de l'avant et on n'a pas mangé, non ? J' ai donc besoin d'une méthadone ici que je vais définir comme une tâche asynchrone. Et ce sera supprimer ou, et je vais le faire prendre un paramètre int id. Bon, maintenant que voulons-nous dire cette méthode de suppression, donc ça disparaît parce que j'appelle une méthode. Il ne l'a pas encore vu. Sachez qu'il est là. C'est bien avec ça. À droite. Et ça en a fait un évier. Tu vois pourquoi dans une minute. Et remarquez que je n'ai pas besoin d'un modificateur d'accès car il pourrait être privé. Ça n'a pas vraiment de sens. Vous le rendez public. Mais en l'absence de voir privé, cela implique que c'est privé. Donc tu n'avais pas besoin de cette partie. Donc je voulais regarder le micro. Je vais dire var MC est égal à la et j'ai déjà le moins off mix. Donc, voici un truc cool. Je connais déjà le mélange. Il y a l'audience, la composante. Je n'ai pas besoin d'aller faire une API de modèle l' appeler pour récupérer le mythe qui doit être supprimé. Donc, je peux juste regarder dans la liste qui est déjà avoir et dire me donner le premier qu'ils veulent s'asseoir pour un magasin, pour un magasin par défaut. Je le fais d'abord et je verrai mon expression lambda. Essayons encore ça. abord, où Q point ID est équivalent à l'ID micro qui venait de passer à travers le paramètre qui provenait de notre événement de clic bouton contre cet enregistrement particulier dans cette table entière. Donc, vous voyez tout est juste contredit magnifiquement. Alors je vais dire si je veux obtenir une confirmation de l'utilisateur, alors faisons-le tout d'abord, sans confirmation, regardons un code sans confirmation. Donc, après avoir fait cela, je peux dire attendre un appel client pour supprimer un lavabo. Il a dit ça. Donc, pour chaque verbe, le client HTTP a une méthode. D' accord ? Et puis je vais appeler mon mix. Donc, je veux appeler mix slash va, rappelez-vous que c'est le nom du point de terminaison. C' est vrai ? Fait barre oblique et fait pour la suppression a pris un paramètre. Alors revenons en arrière et regardons. Donc, nous avons pris un paramètre pour notre suppression, donc il doit passer dans le mix slash Fiverr. Donc, je vais dire fait slash et ensuite mettre dans l'ID Meek qui a été transmis. Et puis Aller pour rappeler la méthode asynchrone initialisée. Et parce que nous utilisons nos poids, C'est pourquoi nous avons fait cette méthode art asynchrone. Donc, fondamentalement, nous supprimons et puis il va rafraîchir la page. Maintenant, j'ai dit que je voulais inviter l'utilisateur parce que vous ne voulez pas que l'utilisateur supprime. Et je viens de me rafraîchir et ils sont comme, Eh bien, qu'est-ce que j'ai cliqué ? Donc tout ce qu'on va faire, c'est probablement mettre un peu vite. Et vous savez, comme en JavaScript, vous pouvez toujours voir comme alerte, quelque chose comme ça. On va le faire. Nous allons mettre une alerte ou une invite JavaScript. Afin d'interrompre avec JavaScript via blazer, nous devons, nous devons injecter une autre bibliothèque appelée IGS runtime ou JS interruption. C' est la technologie ou la bibliothèque derrière ce JS Runtime. Donc, avec cet objet, nous pouvons savoir interagir avec du code JavaScript en utilisant C-Sharp. C' est juste, j'ai une belle façon hybride de ne pas dur les os sont sujettes à beaucoup de langues à accomplir en utilisant tous, non ? Donc je vais dire si, et nous allons souvent, je vais attendre, JS dot invoquer un évier, non ? Et j'attends un booléen, donc je vais lui dire que vous attendez un booléen après avoir fait cette invocation. Et à l'intérieur de cette méthode fait des méthodes. Donc, après les crochets d'angle avec bool, nous juste ouvrir et fermer les parenthèses. J' ai le premier paramètre, qui voit quel type de méthode de JavaScript est censé appeler. A peu près quels paramètres sont nécessaires pour les méthodes SCID. Donc, confirmez, c'est la méthode qui appelait. Et puis je passe le texte, voulez-vous supprimer et, euh, ces noms de points micro super ou interpolant là-dedans. D' accord. Donc, c'est une déclaration if. Donc, si oui ou non, alors confirmer va être oui ou non, donc il attend la réponse et il le stocke là. Donc tout cet oxygène, sorte qu'un hybride, chaque déclaration, juste l'écrire en une seule ligne. Si vous vouliez le séparer, vous pourriez dire que la décision var ou var confirmation est égale à, laissez-moi juste mettre que là à partir de maintenant est égal à ce gène est impliqué de sorte que vous savez, vous pouvez un pseudo code un peu plus, droit ? Et puis si on confirme, on appelle, d'accord, donc c'est à peu près ce qui n'est pas. Et c'est un exemple simple et très simple de toutes les exécutions d'interruption js. Plus tard, nous examinerons façons plus avancées et probablement plus belles d'y arriver. Mais pour null, nous avons fait un peu. Allons tester. Je pense que nous avions déjà mis un mélange dans notre base de données, si je ne me trompe pas, d'accord, donc nous devrions avoir au moins quelques combinaisons à examiner. Voyons donc comment cela fonctionne. Je l'ai chargé et je me rends compte que je n'ai pas de moyen immédiat d'y arriver. Donc, nous allons buck chuck bit et assurez-vous que nous mettons à jour notre barre de navigation. Sautez cette étape. Donc, ce que je vais faire est de me débarrasser de cet exemple de page et même les données de récupération étaient vraiment n'en ont pas besoin. Ce que je voulais commencer par changer les données de récupération, je vais dire Meeks, d'accord ? Et H ref ici serait mélangé avec une barre oblique, n'est-ce pas ? Donc ça veut dire « Allez dans la barre oblique du dossier de mixage » et puis on nous dit déjà l'index que vous êtes à cette adresse, à peu près pas vrai ? Donc, il suffit de redémarrer. Bon, donc pas moyen de notre élément de menu si nous y allons, il va commencer à charger ce que cela va donner une erreur. Cette erreur est vraiment parce que nous essayons de faire cet appel API avec l'habilitation de sécurité appropriée ainsi que Luke. J' ai donc fait allusion au fait que nous pourrions avoir besoin de changer ou d'adresse pour l'API. Donc, c'est en fait de voir slash mix. Qu' est-ce que nous avons dit au composant qui est aussi un arraché moi x. alors quand écrire mon initiale ou mal où je aurais suggéré que nous allons juste par le contrôleur. Parce que ce qui se passe, c'est que si nous revenons au contrôleur et que nous nommons nos dossiers les mêmes noms, alors le haut devient un peu confus. Est-ce que je vais mélanger sur le serveur et le BIA ou est-ce que je vais le faire dans un client ? Donc, pour les mesures correctives et c'est juste re, est-ce que ce sont Roebuck, notre norme pour l' API, contrôleur de slash api, non ? Et je veux le faire d'une manière assez simple où je vais juste faire une recherche et remplacer. Donc, je vais juste dire trouver les crochets du contrôleur de crochets carrés et le remplacer par une barre oblique api. Support carré. Et je regarde dans le projet actuel et je vais juste remplacer un à la fois pour m'assurer que je ne le fais pas, donc je n'ai pas besoin de le remplacer. Mais j'ai besoin de remplacer ça. Skip ou ainsi d'autres. Ouais, tout ce qui doit être remplacé, je vais le faire. Et nous devrions être bons d'aller après ces messages. D' accord, donc je signale juste une classe potentielle, pas un potentiel à un béguin que nous avons rencontré. Et nous pouvons laisser la météo parce que nous n'en avons pas vraiment besoin de toute façon, et c'est tout. Donc une autre chose, un autre changement d'entre eux est allé à moi il bruit à l'adresse API qui est appelée parce que je dis seulement micros. J' ai donc besoin de voir une barre oblique d'api ici et une barre oblique d'api à ce stade. Alors, refaisons-le. Non, un autre point d'information avant de continuer. Bien que nous n'ayons pas mis d'autorisation sur notre point de vue sur nos composants, Désolé, nous n'avons pas non plus mis d'auteur comme sur l'API, n'est-ce pas ? Mais on l'a enlevée. Le fait est cependant que la configuration du client HTTP dans l'application cliente et program.cs dit qu'il a besoin d'autorisations, donc cela signifie qu'il essaiera toujours de symboliser l'autorisation sera. Et il est juste configuré pour savoir qu'il devrait être un appel autorisé, ce qui signifie que celui qui appelle doit être connecté. Donc, même si nous n'avons pas mis la protection sur la page, cela pourrait ne pas fonctionner parce qu'il va essayer de faire un appel autorisé. Très bien, on y va. Donc, même si cela ne nous montre pas les choses de l'API, nous allons résoudre cela, mais nous avons toujours un problème. C' est donc un problème assez simple pour obtenir le nôtre car nous avons déjà quelques utilisateurs que nous avons créés. Donc, je suis un peu lent. Et après m'être connecté, je vais essayer à nouveau et on y va. Si vite fait cet appel. Eh bien, je veux dire, tout est assis sur une machine et l'âme le fonds qui est émis sur l'appel d'API et qui est revenu est transparent pour l'utilisateur. Donc ici, nous regardons toutes nos cartes, sont, désolé, nos Meeks dans la base de données, non ? Et puis si je voulais supprimer, puisque c'est la seule autre fonctionnalité du système jusqu'à présent. Encore une fois, essayez ça. J' ai la confirmation. Voulez-vous supprimer la voiture factice ? Je clique sur OK, puis regarde ça. Donc, c'est comme si tout se passait en temps réel. Pas de rechargement visible ou quoi que ce soit comme ça. Je peux aller de l'avant et supprimer l'autre voiture fictive et nous avons nos données. Donc, tous les changements cosmétiques que vous voulez faire à ce stade, vous pouvez faire et ainsi de suite. Mais c'est la base, sont les étapes de base pour obtenir la liste et l'afficher sous forme de tableau. 25. Données d'affichage Blazor - Liste de notes de comparaison - Comparez les notes: Hé les gars, bienvenue. Donc, dans notre leçon précédente, nous avons parcouru la configuration de l'interface utilisateur afin que nous puissions récupérer des données de l'API et les afficher à nos utilisateurs ? Non, je voulais juste vous expliquer quelques changements que j'ai apportés au discours du micro. Et puis je vous expliquerai comment nous avons transféré la connaissance de ce que nous venons de faire à partir du composant de mélange en tant que composant pH. Je les utilise de façon interchangeable à ce stade. Mais toutes les techniques et nous allons vouloir enregistrer qui a mis en place pour faire fonctionner l'interface utilisateur de mixage. Je voulais vous expliquer comment j'espère que nous transmettrons ces connaissances ou que nous pouvons les transférer aux autres parties de notre application. Maintenant, je vous manque juste de critiquer mix et puis vous remarquez qu'il est allé directement à la page de connexion. Pourquoi est-ce qu'il a fait ça ? Donc la première chose que j'ai fait était d'ajouter un attribut tog ou flagler autorisé en haut de notre page de mixage, à droite. Donc, je parle juste de ça. Donc j'ai dit attributs autorisés. Rappelez-vous donc que nous avons souligné que chaque fois que l'appel d'API est fait, il doit avoir un certain type d'outil qui indique que c'est un utilisateur non autorisé qui fait cet appel. Donc, je viens, en mettant ceci en haut, ces attributs autorisés en haut de l'interface utilisateur. Il envoie l'interface utilisateur que vous devez être autorisé pour y accéder. Et c'est ce qui s'est passé dans le composant Fetched Dates sont, c'est pourquoi nous devons nous connecter avant de pouvoir passer à la date de fin. Donc, je viens de mettre cela pour m'assurer que nous évitons une institution de n'importe qui tendance à charger cette page et obtenir cette erreur quand tout ce qu'ils ont vraiment besoin de faire est de se connecter. Nous les forçons donc à se connecter avec cet attribut. Et bien que le changement que j'ai fait ici était de transporter, nous avons formé les points de terminaison. J' ai donc dû mettre api slash mix, puis n'hésitez pas à dire api slash mix à nouveau, slash MC ID. Et à peu près c'est un modèle dans le temps. Nous voulons une adresse, nous devons dire api slash l'adresse. Donc, ce que j'ai fait, c'est que j'ai créé un fichier de points de terminaison que j'ai mis dans un dossier appelé statique. J' ai donc créé un nouveau dossier dans le projet client appelé statique. Et puis j'ai C, classe C-Sharp appelée endpoints. Donc, cette classe est une classe statique qui a juste un tas de chaînes statiques lues dans qui aurait pu rendre cela privé, mais c'est bon. Mais j'ai défini le préfixe, qui est API, ce que je veux dire c'est applicable pour tous. Et si vous le changez de l'API, c'est autre chose, alors vous avez juste besoin de changer un préfixe une fois. Mais pour chaque point de terminaison potentiel, j'ai créé une autre chaîne statique afin que vous puissiez faire une pause, faire tout cela une fois de plus, créer un dossier. Allez-y et créez, désolé, il crée un dossier appelé statique créer le fichier appelé endpoints sont C-Sharp classe plutôt. Et puis dans cette classe, on peut juste mettre ce morceau de code. Et puis bien sûr, après avoir fait tout cela, vous voulez aller aux importations et laisser votre application cliente savoir sur cet espace de noms afin que nous puissions utiliser la croix tous les composants confortablement. Donc, ce sont deux changements que j'ai apportés au mélange. Maintenant, en termes de transfert des connaissances ou des techniques utilisées dans le mix, et je vais juste me connecter pour que vous puissiez voir. Si vous regardez les modèles et les couleurs d'observation, ils sont à peu près la même chose que les micros. Ils n'avaient qu'une propriété qui est le nom, non ? J' ai fait la même chose pour les mannequins, c'est la même chose pour les couleurs, non ? Donc, nous avons eu le dossier est créé à partir d'avant. Tout ce que j'ai fait était de créer un nouvel index. Et à peu près vous assurez-vous que le chemin, ce sont des couleurs et tout ferait en sorte de chemin nous avons besoin des mêmes bibliothèques, la même autorisation que nous utilisons les mêmes couleurs de titre de carte H3. Vraiment et vraiment c'est du code identique, mais pour le fait que nous utilisons le point de terminaison différent. Et probablement le verbiage est différent ici et là. Encore une fois, c'est votre application. Vous pouvez modifier ITO, vous devez le faire. Je vous montre juste que les mêmes techniques qui ont été utilisées pour le mix, nous pouvons les utiliser pour tous les autres. D' accord. Donc, en toute justice, tout ce que j'ai fait était de copier à partir de mix, coller ce fichier d'index à l'intérieur des couleurs et à l'intérieur des modèles. Et puis a fait un Control F et a trouvé chaque micro et remplacé par le mot couleur. Et je l'ai fait pour les majuscules et les minuscules juste pour rendre l'édition beaucoup plus facile. Et puis toutes les erreurs en cours de route, nous les nettoyons juste. C' était vraiment non, je suis la situation plus avancée viendrait sous la forme de véhicules. Donc, les clients n'est pas très différent. Je veux dire, tu sais qu'on n'avait pas grand-chose pour les clients. Je veux dire, nous aurions pu mettre un peu plus de données peut-être pour Dan juste taper le contact d'identification sur l'adresse e-mail, peut-être prénom, nom de famille. Mais c'est bien. Nous pourrons le faire plus tard si le besoin se fait sentir. Mais encore une fois, c'était aussi facile que pour le Swan pré-construit, nos précédents, sauf que vous devez être conscient des colonnes que vous mettez en place. Et le père, vous avez besoin de ces colonnes supplémentaires et tout le reste est à peu près pareil. Et je viens d'avoir un petit ajustement. Donc, bien sûr, vous voudrez être très prudent et méticuleux quand vous faites, vous copiez et collez parce que vous voyez, j'ai été bâclé avec le mien. Mais c'est bon pour toi de voir ce qui peut mal tourner d'une façon ou d'une autre. Donc, je fais juste en sorte que tout ce qui dit MIX Non dit clients et penser que dit doux et aussi son client, non ? Et fondamentalement, tout le reste est caché et en place. Pour que nous puissions aller de l'avant. 1 bien qu'avec l'attribut authorized, il vous dira que vous avez besoin d'une bibliothèque. J' ai oublié de le mentionner. Et vous pouvez également vous occuper de cette exigence en ajoutant ces deux lignes à vos importations. Donc, peu importe où vous utilisez l'auteur comme, vous devriez aller bien. Très bien, donc vous pouvez aller de l'avant et le faire comme vous mettez en autoriser, savoir pour les situations plus avancées comme où nous avons des champs connexes. Donc, dans le cas des véhicules et dans le cas des réservations. D' accord. Alors regardons les réservations. Regardons les véhicules pour nous. Je pense que les véhicules, je fais moins de choses compliquées. Donc, dans les véhicules, c'est ça. Nous savons que nous avons ou page ou injection du client sur leur propre temps et autoriser. Véhicules, s'ils ne sont pas nuls, alors nous chargeons la table. Maintenant, dans la table, j'ai fait le modèle et je pourrais avoir, vous savez, la couleur. Alors ajoutons de la couleur. En fait, ce serait, eh bien, n'ajoutons pas de couleur, non, mais nous aurions pu avoir la couleur du point est que nous avons des champs que nous devons afficher qui sont des champs liés provenant d'une autre table. Donc le véhicule a naturellement fait une identification, mais je ne veux pas afficher la marque ID. Ça ne veut rien dire pour personne. Notez que je n'affiche aucun des ID. Je n'affiche que les noms et les données non pertinentes, donc je dois dire quel est le nom du point de marque et le nom du point de modèle. C' est donc à quel point il est vraiment facile de référencer des champs dans la table liée, n'est-ce pas ? Donc nous sommes juste imprimer, mais ces champs et tout le reste reste à peu près en smoking comme, Oh, nous le savons, c'est la même boucle, c'est la même table CAM beaucoup. C' est le même type d'appel de service sur initialisé et tout. Mais nous avons dû faire un ajustement aux données revient réellement quand nous appelons pour les véhicules. Donc, en passant à l'API, si je soulève le point de terminaison des véhicules et aller à la partie où nous obtenons les véhicules. Alors vous remarquerez que j'ai fait quelques ajustements à notre unité ou quatre appels. D' accord. Donc, les deux oublier les véhicules et obtenir véhicule par idée juste qu'ils ont fait le même temps parce que le besoin est similaire. Ce que nous devons faire, c'est tirer parti du mécanisme d'inclusion que nous avions mis dans les unités de travail. Alors rappelez-vous, et je vais juste faire le contrôle F 12, ce qui m'amène à la mise en œuvre de get all. Rappelez-vous que nous avions inclus ce paramètre pour une liste potentielle d'inclusions. Et ce que nous avons fait était de dire que si les inclusions ne sont pas nulles, alors nous allons de l'avant et incluons toutes les données connexes. Bon, donc voici un exemple pratique de la façon dont cela est utilisé. Donc, ce que je fais ici dans cet appel d'API est de dire que lorsque je fais un appel, quand quelqu'un fait un appel pour obtenir des véhicules, il suffit d'inclure automatiquement la marque associée, le modèle associé et la couleur associée de sorte que lorsque ce véhicule revient, il est assez facile pour nous d'accéder aux champs liés sont les champs des colonnes associées. D' accord, donc je n'utilise pas de couleurs ici. J' aurais facilement pu être discipliné la couleur, mais puis je pousse l'enveloppe pour répondre quand je reçois une carte correcte de vue. Je veux aussi inclure tous ces détails et je veux inclure la liste des réservations, n'est-ce pas ? Souviens-toi une fois de plus, tu vois que je te montre comment tout est connecté. Lorsque nous avons créé notre modèle de véhicule, nous avons dit que nous voulons la liste des réservations sont nous voulons savoir qu'il ya une liste de réservations. Donc, lors de la réservation, un véhicule désolé, a beaucoup de réservations. Si je voulais un historique de réservation sur ce véhicule à afficher chaque fois que je regarde le véhicule. Donc je vois quand vous récupérez ce véhicule, récupérez cette liste de réservations, je n'ai pas besoin d'eux ces réservations de trucs chaque fois que je reçois tous les véhicules parce qu'il n'y a peut-être pas de cas pour ça, mais vous pourriez mettez-le là. C' est tout ce que je fais vraiment et vraiment. Donc ça peut signifier que je loue juste un véhicule et pendant qu'on est là, tu peux le rencontrer. Je voulais aussi réserver, non ? Désolé pour l'appel API de réservation. D'accord. Donc, la réservation a également des champs connexes. Donc c'est ce que nous savons et ce que nous allons faire est modifier de manière à ce que nous sachions y compris le véhicule et le client. Et puis quand nous appelons vont passer ce paramètre intrus. Très bien, et lointain réservation. Encore une fois, quand vous arrivez à une réservation, c'est la même chose. Nous avons notre expression Lambda inclure. Donc, la raison pour laquelle j'ai inclus deux-points est que nous avons en fait assez de paramètres qui pourraient être transmis. On a cette expression Lambda, on a l'artère ou en dessous on a les trucs dont je ne veux pas mettre les experts sur que je ne veux pas vous mettre dans ça. Je voulais seulement mettre des inclusions. Donc, avec les dernières versions de C Sharp, nous pouvons simplement spécifier le paramètre que nous voulons mettre et ensuite mettre dans la valeur correspondante. Et parce que les autres sont notamment, il va juste contourner et les ignorer de toute façon. est donc ce que nous voulons faire à la fois pour les réservations et pour les véhicules. Très bien, donc encore une fois, quand nous regardons notre page d'index, désolé, quand nous regardons notre page d'index pour nos véhicules, c'est ainsi que nous sommes en mesure d'accomplir cela. C' est non, pour la réservation, je fais un peu plus alors oui, je charge la réservation. Oui, nous faisons tout le reste des choses que nous savons. Mais alors j'affiche le client qui a accordé le véhicule. Encore une fois, nous pouvons ajouter plus de détails à l'enregistrement client. Je n'ai pas mis le prénom et le nom. On peut le faire si tu veux. Mais pour Nautilus, installez-vous avec l'idée de smoking et les coordonnées. Nous avons mis la date de la réservation. J' indiquerai la durée, ce que je veux dire le nombre de jours pour lesquels cette personne avait fait la réservation. Donc, dans la boucle for, les données qui sont présentées vont chercher différemment. Oui, nous avons des réservations. Eh bien, ça devrait être une réservation. Laisse-moi juste faire cet ajustement. Si je le prêche, alors je dois m'entraîner, n'est-ce pas ? Alors laissez-moi juste m'assurer que mon code est à la même norme que ce temps encourageant. Donc var réservation dans les réservations. Et puis nous disons Booking dot costumer, dot-dot société. Une chose très similaire à ce que nous avons fait avec le véhicule, le micro et le nom. Ensuite, nous avons Booking dot date créé parce que c'est la date, à droite. Nous pouvons donc supposer en toute sécurité qu'une réservation a été créée à cette date. C' était le jour où la date de réservation a été créée. Ce que je ne veux pas de la date et de l'heure. Je veux juste le rencard. Alors c'est la date. Et puis nous pouvons pousser cela un peu plus loin pour le besoin et le format. Ce sera comme un outil, un format. Donc j'aime généralement avoir mon jour est le jour ou le jour fait dans le 29 ou le premier ou le second, le jour, les lettres, la montagne, comme dans le nom du mois, et l'année à quatre chiffres sont faits. Cela devrait être des guillemets doubles. Donc, ce serait de voir quelque chose comme le 29 de moi, 2020. C' est tout ce qu'on veut, notre date d'affichage. D'accord. Et puis pour la durée, je vais dire que je veux à peu près ce maths. On peut faire ce calcul avec les dates d'échéance, non ? Je peux dire Date de réservation point dans, ce qui serait la divinité supérieure parce que vous apportez mais dans la voiture après que vous l'avez sorti. Donc les données l'ont ramené dans les mammifères le jour où il a fallu Ito, je ne voulais pas totaliser les jours entre ces deux dates et nous voulons lancer ça en corde. D' accord ? Et je viens de réaliser que je dois mettre tout cela dans une grande parenthèse à cause de la façon dont les tableaux de pages fonctionnent. Donc, comme je l'avais, sachez juste si nous avions seulement ceci entre parenthèses, alors vous verriez effectivement cette valeur imprimée et le point de chaîne littéral pour totaliser ces chaînes de points deux, ce qui n'est pas ce que je veux. Donc je veux tout ça parce que tout ça est un code C-Sharp. Je vais envelopper tout cela entre parenthèses pour que vous puissiez voir les marqueurs jaunes que j'étais à la citation C-Sharp, début et fin. Et je suis prêt à mettre le point-virgule à l'intérieur de ces parenthèses. Et c'est ce qui va me ramener la représentation sous forme de chaîne du nombre total de jours, qui sera la durée. Donc, vous pouvez quantifier cela, sont quantifier et dire la durée en jours si vous voulez, c'est bien. Et puis tout le reste est à peu près conforme à la même norme. Et puis nous allons un peu plus loin et ensuite nous avons nos bits de code faire la même chose, récupérer les réservations, faire toute cette logique de suppression, et tout à l'avance. D' accord, donc vous voyez que ce n'est pas difficile de transférer ce peu de connaissances hors de nous avoir envie de faire des calculs. Et peut-être simplement faire le peu supplémentaire pour nous assurer que nous obtenons les données connexes, ce qui est vraiment facile pour nous en raison de la façon dont nous avons construit la couche d'accès aux données. En dehors de ces choses, Il est assez basique et trou standard pour obtenir des données de Bach de l'API et détient une structure d'une manière agréable, conviviale. Quand nous reviendrons, nous chercherons à faire fonctionner notre bouton de vue. Donc, ce bouton personne, notre premier lien dans tous les 10 pour les tableaux de détails. Il, il sert à faire notre disque d'affichage par lui-même sur ses propres composants. Donc, nous allons configurer un autre composant ou nous allons l'appeler vue. Et nous allons voir comment nous arrivons à réduire la composante, accepter l'appartement ou le périmètre inutilisé jusqu'à déduire quelles données devraient être sur la page. 26. Formulaire Créer la configuration - Partie 1: Salut les gars, bienvenue. Nous allons donc passer à la création de données dans cette leçon. Et la réalité est que oui, nous savons comment nous voyons les données, mais ce sont vraiment des données par défaut. La réalité de la situation est que lorsque les utilisateurs interagissent avec notre application, ils ont besoin de la possibilité de créer des données. Nous allons donc devoir leur donner un formulaire qui leur permet de le remplir, soumettre le stockage des informations et la base de données, et de les afficher en conséquence. Donc, nous allons commencer avec les véhicules dans l'exemple précédent, je commence par le moins compliqué et puis je vous donne la chance de faire les plus compliqués. Et puis nous avons comparé les notes dans celle-ci, je vais commencer par le plus compliqué et ensuite vous pouvez transférer cette connaissance en traitant avec les moins compliquées. Donc, la raison pour laquelle nous allons commencer avec les véhicules est que nous devons afficher le micro, le modèle, et nous devons afficher la possibilité pour l'utilisateur d'entrer ces points de données lorsqu'il les crée. Et nous avons déjà établi que ceux-ci sont liés. Le, ce sont des points de données liés provenant d'autres tables. Donc, évidemment, nous ne pouvons pas permettre à l'utilisateur de les taper. Et ils devront faire des listes déroulantes et autres. Donc, à cause de ces situations plus complexes, nous allons commencer avec les véhicules et ensuite vous pouvez essayer les autres par vous-même et nous comparons simplement les notes. Maintenant, vous remarquez que mon interface est quelques changements. Un, j'ai entré ce bouton ou j'ai inséré ce bouton dans le code. Et c'est vraiment juste un bouton avec btn secondaire dessus et un signe plus. Je vais vous montrer le code dans quelques-uns, mais aussi la table. Ce que j'ai fait était d'enlever la classe responsive tiret de table de celui-ci. Donc maintenant, il s'étire juste à travers l'écran de toute façon, qui est plus comme ce que je voudrais. Donc, vous pouvez rencontrer cet ajustement si vous le souhaitez. Mais prenons un code de recherche pour le bouton. Et nous voyons ici que c'est vraiment juste une étiquette d'ancrage. J' ai le HRF étant égal à slash véhicules slash crée. C' est donc notre composant que nous devons créer cette fois-ci. Et la classe btn secondaire filé ou tableau de bord plus et créer des véhicules. Donc, une fois de plus, c'est votre application que vous avez commencé du tout, vous ressentez le besoin de, vous expérimentez. C' est à toi de voir, mais on va continuer sur cette âme. Ce qui se passe lorsque je clique sur le bouton, c'est qu'il continue sur deux pages, désolé, il n'y a rien au centriste, il n'y a rien là parce que nous devons aller de l'avant et créer le composant vers lequel il va naviguer. Alors commençons à le faire. Donc, maintenant, je suis sûr que vous savez comment créer un composant déjà créé, mais juste comme une actualisation, vous pouvez cliquer avec le bouton droit de la souris, aller à Ajouter, puis série ou composant et nous l' appelons crée les tableaux sont donc vous pouvez aller de l'avant et créer que dans les véhicules. Et pour chaque autre page ou, vous savez, créer Piazza dont nous avons besoin, nous juste, juste le faire dans les dossiers respectifs. Donc, la première chose que nous voulons dans ce composant et j'ai créé c'est tout impur hors de lui. Vous pouvez donc simplement ajouter ce que je suis sur le point de vous montrer au contenu par défaut du discours. Nous avons la navigation de page en haut pour lui faire savoir qu'il peut être obtenu outil à travers cette adresse véhicules slash créer. Je vais aussi injecter mon client HTTP, ainsi qu'un gestionnaire de navigation, qui est juste une bibliothèque qui nous aide à naviguer entre les composants dans notre blazer. Nous allons modifier notre balise h3. Et je vais juste mettre la même classe de titre de carte. Et cela va dire créer un nouveau véhicule au lieu de simplement créer. Et puis nous allons entrer dans la viande de tout ça. Bien sûr, vous savez, vous avez cette citation, que je vais juste mettre là. Donc, c'est essentiellement à quoi votre composant doit ressembler à ce stade. Donc, quand nous parlons de fermes, vous devez utiliser le composant intégré qui nous est donné par un blazer appelé Edit Form. Maintenant, ce formulaire d'édition prend quelques paramètres. Premièrement, il faut des paramètres sont nos attributs, eh bien, un modèle. Donc, fondamentalement, cela veut dire, que devrais-je vouloir type de données, devrais-je utiliser pour déduire quels champs je suis censé faire attention à un formulaire. Donc, si nous créons des véhicules, alors notre modèle doit être une forme quelconque d'objet de véhicule ou de valeurs de véhicule. Donc je vais dire au panneau véhicule. Mais alors, bien sûr, vous ne voulez pas avoir d'objet par le nom de véhicule, donc il va mentir pour fonctionner. Pour y remédier, je vais juste aller de l'avant et créer cet objet ici et l'initialiser à une nouvelle instance de véhicule en même temps. Et puis on voit que cette ligne rouge disparaît. Maintenant, il sait que c'est bon, il s'agit de véhicules. Regardez ici pour voir les points de données auxquels il a besoin de prêter attention. La prochaine chose que je voulais signaler maintenant serait ce qui se passe ou ce qui devrait se produire lors d'une présentation. Donc, nous pouvons voir que nous voulons sur, sur l'événement submit non valide, nous voulons un événement onsubmit. Je veux sur soumettre valide. Que voulons-nous donc faire lorsque les données ne répondent pas aux exigences ? Que voulons-nous faire lorsque quelqu'un clique sur Soumettre en général, et que voulons-nous faire quand quelqu'un clique sur Soumettre ? Et il n'y a pas de violation de validation à peu près. Donc, c'est ce que sur valide me soumettre. Et donc je vais juste travailler avec soumission non valide. Et puis je vais dire que je veux que vous appeliez cette méthode appelée create. Maintenant, une fois de plus, si je fais référence à cette méthode, je dois m'assurer que c'est entre guillemets. Je vais descendre et puis créer cette méthode appelée créer un véhicule. Donc tu peux aller de l'avant et faire ça. Cette ligne disparaît. Celui-ci, cependant, est là parce qu'il ne fait rien, mais nous allons bientôt Remy l'a fait. Et puis nous pouvons commencer à mettre dans les différentes parties du formulaire. Donc, les deux principaux composants que je vais mettre dans la forme nos balises seraient pour le validateur d'annotations de données ainsi que pour la validation. Et maintenant, nous n'accordons pas trop d'attention à la validation pour l'instant. Mais le fait est que nous avons des annotations de données que nous pouvons réellement mettre sur des modèles, mais en ce moment nous partageons les modèles avec la base de données. Donc plus tard, nous verrons pourquoi c'est une bonne idée de les séparer. Mais Farnell, tout en les partageant et nous le garderons comme ça. Donc, le validateur d'annotations de données ne sera pas le plus, il ne fera pas grand-chose en ce moment, mais nous allons le mettre là pour une utilisation ultérieure. résumé de validation signifie que si nous essayons de faire une soumission et qu'ils sont des points de données invalides, alors cela montrera que cela est nécessaire qui ne répond pas à cela, et cetera. Donc ces deux-là fonctionnent en quelque sorte main dans la main, mais quand nous commencerons à nous concentrer sur la validation plus tard, alors nous les verrons dans un meilleur axone. Sachez ce que nous voulons faire est de créer notre structure de ferme similaire à la façon dont Bootstrap aurait formé quelqu'un pour dire que la classe div est égale à former un groupe de tirets. Et puis à l'intérieur de ce groupe div, je vais avoir une étiquette. Donc la première boucle va être pour le micro. Et puis désolé, on le sait pour le micro. Nous ne voulons pas de zone de texte. Vous voulez une forme de sélectionner la liste déroulante, sélectionnez la liste. Donc, ce que je vais faire est que je vais juste mettre ceci dans un autre div et ensuite je vais utiliser une balise select et d'autres s'ouvrent et se ferment. Mais alors à l'intérieur de cette balise select, je peux dire que bind est égal à et à quoi dois-je le lier ? Il va être lié à l'huile de valeur au modèle et à la valeur dans le modèle, nous allons rencontrer l'ID parce que c'est pour moi. Donc je relie cette liste à l'ID du micro, non ? Et bien sûr, en accord avec les champignons, nous faisons une forme bootstrap. Je donne juste à celui-là la classe égale formée. Donc, la prochaine chose que nous devons prendre note est le fait qu'il s'agit d'une liste de machines à sous vide d'où les options provenant. Donc, si vous connaissez le HTML de base, vous savez, vous avez votre sélection, alors vous avez des options, options, des options, bien sûr, nous ne savons pas ce qui va être dans la base de données. Nous devons donc répondre à cette liste d'options aussi dynamique que possible. Donc, nous devons regarder la base de données, aka regardé à travers l'API pour nous rendre la liste de mix. Et puis nous pouvons l'utiliser pour générer dynamiquement ce que seront les options. Laissez-moi donc descendre à la section de code et je vais initialiser un objet de liste de types. Alors liste I liste. Je peux les utiliser de façon interchangeable. On m'a dit que ce n'est probablement pas la meilleure chose pour faire des bateaux dans cette situation. C'est bon. Donc on peut juste dire que je liste micro, je l'appellerais mix. D' accord. Et puis nous voulons que lorsque le composant se charge ou que la page se charge, le mélange soit rempli et prêt à être utilisé par l'interface. Donc, comme ce qu'on avait à faire avec l'index quand on en avait deux, laissez-moi juste sauter là-bas. Nous avons dû dire sur initialisé, je veux que vous alliez chercher la liste des véhicules. J' ai besoin de faire quelque chose de similaire et de créer non initialisé aller chercher la liste de mix. Donc je vais juste copier ça. Vous n'avez pas vraiment besoin de le copier, mais vous pouvez retaper Async protégé sur une tâche sur l'asynchrone initialisé à nouveau. Et ce que je vais faire, c'est au lieu de chercher des véhicules, parce que je viens de copier ceci à partir de la page d'index des véhicules. Mais au lieu de chercher des véhicules, je cherche du mix. Ça veut dire que je fais un client. Oui, HTTP accorde client.connect à partir de JSON, effaçant la liste du micro. Et mon point de terminaison ici serait le point de terminaison mix. On y va. Très bien, donc un null, fondamentalement quand, quand nous sommes initialisés, nous allons appeler le mix. Donc, j'ai besoin de remplir ceci avec les données une fois le mélange d'être récupéré. Donc, ce que je vais faire est de mettre dans une option par défaut qui dit de sélectionner le micro. Donc l'utilisateur sait que, ok, vous devez sélectionner le micro, très bien. Mais alors je vais voir et commencer par le signe at si le mélange n'est pas égal à null. Très bien, alors mix ou objet ici, qui est la liste de mix. Ici, c'est nul. On a traversé ça, juste savoir avec l'index. Donc, il va commencer comme nul, mais ensuite il va être rempli finalement. Donc, si ce n'est pas égal à null, alors pour chacun, disons moi, cela revient. Au lieu de mélanger, je veux créer une option, non ? Et la valeur de l'option sera en dehors de moi point ID parce que nous voulons suivre l'ID. Rappelez-vous que lorsque nous créons le véhicule où stocker vraiment dans l'ID micro, pas le nom. Ce nom est cependant ce que nous voulons afficher. Donc, dans la section pour la discipline est allé voir afficher le nom du point micro. On y va. Donc, il va générer autant d'options il y a de micros pour la sélection dans cette liste déroulante. Et c'est vraiment ça. Nous venons de créer notre première liste déroulante. Maintenant, nous en avons un pas et trois de plus parce que c'est la même chose pour le modèle et c'est la même chose pour la couleur. Ils sont tous stockés dans des tables de base de données, dont nous avons besoin pour charger dynamiquement le contenu lorsque nous traitons de ce formulaire. Donc, ce que je vais faire pour faciliter les choses, c'est juste répliquer cette structure ici pour le formulaire. C'était ainsi que MC. Celui-ci va être modèle. Et je vais juste changer fondamentalement tout ce qui est dit MC ID, je vais enregistrer l'ID de point de modèle. Ce sera des modèles, des modèles, et ce seront des modèles communs, des modèles, désolé, et model.py, nom model.py. Et où allez-vous faire la même chose pour la couleur ? Je fais juste quelques changements exprès pour accélérer cette opération. Donc les couleurs, les couleurs, c'est une couleur de graine commune et nous faisons juste ces changements rapidement. Donc non, nous avons pris des dispositions pour la liste déroulante micro, pour la liste déroulante du module, et pour la couleur abandonnée à ce sujet. Les lignes rouges indiquent cependant que nous avons besoin de ces objets respectifs. Et deuxièmement, nous savons déjà que nous n'avons pas configuré d'appels d'API pour eux. Donc, pour simplement terminer cette opération, nous pouvons mettre dans la ligne pour l'objet model ainsi que l'objet color. Et puis de la même façon que nous devions nous assurer que nous avons fait l'appel API pour initialiser mix. Nous devons le faire pour les modèles, et nous devons aussi le faire pour les couleurs. Très bien, il suffit de réparer ça. Tellement mannequins. Nous attendrons l'appel client pour obtenir la liste des modèles du point de terminaison des modèles, couleurs faisant la même chose, liste des couleurs du point de terminaison des couleurs et mélanger la même chose. D' accord, donc c'est tout pour les listes déroulantes. Et vraiment, vraiment, c'était une chose plus compliquée. Mais vous pouvez voir que si elle l'a fait une fois, vous pouvez le faire pour les autres. Alternativement, pour le select, il y a en fait un composant dans le blazer appelé input select, qui fonctionne assez similaire. Et je n'ai pas dit de similitude de parti, mais au lieu d'acheter, nous devons dire bind tiret, valeur. Ok, quelqu'un à laisser un comme sélection d'entrée, et je vais laisser les deux autres comme une sélection. Donc c'était notre code d'origine. Ceci utilise le composant rasoir, puis celui-ci est mappé au code d'origine. Mais nous allons juste remplir notre formulaire. Et puis nous verrons comment tout fonctionne sur les liens ensemble. Donc, notre prochain champ que nous voudrions que l'utilisateur saisisse est peut-être l'année du véhicule. Donc, je vais suivre le même groupe de formulaires de format, puis l' étiquette, puis un div qui va avoir mes entrées. Mais alors parce que l'année est un, laissez-moi juste corriger ces B majuscules, non ? Parce que l'année est de type entier, je vais utiliser le composant de numéro d'entrée, non ? Donc, le nombre d'entrée par n valeur véhicule dot année. Et puis vous ne voulez pas dire, je mets dans cette nouvelle, nouvelle section ici qui dit message de validation pour, et puis nous ouvrons ou est une syntaxe voir véhicule dot année. Donc, en fait, nous pourrions prendre ce message de validation et l'appliquer à tous les autres. Parce que le fait est que nous avons besoin d' une certaine forme de validation pour nous assurer que ces vallées sont sélectionnées. Encore une fois, nous ne prêtons pas trop d'attention à la validation, mais je les mets juste de null. Donc, je vais enregistrer le message de validation pour. Et puis nous avons en dehors des parenthèses ouvertes, puis ouvrez et fermez le point du véhicule flèche Lambda et puis le nom du champ. Donc celui-ci est pour Meek ID, celui-ci va être pour l'ID du modèle. Celui-ci va être pour l'ID de couleur. Et puis celui-ci est pour l'année, comme on le voit. D' accord. Le champ suivant serait le numéro de la plaque d'immatriculation, une fois de plus suivant le même format. Et cette fois, nous allons utiliser le texte d'entrée et nous sommes toujours la valeur, mais cette fois au numéro de plaque d'immatriculation. D' accord. Cependant, message de validation pour donc j'ai numéro de plaque d'immatriculation nous avons année, je pense que le prochain arrêt serait probablement le numéro d'identification du véhicule ou VIN. Donc celle-ci est la suivante. Donc form-groupe étiquette, texte d'entrée parce que notre Vin est une chaîne. Et puis, pour couronner le tout, je pense que les tarifs journaliers sont intolérants, alors je vais juste le mettre et ensuite les tarifs de location sont encore deux fois. Donc le numéro d'entrée est celui-là. Très bien, mais le point est que si vous ouvrez juste le crochet d'angle et écrire l'entrée de mot, vous verrez toutes les différentes options sont intégrées dans les composants disponibles pour vous avez case à cocher, date, fichier, radio, bouton radio , groupe, entrée, texte, zone, etc. Donc, tous ces composants sont intégrés aux forums et sont disponibles pour vous. Donc, dans notre situation, nous avons utilisé quoi, 33 différents nous utilisons le nombre, le texte et la sélection, et c'est très bien. Passons maintenant à notre conception et concentrons-nous un peu plus sur ce que nous voulons arriver une fois que vous soumettez. Donc, bien sûr, nous avons besoin d'un bouton de soumission parce que vous avez tous les champs, mais nous n'avons pas mis un Soviétique. Donc, mon bouton Soumettre, juste un type de bouton soumettre et le mettre dans la réunion de classe et battu succès néerlandais et bloc de l'industrie de la viande créer véhicule. Donc, c'est juste un bouton assez simple, mais alors nous devons faire la logique ne pas ici pour nous assurer qu'une fois qu'il, une fois qu'il est cliqué, il appelle cette logique et va effectivement de l'avant et exécute le mandat. Voyons donc ce qui doit se passer ici. Alors rappelez-vous que lorsque nous créons des données, nous devons faire un appel postal. Donc, j'ai déjà le modèle qui doit ou l'objet dans n'importe quel Submit Postel à l'API crée efficacement la ressource. Donc, ce qui se passe, c'est qu'il commence vide. Il, il définit le contexte pour le formulaire, mais alors quelles que soient les données qui y sont mises, C' est pourquoi nous avons cette liaison. Donc, quelles que soient les données mises en cours de route, nous allons en fait simplement être désossés au même objet, puis onCreate aurait ces valeurs. Donc, ce que nous devons faire ici serait d'attendre l' appel du client à notre poste en tant que JSON async. Encore une fois, il y a une méthode par verbe, donc nous avons regardé les gets nulled. On va regarder le poste. Où est-ce qu'on appelle ? Ce que nous appelons endpoints, point de véhicule, point de terminaison. Et je vais passer le véhicule comme l'objet qui doit être posté. Très bien, alors une fois qu'il est créé, nous aimerions revenir à notre page d'index. Donc, voici où nous pouvons maintenant utiliser ce NEF Monaco. Juste effondre ça. Donc maintenant, nous pouvons utiliser le gestionnaire NEF et dire assez gestionnaire point naviguer à. Et puis on voit juste, désolé, on dit juste que les véhicules slash slash slash. C' est vrai ? Alors prenons tout ça, travaillons pour un tour et vérifions ça. D' accord, donc je charge sur mon formulaire et je vois erreurs flagrantes ici et ce n'est pas un problème, ça les a corrigés ensemble. Donc, tout d'abord, cela devrait être, cela devrait être plus de contextes, mais je n'avais pas assez de discipline pour passer à travers et dire Sélectionner le modèle, sélectionner la couleur. En outre, mes contrôles doivent ressembler au contrôle Bootstrap. Alors commençons ensemble parce que si vous avez le même code que j'ai, alors vous les verrez aussi. Si vous ne tombez pas dans mes pièges, alors je vous salue. Donc, pour la sélection, pour la sélection par défaut, je les change pour sélectionner une couleur pour la couleur, sélectionnez micro pour moi. Et je vais mettre cette classe bootstrap, qui est le contrôle de forme sur chacun de ces autres composants pour m'assurer qu'ils partagent tous le même style. Donc, avec tout cela fait, je ne vois que quelques changements esthétiques. Laisse-moi redémarrer. Et nous y voilà. Donc, ça a l'air beaucoup mieux. Bon, alors sélectionnons, OK, voici notre liste déroulante avec notre mix de la base de données. Donc, le modèle Toyota. D' accord. Couleur Prius, c'est noir. C' est le modèle 2020. Le numéro de plaque d'immatriculation, quelqu'un pour diriger les leçons avec des chiffres similaires à ce que nous aurions en Jamaïque et le VIN. Eh bien, c'est souvent numérique, donc je ne pense pas qu'après, tu sais, être trop strict avec ça. D'accord. Et puis pour les prêts à taux journaliers, encore une fois, dans le contexte de la Jamaïque, vous louez probablement une voiture pour 3 000$ par jour. Et puis lorsque nous cliquons sur Créer un look de véhicule, il navigue sur l'outil ou la page d'index, et il est là pour nous de le voir. Très bien, Donc, nous venons de créer efficacement notre première ressource en utilisant l'interface utilisateur par opposition à l'API comme nous l'avons fait dans le passé. Donc je vais vous encourager à prendre ces connaissances, à les transférer aux autres. Donc, vous devez toujours vous assurer que les personnes peuvent entrer et maintenir la liste des mélanges parce que nous savons déjà que vous pouvez les voir. Mais nous pouvons voir et supprimer la rétine. Nous devons être en mesure de créer des modèles de formule cm, mêmes quatre couleurs pour les clients ainsi que pour les réservations. Très bien, donc les réservations, nous pouvons revoir les réservations ensemble plus tard parce que cela pourrait prendre un peu plus de forme physique, mais essentiellement aller de l'avant et transférer les connaissances et les faire. Et puis nous pouvons comparer les notes seulement retour. 27. Formulaire Créer la configuration - Partie 2: Hé les gars, bienvenue. Donc vous avez une mission et j'espère que vous l'avez complétée de toute façon, nous allons le faire ensemble. Donc, le défi était de transférer les connaissances déjà acquises de s'asseoir sur les véhicules, créer une forme et d'aller de l'avant et de les définir, créer des composants pour toutes les autres ressources que nous voulons permettre aux utilisateurs de pouvoir entrer. Ainsi fait des modèles, des couleurs, des véhicules, des clients, et des réservations. On a fait des véhicules ensemble. Donc, juste pour un examen rapide, nous pourrions naviguer vers le composant des véhicules. Nous avons nos listes déroulantes qui sont remplies dynamiquement avec des données basées sur ce qui se trouve dans la base de données. Courtoisie pour API. Alors faites le modèle, la couleur. Tous ceux sont API et formés. Et puis nous avons notre numéro d'entrée. L' entrée prend un numéro d'entrée. Nous avons donc vu que nous avons les différents composants d'entrée nous sont donnés à travers les jeux ou hors de la boîte. Et comment nous pouvons personnaliser les autres en utilisant le code HTML sélectionné ou la balise select qui nous est donnée par un blazer. Maintenant, ce que nous voulons faire est de parcourir les autres écrans ensemble juste pour nous assurer que nous sommes tous sur la même page. Donc, je vais commencer par quelques-uns des plus faciles qui seraient des modèles mixtes et des couleurs parce que tout ce qui est vraiment là sous cette forme est le nom. D' accord, donc un autre micro aurait été WWF t'a dit de mettre Nissan. Testez créer un micro. On y va. Maintenant, nous avons Nisan dans la liste. Donc, si nous revenons juste en arrière et examinons le code pour cela, il semble assez identique aux véhicules dans les parties supérieures où nous avons la page avec le chemin fait slash 12 heures client HTTP et gestionnaire nav être injecté ou petite balise au sommet afin que les gens sachent exactement où ils se trouvent dans l'application. Et puis nous avons notre formulaire d'édition, qui utilise le modèle d'un objet appelé meek. Et puis nous savons que nous avons notre objet principal initialisé dans le code. Et puis sur des soumissions valides, nous avons créé micro, que nous avons aussi dans le code. Et puis nous avons nos annotations tandis que les données et le résumé de validation. Ensuite, nous passons à dire texte d'entrée et lier la valeur de tiret, faire dotnet. Très bien, et nous lui donnons le contrôle de formulaire et avons le message de validation. Et nous avons notre bouton. C' est vraiment ça. Maintenant, la méthode non initialisée est en fait vide et sans doute nous pourrions nous en passer. Je veux dire, ça ne fait rien. On n'a pas eu à le retaper. Mais juste au cas où il y aurait quelque chose que vous voulez faire juste avant le chargement de la page ou au fur et à mesure que la page se charge, vous pouvez toujours mettre cette méthode dans. Très bien, donc je l'ai laissé là dans tous les composants juste au cas où, mais juste en vous laissant savoir que vous pourriez l'avoir ne pas faire quoi que ce soit ou pour un code plus propre, sans doute plus propre, vous pourriez simplement l'omettre car c'est vraiment juste une override tout façon de créer micro, continuer à dire attend client.read post en tant que JSON asynchrone, et rappeler le passage de point de terminaison approprié de l'objet que nous voulons créer, puis nous revenons à notre page d'index. Maintenant, c'est le thème général des modèles et des couleurs. Donc juste regardé les marques, si nous regardons les modèles et nous allons regarder les couleurs, c'est à peu près la même citation. Littéralement, copiez de moi, cliquez sur, Créer, puis collez dans le suivant. Donc celui-ci serait effectué des modèles et tout ce que j'ai fait était Control F et trouver toutes les choses qui ont dit MON majuscule M avec beaucoup de cas sur et de les changer à. Et le modèle, et j'ai fait la même chose avec le micro en minuscules et le modèle en minuscules. Et avec cela, je n'ai pas eu à changer d'autre code parce que tout le reste est tombé en ligne parce que les champs sont à peu près les mêmes et c'est assez facile à répliquer. C' est la même chose pour le modèle. Et encore une fois, la même chose pour la couleur. Nous allons créer des slash de couleur, et tout le reste ressemble à peu près de la même façon. Très bien, donc le, les modèles sont clairement différents pour les différentes pages Créer. Maintenant, regardons les forums de création de clients. Donc, sur le nouveau formulaire client, ce n'est pas trop inquiétant. Un bateau que nous avons tucks, numéro d'identification, adresse e-mail, numéro de contact, ainsi que l'adresse. Maintenant, une chose à noter, assurez-vous que vous utilisez le composant panier par rapport au type de données du panier parce que même si c'est le numéro d'identification fiscale, il indique le nombre, mais la réalité est que dans différents territoires, ce nombre peut être juste alphanumérique, ont des caractères spéciaux. Par exemple, en Jamaïque, nous avons tendance à utiliser des tirets entre nos chiffres. D' accord ? Donc, vous voulez juste faire attention que vous n'utilisez pas leur propre champ pour ce type de données. Quoi qu'il en soit, nous allons juste aller de l'avant et créer certains clients de livre ont effectivement créé ce client déjà, mais je vais juste le faire et créer un client. Dites voir, ici, nous avons nos clients en cours d'affichage. Bon, alors jetons un coup d'oeil aux réservations. Donc, réservation cependant, laissé pour la dernière parce qu'il sans doute eu le morceau de code le plus compliqué. Mais je vais masquer le formulaire client juste pour que vous puissiez voir exactement ce qui a été fait. Donc, nous avons chaque section de formulaire, texte d'entrée pour l'ID fiscal, adresse e-mail, numéro de contacts, ou adresse, zone de texte d'entrée eras. Disons que vous ne voulez pas commencer ce genre de plus grand que la zone de texte normale parce que cela prend juste de l'ère. Et puis le reste est à peu près conforme à ce que nous avons vu. Sinon, personne ne passerait à la réservation. Nous voyons une saison différente. Un. C' est une liste déroulante pour les véhicules. Mais remarquez comment j'énumère tous les véhicules. Je les énumère essentiellement par leur nom, non ? Toyota Prius. Et puis j'ai mis là-haut et c'est le numéro de licence. aurais pu mettre plus de détails, mais nous allons juste travailler avec cela pour null, le client, nous avons mis les points ID un tuyau et l'adresse e-mail pour ledit client, puis la date, remarquez qu'il affiche réellement la date d'aujourd'hui, la date à l'heure. Et puis nous avons le contrôle Callender qui nous permet de le changer. Et ce calendrier aura l'air fondamentalement le même dans n'importe quel navigateur basé sur le chrome. C' est Internet, désolé, c'est Microsoft Edge. Vous aurez la même manière dans Chrome, mais cela pourrait sembler différemment dans Firefox. Et bien que je ne suis pas tout à fait sûr de ce que cela pourrait ressembler à l'opéra, mais le fait est qu'il peut ressembler différemment à travers les différents navigateurs. Donc, vous voudrez faire attention à cela. Mais le fait est que le contrôle du calendrier nous est donné courtoisie de ce composant ou du type qu'il déduit, n'est-ce pas ? Laissez-moi juste vous montrer le code qui est derrière ce rendu hors de la ferme. Donc, une fois de plus, la mise en page générale est la même. Encore une fois, la cohérence. Après un certain temps, vous commencez à réaliser que vous répétez des choses comme, vous savez, chaque fois que nous devons lier cette classe h3 et voir cela, donc vous pourriez penser à en faire un composant à part entière. Je l'appellerais juste un composant et probablement passer ce qui est unique. Donc, si nous voulions changer la façon dont nous montrons le titre, nous n'avons pas à le faire 20 endroits différents, mais nous le ferons plus tard. Donc je suis juste, je vous donne juste des idées sur la façon dont les composants peuvent vous faciliter la vie. Revenons à notre formulaire. Nous avons notre formulaire d'édition Basé sur le site de réservation ou la fonction de soumission valide, qui et ce que nous avons vu, peu importe la complexité du formulaire, la soumission non valide est à peu près la même tout le temps. Nous le passons à l'API, puis nous naviguons sur notre chemin, n'est-ce pas ? Mais alors faisons attention à ce qui se passe ici. Donc une heure de bonus de chute pour les véhicules. Nous savons que nous devons aller à l'API et ensuite où obtenir la liste des véhicules. Donc, nous sommes familiers avec cela basé sur ce que nous avons fait sur le discours du véhicule cette fois où obtenir les véhicules cependant. Mais pour les listes déroulantes réelles, désolé, mauvais pour l'ère de la liste déroulante réelle, nous avons l'ID du véhicule correct. S' il est lié à ce véhicule. Et si les véhicules ne sont pas connus, alors pour chaque véhicule de la liste, alors nous voulons générer une option qui a la valeur de l'identifiant de l'enregistrement du véhicule. Mais alors regardez ce que j'ai mis dans la section d'affichage. Donc, je suis juste en train d'afficher divers détails du véhicule. Ensuite, faites le nom du point de modèle, et puis j'ai ce tuyau, puis le numéro de la plaque d'immatriculation. Très bien, donc vous voulez disposer les données à l' utilisateur afin qu'ils puissent savoir exactement quel véhicule il est, parce que probablement il serait utile de même mettre la couleur quelque part là-dedans. Donc, ce serait une Toyota Prius noire ou une BMW X5 bleue au soleil. Mais c'est à vous de décider. Mais je te montre juste quoi, ce que j'ai fait, n'est-ce pas ? Pour obtenir les types d'écrans les plus complexes, ce n'est vraiment pas si difficile. Et puis dans la section client, très similaire, nous avons dû aller chercher la liste des clients une fois de plus de l'APA, les remplir, d'accord ? Et puis pour chacun d'eux, nous générons l'option avec le client point idées de valeur. Ensuite, nous affichons la table des matières, disons que le séparateur et l'adresse e-mail pourraient donner plus de détails, pourraient en mettre moins, n'est-ce pas ? Le fait est que c'est votre application, vous voulez la rendre aussi conviviale que possible. Mais une fois que vous comprenez comment manipuler vos données est la chose la plus importante. Maintenant, pour la date, remarquez que la mienne affiche la date d'aujourd'hui. Je ne suis pas sûr que si vous êtes un est que vous venez probablement d'obtenir ces données par défaut de 0 sur barre oblique 01 trois zéros sur la droite. La raison en est que le type de données que nous utilisons est de type date, n'est-ce pas ? C' est le moment. Donc il l'a fait oh, c'est de type datetime. Par défaut, je l'ai fait. Le temps ne peut pas être nul. Il doit avoir une certaine forme de DID. Et les données que vous voyez probablement sont celles par défaut. Ce n'est pas très convivial. Alors. Ce que j'ai fait était en déclarant l'objet à utiliser pour le formulaire en tant que modèle pour le formulaire, je, les données initialisées devraient être datetime dot-dot, dot-dot-dot. Donc quoi que ce soit, vous savez, point datetime obtient maintenant un horodatage exact en tant que null. Ce que je ne veux pas que le temps tombe. Je n'ai pas besoin de 12 heures. Alors je dis juste que donne-moi au D8, le niveau de détail que tu y as mis, c'est à toi de décider. Pas de problème. Encore une fois, votre application, vos besoins pourraient être différents de ce que j'exprime ici. Mais encore une fois, je veux juste faire passer les concepts fondamentaux. Donc, j'initialise cet objet que nous pouvons le faire à n'importe quel moment nous voulons que le formulaire charge avec des données, nous pouvons dire à notre objet POV, ce bit de données de sorte qu'au moment où il est désossé ici, n'importe quel champ qui a bind affiche automatiquement les données correspondantes qui ont été préchargées. Très bien, pour que tout ça, je reçois cette date pour être affichée et amusante un composant de date d'entrée, c'est pourquoi nous obtenons le Callender. D' accord ? Et puis en dehors de tout cela, nous avons la réservation de base de création où nous venons de l'envoyer à travers le point de terminaison et naviguons toujours. Alors laissez-moi créer une réservation pour ce client qui loue tous tar Toyota Prius créer la réservation et je suis sur elle. Pas de problème. Je n'ai vraiment pas testé ça avant cette conférence. Alors, examinons cette époque pour nous donner un peut toujours cliquer avec le bouton droit de la souris aller à Inspecter. Allez sur la console de votre navigateur. Et puis on vous montrera ce qu'est la flèche. Donc ici, en lisant l'air en mer et qu'il y a 500 réponses sur le stand. Et puis vous verrez que c'est en train de se passer la ligne 63 de nos tableaux de points d'index ou le pH. Donc, c'est la ligne 63 de index.js sont, voyons quoi et c'est notre appel d'API pour notre page d'index. Non, nous ne sommes pas tout à fait sûrs de ce qu'est le problème. Et si nous vérifions, nous avons vu le message dans le navigateur ne nous a pas beaucoup aidé, mais nous avons cette fenêtre de sortie à laquelle nous avons accès. Fondamentalement à chaque fois qu'il se passe le débogage, non ? Donc, Microsoft ou dotnet Core se connecte toujours à cette fenêtre. Donc, si je fais défiler un peu vers le haut, commencer à voir les mêmes zones qui sont encore plus d'erreurs sont plus de détails d'erreur que ce que le navigateur a été affiché pour moi. Donc, c'est un bon moyen pour vous de savoir comment déboguer vos applications lorsque vous obtenez ce genre d' erreurs parce que cela a fonctionné avant et de savoir qu'il a cessé de fonctionner. Pourquoi ça a cessé de fonctionner ? Donc, il dit quelque chose ici, un bateau, une erreur et une exception s'est produite lors du calcul du contenu de l'ère de base de données. Je ne sais pas si c'est tout. Ce que nous voyons ici, la même chose que dans le navigateur. Si je continue à défiler vers le haut, alors peut-être voir plus de détails. Je commence à voir des choses. J' ai acheté JSON, sérialisation JSON et je monte et monte. Et puis au début de cette pile, trace est un cycle d'objets possible est détecté. Cela est dû à quelque chose, une référence là-dessus. Donc je connais ce message, je sais exactement ce qui ne va pas. Ça ne vous dit pas forcément quel est le problème, mais je vais vous guider à travers celui-ci. D' accord ? Alors que se passe-t-il ? Et je vais juste obtenir beaucoup de débogage réel rapidement et sauter à notre objet pour la réservation. Ce qui se passe, c'est qu'il peut y avoir des moments où nous essayons de récupérer des objets et d'inclure des détails supplémentaires. Mais les détails supplémentaires sont les objets supplémentaires que nous essayons d'inclure, a, les relations doivent contenir des objets de l'objet. C' est déroutant. C'est ce qu'ils entendaient par cycle. Quelques flèches de référence du cycleur. Donc la réservation contient un véhicule, mais le véhicule contient une liste de réservations, n'est-ce pas ? Donc, fondamentalement, ça devient confus parce que ça veut dire que tu veux une liste de réservations. Vous souhaitez inclure les détails du véhicule, mais les détails du véhicule incluent également une liste de réservations, donc cela peut devenir confus, et c'est un problème courant avec les API en fait. Donc, de façon générale, nous résolvons cela en utilisant cette bibliothèque appelée « soft » de Newton. Donc, je vais juste faire un clic droit sur notre projet de serveur et nous allons aller à Gérer les paquets NuGet. J' ai déjà le paquet installé, mais ce que vous allez chercher est le soft de Newton. Et juste laisser cette recherche et puis vous voulez que celui-ci Microsoft n'est pas vitesse dotnet cours notre ASP NET Core point NVC point NVC doux JSON de Newton. Donc, vous voulez juste cliquer dessus, qui ne se chargent pas. Eh bien, vous verrez installer ou vous voyez que la flèche noire l'a déjà. C' est pourquoi je vois le X rouge. Allez-y et installez-y. Et puis une fois que cela est fait, vous voulez aller au fichier de démarrage pour le projet serveur. Allez bien que tout le chemin vers le bas à cette ligne de services point ajouter des contrôleurs avec des vues. Et puis vous allez ajouter le code suivant. Dot ajouter le JSON doux de Newton. Et puis nous allons lui donner une initialisation et les options vont voir o p avec notre erreur Lambda, désolé, flèche Lambda. Mais, et là, nous voyons o p point Syrie, Syrie, paramètres de sérialiseur sir. Et laisse-moi aller aux neuf prochains pour que ce qui se passe soit clair. Très bien, pote plus Smith. Donc Sara Lazar, paramètres de référence point, gestion de boucle. C' est ce qui se passe. Ça provoque notre boucle de référence. D' accord, donc la gestion de la boucle de référence est égale à et je vais juste aller voir Self.age JSON gestion de la boucle de référence de données Self.age de Newton ignorer le point. D' accord, donc en d'autres termes, nous voyons oui, vous pourriez finir avec notre boucle de référence, faire beaucoup à ce sujet. Faites ce que vous avez à faire et obtenez acheté les données. Donc, c'est à peu près ce que cela va dire à l'API qui est dans nos projets de serveur. Donc, nous allons Australie, c'est comme certains naviguer vers les réservations. Et bien sûr, vous savez, nous devons d'abord nous connecter. Et puis après que nous nous connectons au moment de la vérité, donc K véhicules désolé, J'ai dit réservations et là nous allons. Non, nous voyons nos réservations avec les détails appropriés fonction de ce que nous avions l'intention de faire figurer sur la page d'index. Donc, c'est en fait une erreur très courante avec les API. C'est un bon moyen. Un bon ouvrier possédé. Le soft de Newton a vraiment bien fait pour gérer cette erreur. Alors voici le code. Une fois de plus, nous venons d'ajouter cela au pilote dit contrôleur d'ajouter avec des vues. Si vous utilisez uniquement une API que vous n'avez probablement que des contrôleurs AD. Comme la méthode ici, Services dot-dot-dot contrôleurs. C' est la même chose. Il suffit de l'attacher à la fin des parenthèses et ça devrait fonctionner. Donc, à ce stade, nous avons franchi une étape importante où nous avons mis en place nos formulaires de création pour l'ensemble de nos diverses ressources. Donc maintenant, vous savez comment permettre à l'utilisateur d' entrer des données à travers votre blazer haut et le stockage dans la base de données. À partir de cela, nous allons examiner comment nous leur permettons de modifier les données qui ont été introduites. Parce que quand on regarde la réservation, on verrait que ça va, il y a une date et mettre à jour l'ancien rétinol. Tout ce que nous affichons, c'est les données. En fait, j'avais effectivement commenté cette colonne ici qui serait mort en moins 0, 2, je sais va causer un problème parce que lorsque nous actualisons et essayons de recharger la page de réservations no. En montrant la colonne manquante, regardez ce que vous voyez. Donc ce n'est pas une valeur raisonnable juste là parce que le Dayton a un temps de coma Xia, nous savons qu'il va par défaut à la barre oblique 0 1. Donc, quand il fait le calcul, il va nous donner un négatif depuis cette date jusqu'au jour où nous avons eu. Ce sera donc un problème. De toute façon, nous pouvons réparer ce cosmétique parce que nous pouvons facilement mettre dans une déclaration if pour voir s'il n'y a pas de date à venir du modèle, puis afficher autre chose. Sinon, affichez la durée en jours. Cependant, nous devons configurer le formulaire d'édition parce que lorsque quelqu'un amène la voiture, il doit mettre à jour l'enregistrement de réservation existant avec le retour. Sinon, nous avons besoin de l'édition pour tous les autres. Donc, nous verrons comment ça marche dans quelques uns. 28. Formulaire de mise à jour de configuration - Partie 1: Hé les gars, bienvenue. Donc, dans cette leçon, nous allons envisager de mettre en place le formulaire d'édition ou de mise à jour pour notre application. Donc, dans cette leçon, nous allons regarder quelques choses. Premièrement, comment nous pouvons créer des composants réutilisables et réutilisables réels, et comment nous pouvons implémenter des paramètres et 3, comment nous pouvons implémenter ce que nous appelons des rappels d'événements. Donc, la genèse de toutes ces choses à regarder dans une simple opération d'édition serait le fait qu' un formulaire d'édition ressemble exactement à un formulaire Créer. Et je ne sais pas souvent que tu auras les mêmes champs. Les opérations ne différeront que parce que l'on crée des données sur l'on modifie les données existantes. Cependant, en ce qui concerne la batterie de serveurs, de manière générale, vous aurez les mêmes ensembles de champs que vous utilisez pour créer que vous voulez que l'utilisateur puisse modifier. Bon, donc on va commencer par un simple et je vais utiliser les micros pour créer une forme, non ? Donc, ce que nous devons faire est de créer un composant qui a cette forme en elle pour commencer. Donc, je vais faire un clic droit sur mix et je vais aller de l'avant et ajouter un composant de rasoir. Je vais appeler ça des composants agricoles, rien de trop fantaisie. D' accord. Et je veux dire, j'espère que c'est explicite. C' est un composant pour le formulaire. Et ce que nous voulons dans ce composant de formulaire est le formulaire d'édition réel. Donc, tout ce qui est entré dans le, dans le formulaire d'édition que nous avons mis sur notre composant Créer. Nous voulons que tout cela, au moins cette partie, les pièces réutilisables soient dans nos contrôleurs de forme, les composants de la ferme, désolé. Donc, je vais supprimer ce HTML et le remplacer par le formulaire d'édition. Et tout est à peu près reste le même. Mais nous voulons également spécifier certains paramètres pour ce composant. Cela signifie que nous pouvons mettre en place nos composants de telle sorte que lorsque nous l'invoquons, nous transmettons des valeurs. Donc, juste de la même façon que je voudrais éditer le forum, nous avons dit que le modèle est égal à quelque chose sur un envoi valide est égal à quelque chose. Ce ne sont vraiment que des valeurs de paramètres qui sont intégrées dans le composant de formulaire d'édition. Donc, mon composant, qui est un composant d'élevage, doit avoir un paramètre. Donc, les accolades carrées ouvertes écrivent le paramètre de mot et puis je vais dire qu'il devrait prendre un paramètre de type mic avec le nom mic qui va correspondre avec ce modèle qui est transmis. Bon, Paramètre suivant, nous voulons quelque chose pour déterminer le texte du bouton parce que c'est une ferme raisonnable, donc je ne veux pas qu'il dise créer tout le temps au cas où je suis en train d'éditer. Très bien, donc nous voulons définir contextuellement ce qui prend, est imprimé boutons ouverts. J' ai un paramètre nommé texte de bouton, qui est de type chaîne. Et il va avoir une valeur par défaut de save. Donc, cela signifie que si je ne fournit pas de valeur pour ce paramètre, alors il va juste dire Enregistrer, sinon nous pouvons le remplacer. Donc je peux savoir, remplacez ce texte statique par le texte dynamique qui est dit par tout ce que Valley est passé dans. Et encore une fois. Ceci définit une valeur par défaut de C si aucune valeur n'est transmise. Le troisième paramètre que je vais avoir est celui appelé sur soumission valide. Et celui-ci va être de type événement appelé Bach. Donc, c'est comme un délégué de gestionnaire d'événements pour voir, ok, quelle méthode devrais-je appeler cela à la place de ceci. Soumettre donc invalide, c'est ce que j'appelle le paramètre. Donc, je vais dire que la soumission non valide est égale à la signature sur les soumissions valides. Cela signifie donc que quand quelqu'un appelle ce composant de formulaire, il peut fournir un objet micro. S' il est vide, nous voulons supposer qu'ils sont sur le point d'en créer un. S' il est rempli, nous supposons qu'ils sont sur le point d'en éditer un. D' accord ? S' ils passent, ils peuvent voir, eh bien, quand je suis en train de modifier, je voulais dire Enregistrer les modifications. Si je crée, je voulais dire créer, quoi que ce soit. S' ils n'empêchent pas celui-ci, nous avons une valeur par défaut de toute façon. Et puis ce paramètre voit quelle méthode dois-je appeler. Donc, quel que soit le nom de la méthode qui est passé ici, c'est la méthode que nous appellerons non valide. C' est donc notre composante de l'avant-bras. Maintenant, nous avons un peu de refactoring à faire à la fois l'édition, eh bien à notre crée ce qui me permet de configurer la page d'édition en premier afin que vous puissiez voir exactement comment elle se lie. Et puis nous pouvons revenir en arrière et modifier nos créations. Donc, dans le même mix, nous allons aller de l'avant et ajouter RA sont des composants et nous allons l'appeler edit, edit dot, rasoir. D' accord, et puis nous allons de l'avant et injectons la chose habituelle ainsi que défini notre racine de page deux. Donc, le pH est égal à slosh MC slash edit. Et puis nous spécifions ici que nous attendons un paramètre. Donc, cet identifiant deux-points dans DC et j'ai besoin d'un paramètre qui soit appelé ID. Et il devrait être de type int. Très bien, donc il y a un paramètre de mot-clé, donc je dois dire à ce composant une fois de plus, C'est ça a besoin d'un paramètre et je vais l'appeler paramètre public int id. Donc, ce nom de propriété doit correspondre à n'importe quel nom que je définis en haut, ici. Et ça mettrait ça pour s'asseoir. D' accord, ensuite, je dois me définir. Donc MC ou un objet de moi est plutôt égal à une nouvelle instance. Et puis la première chose que je dois faire quand mon composant se charge est de récupérer le nécessaire C'est sa demeure à éditer. N' oubliez pas que lorsque vous modifiez, cela signifie que les données existent. Donc, cela signifie que je dois aller et obtenir l'enregistrement avec l'ID qui a été fourni parce que la personne aurait cliqué sur un et dit, je veux éditer cet enregistrement. L' ID est cinq, nous avons besoin de ce carton rouge, donc je vais mettre en protégé est de voir override pour la tâche sur le paramètre. Sit, c'est dire, d'accord, si protégé Async sur une tâche. Paramètres définis. Il semble que cela signifie une fois que les paramètres fournis, que dois-je faire ? Donc, notez que dans les précédents, nous avons probablement eu sur initialisé, donc il n'est pas utilisé ici. D' accord. Eh bien, sur cette situation, je ne veux pas qu'il soit dans non initialisé, je le veux et quand il y a un paramètre sit, Ok, donc sur les paramètres définis est évier. Qu' est-ce que je veux faire ? Je crois qu'il me manque un S ici. Les périmètres fixent une graine. On y va, tout droit. Donc, nous y allons, juste obtenir la carte filante sur les paramètres, asseyez-vous asynchrone. Donc, une fois que je veux faire maintenant est de remplir mon objet micro avec un appel au point can I int, puis obtenir de JSON est évier était que je voulais obtenir le bon enregistrement et je veux qu'il sérialise en tant que micro. Et puis je vais appeler les points de terminaison. Et c'est MC, donc c'est le point de terminaison micro qui fait des points de terminaison, non ? C' est donc notre point de terminaison que nous appelons. Mais alors j'avais besoin de passer la carte d'identité aussi, non ? Donc, cela signifie que j'ai besoin de mettre en forme ou d'appliquer un peu plus de finesse à ce point de terminaison. Parce que rappelez-vous que notre point de terminaison GET, laissez-moi juste aller à mélanger et vous montrer que le point de terminaison obtient. Encore une fois, nous cherchons à obtenir celui-ci. Donc, soit il pourrait être cinq, non ? Nous devons donc être en mesure d'appeler ce point de terminaison particulier. Donc, pour le formater, je vais utiliser l'interpolation. Donc je vais les assigner et les envelopper dans cette fête avec des accolades. Donc nous appelons le point final. D' accord ? Et laissez-moi écrire leur but, puis barre oblique, parce que je n'ai pas de barres obliques sur les terminaux. On y va. Rappelez-vous que nous avons enlevé les barres obliques, donc nous disons barre oblique. Et puis je vais transmettre la valeur de l'ID. On y va. Très bien, si semblable à la façon dont nous avons modifié notre micro et je dois fermer ma guillemet. On y va. La prochaine chose que je veux faire est de définir ce qui devrait se passer après avoir cliqué sur ce bouton. Alors rappelez-vous que nous n'avons pas commencé à regarder la puissance visuelle, juste en codant les choses des événements. Et puis je vais vous montrer comment nous pouvons tirer parti de cette pièce d'art. Je vais appeler cette tâche asynchrone, édite-moi. Très bien, donc quand, quand, quand nous cliquons sur Soumettre sur le formulaire d'édition, je voulais appeler edit make. Qu' est-ce que je veux faire ? Eh bien, je vais dire, j'attendrai mon appel client pour mettre en JSON asynchrone, et m'asseoir. Donc le client a jamais verbe. Qu' est-ce que je mets ? Eh bien, tout d'abord, quelle est l'URL ? Donc, mon URL serait des points de terminaison, point mic fait point de terminaison. Et puis les données que je mets o seraient le paramètre suivant, ce qui serait fait. D' accord ? Parce que rappelez-vous que nous sortons ensemble, donc je dois fournir les données à l'objet. On vient juste d'avoir l'objet. Vous auriez été modifié et savez que cliquez sur Soumettre, nous allons répondre à cet appel et dire effectuer un PUT en utilisant ces données sur ce point de terminaison. Droit ? Après cela, je veux naviguer quelqu'un, juste dire, désolé assez gestionnaire, Points, navigue outil et puis juste naviguer à la maison. Tout comme ce que nous avons fait sur le Create. D' accord, un peu en avant. Encore une fois, nous acceptons appartements sont appelés ID et ce lien, cette URL ou acquiert ce paramètre. Nous définissons ou micro objet et l'initialisons. Et puis nous remplissons il veut que les compteurs de puissance soient prêts à l'emploi. Et puis nous allons de l'avant et faisons nos modifications. Cependant, qu'en est-il des choses visuelles ? On n'a toujours rien fait d'autre que cette étiquette h3, non ? Donc pour le formulaire, je peux appeler mes composants de la ferme, non ? Donc oui, quand modifier le formulaire, mais comme nous l'avons déterminé, modifier le formulaire est vraiment juste le forum intégré où la validation des données et les annotations sur tel, nous avons les champs et ensuite nous avons le bouton. Toutes ces choses sont communes entre l'édition et ils créent. Donc, nous le mettons dans ce composant de formulaire et maintenant nous pouvons appeler des composants formels et regarder ce nœud. Je peux fournir des valeurs pour notre texte de bouton et envoyer non valide. Rappelez-vous que ce sont des paramètres que nous avons dit que nous voulions le texte du bouton droit et sur soumettre valide. Alors allons-y pas à pas. Donc le texte du bouton, peut-être que je veux que mon bouton voie la droite. Et puis pour la soumission non valide, j'ai besoin de fournir la fonction qui devrait être appelée une fois que nous avons appuyé sur le bouton. Soumettre donc invalide, vous savez qu'une fois que nous avons appuyé sur le bouton, il va aller à soumettre non valide et appeler n'importe quelle fonction que nous mettons ici. C' est ce qu'il fait dans la création. Si nous revenons juste à la Créer, c'est ce qui a fait que les rouges sur l'envoi valide crée micro. Il saute, ne le fais pas et va ici. C' est codé en dur. J' avais besoin de dynamique parce que je ne sais pas si je crée un montage RFM. Donc, à partir du composant edit gomme, j'appelle ce composant de formulaire dynamique et ce dynamique, ce paramètre. Je vais lui dire que je voulais appeler Edit Mic. est donc la méthode que je veux ce composant de formulaire appelle quand il y a une soumission valide. Et puis le dernier paramètre que je dois fournir est make, parce que je l'ai vu. Laisse-moi le retrouver. Le modèle va être égal au micro de signe, non ? Donc, il s'attend à un micro ou à une certaine valeur environnementale de type micro. Donc je vais juste passer dans le très doux que nous sentons ne pas entendre, non ? Alors. C' était un MC égal à MC. Et puis je vais juste fermer ce paramètre, débarrasser de toutes ces erreurs qui peuvent mettre à l'extérieur et ils ont raison. On y va. Alors mettez nos annonces. Cependant, faites moi et notre mise à jour. D' accord. Laissez-moi juste vérifier que j'avais un lien vers l'édition sur. Oui, je l'ai fait. Donc mélanger une barre oblique, modifier une barre oblique. Et c'est pourquoi nous passons une fois de plus sur l'ID micro parce que nous l'avons défini pour prendre ce paramètre. Alors laissez-nous coller ou éditer pour un tour. Ok, alors où c'est notre liste de mixage. Et je vais juste en créer un tout nouveau. Donc celui-ci était censé être Honda, mais on a fait une erreur ou une rotonde sur l'iPhone. Non. C'est bon. Laisse-moi penser à quelque chose, c'est que nous n'avons pas encore Jaguar. D' accord, donc c'est du jaguar. Jaguar, donc je dois l'éditer. Donc je vais frapper mon édition et regarder où nous allons. Donc, cette forme identique à la forme de création, cela n'a pas de sens. Nous écrivons cette ferme deux fois. D' accord ? Je veux dire, peut-être que la situation l'exige. Et si c'est le cas, alors les mêmes principes que vous venez d'utiliser sur le formulaire de création, vous pouvez les réappliquer sur le formulaire d'édition, la balise de formulaire d'édition, et vous savez, tous les champs dont vous avez besoin et tout ce qui convient dans cette situation, Je n'ai pas besoin, je ne veux pas avoir à les écrire deux fois. D' accord. Donc, je vais juste changer cette mise à jour et regarder ça. D' accord. Ça n'a pas marché tout le péage qu'elle attendait. Prenons un peu de recul et évaluons. Donc, je regarde en arrière le code et je pense que je vois quel est le problème. Nous n'avons pas formé cette URL correctement, donc mon erreur, permettez-moi de revenir au fichier put, désolé, mauvais, mais à la méthode put dans le contrôleur de mix. Et ce qu'il devrait avoir, c'est l'URL avec ce paramètre d'ID. C' est ce que nous avons mal fait. Laisse-moi revenir en arrière. Et l'URL doit en fait ressembler à ceci. Très bien, donc je vais juste l'utiliser et remplacer cela fait des parties du point de terminaison de son ID barre oblique parce que nous devons passer valeur de l'ID car elle est utilisée pour une validation lointaine en cours de route. Très bien, donc nous allons devoir le faire et ensuite nous transmettons les données à mettre à jour aussi. Essayons encore une fois. Donc, je vais entrer, éditer Jaguar, mettre sur le r, mettre sur le r, puis nous cliquons sur Mettre à jour, et là nous l'avons mis à jour. C' était donc juste un problème d'URL. Mais nous voyons comment nous pouvons utiliser nos composants réutilisables pour faciliter l'édition. Maintenant, comme il est douloureux utilisable, le but est que je peux savoir refactoriser notre crée PJ pour utiliser ces composants de formulaire. Et l'avantage de cela, une fois de plus, est que nous avons moins de système de police maintenu. Parce que si demain nous entendons qu'il y a un autre champ qui doit aller dans la base de données. Et bien sûr, si c'est dans la base de données, alors il doit probablement être dans les écrans de création et d'édition. Ensuite, au lieu d'avoir deux formulaires à modifier, nous avons juste le composant formulaire. Donc, pour le Create, je peux simplement supprimer tout cela et faire une référence à nouveau pour former le composant. Et juste en remplissant le reste des paramètres que j'aurais le bouton prend le micro, le micro étant égal à moi. Encore une fois, cet objet que nous avons initialisé, remarquez qu'il est vide, nous ne réparons rien. Donc, quand il passe, il n'a pas de données à précharger dans notre composant. Et puis sur soumission valide, nous appelons la méthode create MC. Très bien, Donc nous permet de créer un plus doux et puis de l'éditer et nous pouvons envoyer de cette active. Donc, je vais créer un nouveau micro. Cette fois, nous allons faire haut le jour créer, faire. Nos annonces sont nouvelles. Le composant de formulaire fonctionne pour la création. Et bien, j'aurais dû mettre une erreur d'orthographe pour la justifier. Donc je vais juste le modifier. Cliquez sur Mettre à jour. On y va. Et puis j'ai dit : Oh, j'ai fait une erreur. Permettez-moi de le modifier à nouveau. Et laissez-moi recommencer. Prends tous ces plus et on y va. Pas de composant réutilisable pour notre ferme. Donc, le défi ici est d'aller de l'avant et de faire ces composants similaires pour toutes les autres entités ou ressources que nous aurons besoin de maintenir. Et allez de l'avant et refactoriser la création et créer également la mise à jour pour utiliser ces composants de formulaire. Quand nous reviendrons, nous pouvons comparer les notes. 29. Formulaire de mise à jour de configuration - Partie 2: Hé les gars, bienvenue. Donc, dans cette leçon, nous allons juste comparer des notes. Je vais juste vous guider à travers le code que j'ai implémenté et j'espère que vous l'avez aussi fait, mais je vais vous donner, bien sûr, des jardins au cas où vous rencontrez des difficultés et marcher à travers le code assez lentement pour que vous puissiez effectivement copié si nécessaire. Commençons donc par les plus faciles, qui seraient les couleurs et les modèles, parce que les couleurs sur les modèles ont fondamentalement aussi peu de données que le mélange. Donc, le même composant de formulaire, ce que nous avons fait pour moi X et puis nous le reflétons ou, ou créer et notre édition pour simplement utiliser ce composant de formulaire est la même chose pour les modèles, non ? Pour le composant formulaire, la seule chose que nous devions tout changer était un plaisir. Maintenant, on a affaire à leur modèle, non ? Tout le reste à peu près la même chose. Et puis dans le Créer, nous voyons que je n'ai pas changé le texte du bouton mises à jour fermes. Je dois dire Créer un modèle ici. Très bien, c'est un bon, Nous sommes en train de passer par cette revue, mais ce composant appelé est identique à celui de l'édition. D' accord, et puis le code est à peu près identique. On attend la même pièce d'identité. Nous nous assurons que notre pH va à tout ce qu'il est, slash, edit slash avec l'id étant int. Et nous l'avons fait en tant que paramètre. Nous appelons le modèle à éditer. Et puis nous allons de l'avant et appelons notre PUT avec les modèles et pointez avec l'ID barre oblique avec le modèle à éditer. Et puis nous revenons à notre page de modules. Très bien, donc à peu près entre les modèles, le mix et les couleurs, la seule différence dans le code est la classe réelle et le nom de l'objet utilisé. Le reste est à peu près le même. Et aussi les terminaux, bien sûr, pas de véhicules. Toutes les différentes séries que c'est une forme plus complexe. Donc, le formulaire de Crée, nous le mettons à l'intérieur de notre composant de formulaire. Ce que vous remarqueriez également que j'injecte le client HTTP. D' accord, pourquoi est-ce que j'injecte cette tendance ? Parce que sur le formulaire original, nous en avons besoin pour charger trois listes déroulantes. Donc, tout ce code de la Create, comment ne pas prendre dans cette route ? Nous devrions en fait les répéter sur la page d'édition parce que les deux ont besoin de cette liste de valeurs à l'avance. Donc, ce que nous avons fait est que nous avons retiré ce code de la créatine, mettrons dans les composants de la ferme. Et un composant de formulaire traite de la préparation du formulaire et de toutes les données et besoins à l'avance, nous avons encore nos paramètres pour nos données. Le bouton prend ainsi que la méthode de rappel d'événement, n'est-ce pas ? Et sur la création, nos clients entrent en action lorsque nous devons soumettre les données par courrier comme appel JSON, ainsi que sur la page d'édition lorsque nous devons précharger les données une, puis soumettre les données mises à jour. Encore une fois, nos terminaux changent en conséquence. Donc, vous voyez, nous mettons tout ensemble, rendant l'application un peu plus maintenable, moins de points de contact quand il y a des changements à faire et où l'utilisation du blazer entier nous permet d'être très modulaire dans notre approche dans la construction de n'importe quelle application. Clients. Assez simple. Un formulaire simple a été utilisé, aucun besoin supplémentaire pour n'importe quel client ici pour tout pré-chargement des données. Donc, le code de création ressemble de la même manière juste avec le composant de l'avant-bras juste là. Et le formulaire d'édition est à peu près la même chose. D' accord ? Non. En ce qui concerne les réservations, nous avons dû faire un peu plus. Eh bien, les réservations complètes font la même chose que nous avons fait pour nos véhicules, non ? Parce que tout comme nous avons dû précharger la liste de la liste des véhicules et la liste des clients afin de faire une réservation. Nous avons donc dû injecter notre client dans le composant de l'avant-bras et ensuite faire notre non initialisé. Nous avons donc pris tout cela à partir du composant Create. Remarquez qu'il n'a pas non initialisé. Il n'a rien à mettre dans le composant de formulaire. Et puis nous avons notre cordon de création ressemblant à ceci, et notre code d'édition ressemble à ceci. Très bien, donc c'est une course rapide pour vous ennuyer à mort en expliquant et exagérant parce que le concept aurait été expliqué dans la leçon précédente. C' est la mise en œuvre bien sûr, vous pouvez passer par et faire une pause car vous avez besoin de copier ce que vous n'êtes pas si sûr. Mais ce que je veux souligner, c'est que j'ai créé d'autres composants. Donc, dans mon dossier de composants, rappelez-vous quand nous trompons nos propres composants, initialement, crée un dossier de composants et j'ai créé cet exemple. Eh bien, j'en ai créé un autre appelé le buck pour lister la gomme à points. Laisse-moi te montrer où c'est utilisé. manière générale, si je débarque sur la page de création ou d'édition, il y a une chance où je ne veux peut-être pas vraiment créer quoi que ce soit, notre éditer quoi que ce soit. Donc je voulais juste revenir à la liste. Donc, j'aurais dû répliquer ce couloir de bouton à travers chaque formulaire et changer l'URL où je voulais aller avec eux quand utiliser la balise d'ancrage et taper manuellement l'URL. Ou je ne vais pas voir le gestionnaire de navigation en un clic aller à cette URL particulière, n'est-ce pas ? Donc, au lieu de répéter ce code sur chaque page, ce que j'ai fait, c'est que j'ai créé un dollar pour lister les composants. Et puis cela prend un paramètre appelé cible. Et puis tout ce que je fais est de mettre dans la page spécifique par rapport à l'endroit où je suis. Donc si je suis sur le formulaire de réservation, alors mon argent à la liste serait pour la liste des réservations. Droit ? Et puis cela change par composant. Donc, pour les clients est la même chose juste mis à la liste des clients. Pour lequel est celui-là ? Celui-ci est pour les véhicules, c'est la même chose, mais pour la liste des véhicules. Alors regardons Buck pour la liste. Il suit le même type de modèle qu'un composant qui nécessite un paramètre et tout un, je ne navigue pas dans son que je n'ai pas l'extérieur et le pH comme quoi que ce soit. J' injecte mon gestionnaire de navigation. Tout ce que j'ai ici, c'est un bouton que j'ai stylé. Je veux dire, ce style peut ne pas être ce que vous voulez, mais vous verrez votre application, vous la modifiez ou vous vous sentez. Mais je coiffe ce bouton pour être un bouton sombre en ligne, bloc btn. Et j'ai défini cet événement onclick pour ce bouton. Bon, donc chaque fois que ce bouton est cliqué, ça va aller, mec, appelé cette méthode. Il a pris le paramètre. Donc, nous avons déjà passé par les paramètres quand nous avons dit « TO form component », n'est-ce pas ? Donc, je prends que les départements sont appelés cibles , c'est pourquoi nous pouvons spécifier des cibles et simplement passer cette chaîne. Donc, lorsque ce bouton est cliqué, nous allons revenir à cette méthode et voir le gestionnaire de navigation et naviguer vers. D' accord, nous avons utilisé ces, que cette méthode déjà nous savons comment naviguer deux œuvres. Mais alors je vais charger dynamiquement le baseUrl de cette application entière et nav gérer à propos de l'URI de base me donne le serveur fondamentalement. Et puis je vais mettre les cibles. Ça va dire quelque chose que localhost deux-points, quel que soit le numéro de port que vous avez, barre oblique. Notez donc que je n'ai pas besoin de mettre une barre oblique ici parce que la barre oblique est implicite à travers cette valeur. Et puis je vais juste à la cible comme spécifié par le paramètre. Alors jetons un coup d'oeil à ce que ça ressemble. Donc je vais retourner grandir et 0, ce qui est mix, d'accord, crée un nouveau véhicule et je suis genre, oh snap, je ne veux vraiment pas créer un nouveau visa. Je veux revenir à cette liste, voir où nous atterrissons des micros de secours. Si je vais aux modèles, même chose, revenir à la liste, revenir aux modèles. Si je finis sur édition, je ne veux pas vraiment revenir à la liste. Très bien, donc c'est ainsi que nous pouvons, une fois de plus rendre nos applications modulo et pas difficile de répéter trop de code à travers Windows crée un composant. Donnez-lui assez de paramètres pour, vous savez, le rendre assez dynamique. Et puis nous branchons simplement ces paramètres et dans les composants où nous le voyons bon. D' accord, donc c'est vraiment tout pour cette revue. Encore une fois, si vous avez manqué une partie de l'ajustement ou vous avez eu de la difficulté à le traverser, n'hésitez pas à Bach. Bach camion à travers la vidéo sur pause dans les différentes parties et examiner le code. Assurez-vous que l'orthographe est au carré et que toutes vos références sont correctes. Et quand tout le reste échoue, vous pouvez toujours me frapper si vous avez besoin de conseils supplémentaires. 30. IMPORTANTS - Fix Champs de vérification des utilisateurs: Hé les gars, bienvenue. J' ai donc une solution rapide pour nous avant d'aller de l'avant. Et cela concerne ces champs de vérification. Donc, vous avez probablement remarqué que dans la base de données, toutes les dates apparaissent lorsque nous créons. Permettez-moi d'aller de l'avant et d'afficher les données sur l'une des tables que les dates apparaissent. Cependant, nos noms d'utilisateur ne le sont pas. Donc, cela aurait probablement été fait via l'API. C' est très bien. Mais la raison pour laquelle nous avons créé par une mise à jour par serait que l' utilisateur connecté dans le UP serait connecté comme la personne a été touchée à l'enregistrement, n'est-ce pas ? Non, ça n'arrive pas. Donc nous avons juste une solution rapide à faire et je vais le faire dans l'unité de travail à nouveau en sécurité, l'école mais os à l'unité de travail dans le dossier du dépôt. Et le code d'origine que nous avons est var utilisateur est égal aux contextes HTTP utilisateur point, identité point, nom de point. Non, la réalité est que j'ai probablement eu un peu trop de zèle dans la mise en œuvre de ceci en blazer. Parce que cela fonctionne dans MVC, fonctionne dans ses pages Razor, où les contextes HTTP contiennent généralement les informations utilisateur, si elle est également indiquée serait transmise dans le contexte. Et c'est un moyen facile d'obtenir simplement le nom de connexion de l'utilisateur actuel. Cependant, dans la situation blazer où nous ne faisons pas vraiment de travail sur l'API, peu de choses que nous faisons au niveau du client. Ou qui est vraiment passé le long est un Tolkien avec l'inflammation sur qui il est. Donc, ce contexte HTTP n' r. Il ne garde pas l'utilisateur connecté parce qu'il ne sait vraiment pas qui est connecté. On ne sait pas qui est le client. Ou plutôt il ne connaît que le client. Ce qui est vraiment l'inflammation du Tolkien qu'il utilise vraiment pour dire oui, ok, vous pouvez accéder au point final. Donc, ce contextes HTTP ne l'utilise pas. Le nom de l'entité ne fonctionne pas dans ce contexte, donc nous allons le modifier un peu. Donc je vais entrer dans le manteau, le code original. Et j'aurai déjà la correction de citation ici, que je vais juste vous guider. Donc, la première ligne pour la correction est que nous n'obtenons pas l'utilisateur directement où obtenir l'ID utilisateur, car il fait Constantine, c'est le jeton. Et le Tolkien, est déjà analysé dans le contexte HTTP. Ainsi, nous pouvons explorer des parties des informations de jeton à travers des contextes HTTP, utilisateur point. Alors l'utilisateur est vraiment ce que nous appellerons un principes de revendications. Donc les allégations sont fondamentalement des informations qui nous disent qui vous êtes, n'est-ce pas ? Je prétends être ceci, je prétends être que c'est ce que la revendication est. Donc, l'objet utilisateur au lieu des contextes HTTP est un principe de revendications, qui est une collection des revendications de venir de la Tolkien étant envoyé par notre client blazer ladite interface. Très bien, Donc contextes HTTP, utilisateur point obtenir toutes les revendications et maintenant nous allons trouver la première revendication. Donc, si jamais je mets cela en mode débogage et juste passer la souris, vous verrez que 15 revendications supportables. Et celui qui contient des informations utiles sur qui est l'utilisateur. Va être trouvé sur l'identificateur de nom de type de revendication. Donc nous avons une constante ici appelée types revendiqués, non ? Donc, si vous commencez à taper cela, vous devrez peut-être inclure une bibliothèque pour les revendications de points de sécurité System.Out, les types de revendications , ce ne sont que des constantes et le nom identifie une de ces constantes. Très bien, donc ça va nous donner l'identifiant d'utilisateur à peu près. Et puis nous voulons la valeur de cette réclamation. Donc, cette crème ou l'ID utilisateur est stocké à côté de ce type de réclamation. Donc, lorsque nous trouvons le type de réclamation de cet identifiant de nom de type, obtenez le volume, nous obtenons l'ID utilisateur. Maintenant que nous avons l'ID utilisateur, je ne veux pas stocker l'ID utilisateur car utilisations pourraient être supprimées dans les dix années à venir. Vous ne voulez pas que le téléphone historique sache quel utilisateur avait cette idée à ce stade, est probablement plus facile de stocker le nom d'utilisateur, c'est pourquoi nous l'avons augmenté pour le nom ici, non ? J' ai donc besoin de récupérer cet utilisateur. Maintenant, j'ai la carte d'identité. Je veux dire que l'utilisateur var est égal à notre gestionnaire d'utilisateur de poids point trouver par ID un évier. Et puis nous passons juste cet identifiant d'utilisateur et puis nous obtenons cet objet utilisateur entier. D' accord ? Cet objet utilisateur a tout sur l'utilisateur à ce stade parce que cela est allé à la base de données et récupérer ce carton rouge de notre table des utilisateurs de vitesse. Donc FirstName, LastName, tout ce que nous avions mis dans l'utilisateur de l'application est de connaître cet objet afin que vous puissiez stocker ce que vous voulez. Je fais juste des suggestions. Sachez si vous avez déjà tapé User Manager et que vous obtenez des flèches. C' est parce que nous avons besoin d'injecter un moniteur utilisateur aussi. Et bien, tu sais, si on l'injecte, ça devrait l'initialiser comme d'habitude, non ? Mais alors c'est dans le contexte de l'utilisateur de l'application. Très bien, Donc, User Manager dans le contexte de l'utilisateur de l' application donner à l'objet le nom injecté pour l'initialiser, et alors nous pouvons l'utiliser librement. Utilisez un gestionnaire comme variable pour la bibliothèque qui a un certain nombre de fonctionnalités et de fonctions pour trouver des utilisateurs sur l'utilisation de l'inflammation à volonté. Donc, après que nous savons avoir l'objet utilisateur entier, nous n'avons pas besoin de dire mis à jour par Anne et je peux voir point utilisateur. Et comme je l'ai dit, vous pouvez obtenir n'importe quelle information sur l'utilisateur à travers cet objet. Donc si vous voulez stocker l'adresse e-mail, le prénom, le nom de famille, peu importe ce que vous vouliez stocker, c'est bien pour moi. Je vais juste stocker mon nom d'utilisateur. Le nom d'utilisateur est identique ou non à l'adresse e-mail. Je voulais stocker le nom d'utilisateur de la personne qui à ce stade a fait cette option. Donc à chaque fois que ça arrive, je sais qui c'est et puis c'est excrété NO2, qui c'est. Alors laissez-nous juste faire un test rapide pour nous assurer que nos travaux fixes. D' accord, quelqu'un a remarqué cela avec la création d'un nouveau micro et vous voyez que je suis enregistré sur blazer.com. Donc un autre micro sur un véhicule serait, disons fiat, tamis. Très bien, le feu est stocké. Regardons votre candidature en arrière. Accédez à l'affichage des données. Et maintenant vous voyez cette inflammation de l'audit. Donc ceux qui manquent pour les tests précédents et non, l' avenir, ça devrait être bien. Droit. 31. IMPORTANTE - Correction de la modification du véhicule: Hé les gars, bienvenue. Dans cette leçon, nous allons effectuer une correction de bug essentielle. Et ce bug est centré autour des véhicules et probablement toute autre opération d'édition qui a une liste déroulante. Donc, l'anomalie actuelle est que même si nous modifions ce véhicule, si nous changeons quelque chose que nous devons taper, il sera couronné de succès. Mais quand on change les listes déroulantes, rien ne change. Donc, si je voulais changer cela du noir au bleu, cela sauverait tout, mais alors la routine l'origine des valeurs. Nous allons donc aborder qui savent que l'arrière-plan de ce problème a à voir avec la façon dont nous récupérons les données lorsque nous sommes sur le point de les modifier. Donc, en elle, trois ou composants, le code derrière pour elle, au moins quand avons-nous le chargement des composants, nous obtenons le véhicule sont maintenant en fonctionnement. Notre API est en fait équipée de tous les Incluts. Donc, nous incluons en fait tous les détails sur ce qui se passe est que ces détails sont inclus alors que les ID peuvent changer les détails ne le font pas. Donc, sur The put, il est vraiment juste de recevoir le nouvel objet avec tous les détails inclus d'origine. Donc, ce que je vais faire dans cette leçon est introduit un autre point final. Donc, nous séparons get de Get details. Donc, dans l'IA HTTP et je vais juste vous guider à travers les changements que j'ai faits jusqu'à présent. Donc, dans le référentiel HTTP, j'ai introduit un autre comportement ici qui est d'obtenir des détails. Donc, nous les avons amenés à introduire des détails get, qui va prendre les mêmes deux paramètres que le get, l'URL et l'ID. Et puis son implémentation ajoutera simplement des détails de barre oblique à la fin. Donc, c'est identique à obtenir, sauf que cela va spécifier que nous voulons les détails par opposition à juste Get. D' accord. Donc, une fois que vous avez fait cela dans le composant, vous pouvez aller de l'avant et, et vous modifiez au moins les composants de vue. Donc, le composant Edit ne changerait pas parce qu'il est déjà en train de se produire, c'est très bien. Mais puis le composant de vue, qui est l'endroit où nous avons réellement besoin de voir les détails de n'importe quel composant ou quel objet il est. On va dire « obtenir des détails ». Donc, bien que cela soit spécifique aux véhicules, cela peut également l'appliquer à d'autres objets avec lesquels vous travaillez peut-être. Nos autres relations avec lesquelles vous pourriez travailler. Si vous affichez les détails d'un objet qui a des relations et que vous devez obtenir propriétés de navigation incluses Buck sont inclus les détails d'autres tables. Ensuite, vous voudrez probablement les diviser tout cela. Maintenant que nous avons modifié cela sur le client, alors regardons ce que nous devons faire dans le contrôleur ou les contrôleurs. Sachez que j'ai spécifié un chemin de costume, donc nous avons le get original. Et ce que j'ai fait, c'est de supprimer tous les Incluts. Donc, au paramètre include qui est venu avec la permission de notre unité de travail, je l'ai complètement retiré. Donc, c'est vraiment aller chercher le véhicule et retourner juste cet objet, pas de détails supplémentaires ou quoi que ce soit. Cependant, lorsque nous voyons obtenir des détails, il va appeler ID slash le mot details. En fait, ce point de terminaison ressemblerait en fait à quelque chose comme ça lorsqu'il est tapé. En outre, ce serait une barre oblique api, barre oblique 05 slash le mot details. Donc, je n'ai vraiment pas besoin des accolades parce que cela représenterait plus comme un paramètre de vallée. Donc, c'est littéralement le mot détails que j'attends après la carte d'identité. Donc pour celui-ci, nous ne prenons toujours qu'un seul paramètre. Je lui ai donné un nom différent, bien sûr, parce qu'on ne peut pas avoir un choc dit que Get moi pourrait être des queues. Et puis celui-ci a cette requête complète avec qui inclut le paramètre impliqué dans l'opération. Donc, lorsque ce véhicule est retourné , est retourné avec tous les détails inclus. Alors disons ça pour un test. Donc, à partir de notre liste de véhicules, je vais passer aux composants Vue. J' ai donc mis un point de rupture à la fin du spectateur. Et si vous regardez les données qui seront retournées, il en a ceux inclus, le faire le modèle et tout ce qui a pu être spécifié, juste, Donc c'est bien parce que je suis sur le point de le voir. Je vais donc inclure tous les détails des autres tableaux pour qu'ils soient prêts à être présentés. Et si je vais à Edit, vous voyez que les tétines, l'original obtenir. Et puis ce get est seulement de retourner le véhicule avec les champs pertinents, pas avec quoi que ce soit supplémentaire. Donc, faites IS null, model est null et tout ce qui aurait été inclus à l'origine est non, non. Donc, je vais aller de l'avant et changer toutes ces listes déroulantes à quelque chose de différent. Donc ça va maintenant être X5 et c'est vert. Et je vais cliquer sur Mettre à jour. Et puis quand je regarde, je vois le jour haut de gamme X5 et il a été couronné de succès. C' est donc la solution à ce problème d'édition. Si vous l'aviez, si vous ne l'aviez pas, alors très bien, vous le détectez tôt et vous l'avez résolu. Excellent travail. Mais en faisant le processus continu de développement de logiciels, vous allez voir ces anomalies dans une forme quelconque de tests. Et c'est toujours bon quand on peut trouver comment les résoudre. 32. Ajouter la validation aux formulaires: Salut les gars, bienvenue. Dans cette leçon, nous allons examiner la validation. La validation est très importante. Ou la réalité à ce stade, c'est que nous ne savons pas ce que l'utilisateur entre. Nous ne savons pas s'ils entrent même dans les points de données sont que nous pensons vraiment importants. Parce que par exemple, nous sommes ici avec créer un nouveau client. Je peux entrer peut-être juste un peu de données, rien d'autre. Et puis cliquez sur Create Custom Anna, nous obtenons des données très incomplètes allant à la base de données en cours d'affichage à l'utilisateur. Ça n'a aucun sens. Nous devons ajouter une validation pour nous assurer que les données répondent à certaines exigences avant qu'elles ne puissent être soumises ou avant que l'utilisateur puisse entrer ces données erronées dans notre système. Bien sûr, la validation avec après se produit sur le formulaire de création ainsi que sur notre formulaire d'édition. Parce que de la même façon qu'ils peuvent mettre dans des données incomplètes, ils peuvent aller à un complet notre complété ou acquis et à distance, supprimer les données vitales, puis mettre à jour. Et puis nous sommes toujours dans la même situation, de sorte que la validation doit avoir lieu sur tout ce qui collecte des données. Donc, pour cet exemple, nous allons utiliser des clients. Pour notre cochon d'Inde. Ce que j'ai fait, c'est que j'ai ajouté deux nouveaux champs, FirstName et LastName. Le client de la classe de données, qui était tout le chemin vers le bas dans partagé. Nous téléphonons client, nous avons ajouté ces deux champs. Et puis nous sommes allés au gestionnaire de paquets, avait une facture échoué, mais puis j'ai ajouté la migration, puis je suis allé de l'avant et mettre à jour une base de données et puis je sais que nous pouvons collecter FirstName et LastName. Et donc le lecteur le point à la maison sur quand nous apportons des modifications à la base de données, comme dans cet exemple. Et nous devons mettre à jour l'interface pour refléter que lorsque nous avons un contenu de composant avec pour la collecte de données, cela rend la vie beaucoup plus facile. Donc, je vais juste trouver nos clients composants de forme. Et puis je peux juste ajouter littéralement les deux champs ici. Et ils seront applicables à la fois à la modification et à la création. Laisse-moi juste me dépêcher et faire ça. Donc, pendant un certain temps pas été vu que nous pourrions ajouter plus de points de données aux clients comme FirstName, LastName si vous ne l'avez pas fait avant et que vous voulez le faire nausée chance qu'ils peuvent aller de l'avant et faire les choses de migration ajouté à l'interface comme bon vous semble. Et je vais juste modifier l'index aussi. Donc je ne suis pas du genre à afficher le smoking. Je pense que tout ce que nous avons vraiment besoin d'afficher, c'est peut-être comme le nom complet du client, non ? Et puis ici, je peux voir l'espace du client FirstName à dire le nom de famille du client. Alors nous obtenons le nom complet en cours d'impression dans une colonne. Très bien, gentil et facile. Et puis vous pouvez littéralement voir la vue où vous allez et voir les détails. C' est donc le changement du PSICQUIC. Permettez-moi donc de me concentrer sur cette leçon qui est la validation lorsque nous remplissons ce formulaire. Et vous remarquez que lorsque nous créons le formulaire, nous pouvons maintenant mettre des choses que je perds la validation, mais ça ne marche pas. Nous devons donc laisser la loi de la forme, quelles règles elle devrait vivre. Afin d'effectuer cette validation, je vois ces données de mots-clés sur les notations. Très bien, donc les annotations de données sont notre façon de spécifier des règles pour les différents champs. Bon, donc ce que nous mettons dans un nouveau client, nous devons mettre Prénom et Nom. Nous devons mettre un numéro d'identification fiscale. Nous devons avoir une adresse e-mail et une adresse e-mail légitime dans laquelle le numéro de contact doit être inscrit, mais peut-être que cette robe est facultative. Alors nous allons travailler avec ça. Différentes situations exigent des règles différentes, mais une fois de plus, c'est notre expérience pour elle aujourd'hui. Donc, je vais aux données, nous parler à partir de laquelle cette forme est dérivée radicaux, nous savons qu'il utilise l'objet client, qui est de type clients. Donc, la classe de données définit les champs qui peuvent être collectés. Donc, pour ajouter des annotations de données au-dessus du champ, je vais juste ouvrir des crochets, puis commencer à taper. Et il y a certains mots clés, ce n'est pas le cas, ils vont commencer à taper. Donc, si je veux faire quelque chose de nécessaire, I, type II et requis, mais après cette bibliothèque d'annotations, et une fois que cela est ajouté, vous voyez Nalgene. Donc, n'importe quel champ que je vois est obligatoire peut obtenir ce TOD requis au-dessus. Très bien, cela nécessitait une annotation de données. Donc adresse, j'ai dit que ce n'est pas obligatoire. Donc, je vais juste mettre un espace là pour que vous voyez cette adresse ou avoir ce drapeau requis au-dessus. Donc FirstName est certainement nécessaire. Une autre chose que je pourrais dire à propos du premier thème est que la longueur de la chaîne devrait être maximale, peut-être 100, non ? Et peut-être un minimum. Donc, je peux juste dire mini-maman, longueur est égale à la longueur minimale tandis que prénom qui est mis en trois, vous savez, ça pourrait être bijou ou nous allons le mettre à deux. D' accord. J. Oh, c'est la similitude de longueur minimale pour le nom de famille. Longueur minimale de deux, non ? Vous ne pouvez pas nécessairement mémoriser toutes ces annotations. Il y a des moments où je dois vraiment aller regarder ce qu'ils sont. Mais le fait est qu'ils sont là. Et c'est le moyen le plus simple de spécifier les règles qui régissent chaque champ. Et une autre chose à ce sujet est que parfois ces annotations affectent réellement la base de données. Donc, si je l'ai fait avant la migration, alors il ferait effectivement quelques demandes de tenir les actes de ces tables devraient être conçus ou générés sur la base de je suis désolé, tenir ces champs dans les tables de base de données devrait être générés et quelles contraintes nous-mêmes. Mais concentrons-nous sur la validation côté client ou sur l'absence de toxicité. Laisse ça tranquille. Mais encore une fois, je pourrais dire une longueur minimale, longueur maximale peut-être 10, et une longueur minimale peut-être huit, non ? Selon les identifiants de tux qui étaient supportés. D' accord. Une autre chose que vous voudriez probablement faire est avec un numéro de contact, vous pouvez dire quelque chose comme le type de données. Point quatre numéros, donc type de données, puis je spécifie que ce type de données est de type numéro de téléphone. Très bien, ce sont les deux choses qui informent niveau les champs comme pour l'adresse e-mail, je vais juste copier et coller, mais il y a un type de données qui dit adresse e-mail. Donc, il va essayer de les valider sur le général Rosie peut obtenir plus spécifique et écrire vos propres annotations et validations et attributs. Mais je ne vais pas y entrer profondément. Et c'est vrai, non, ça a l'air assez bien. Faisons une migration et voyons ce qui se passe. Donc ajouté des validations, si proches donateurs. Voyons voir. Donc, dans ce fichier de migration est généré, vous verrez qu'un tas d'altérer colonnes communes de Gamal gris et chacun voit, ok, et le type est int varchar 15, le maximum prêté est 15, phototoxicité. D' accord, donc les attributs de validation sur la classe Data elle-même affecteront la migration, n'est-ce pas ? Ce n'est peut-être pas nécessairement ce que vous voulez. C' est l'heure pour cette raison. Lorsque vous accédez à des applications plus grandes, vous commencez à la fois à l'abstraction et à la création de couches. Donc, vous avez la classe de données, puis vous avez une autre couche pour les applications pour obstruer les classes de données à ces fins d'application. Et c'est généralement là que vous mettez vos validations car vous ne voulez pas nécessairement voir les invalidations entre la base de données et le côté client. Cependant, dans cette situation, puisque nous utilisons juste ces classes de domaine partagées, et ce n'est vraiment pas si nuisible étant donné que si je vais filtrer, c'est au niveau de l'interface, je veux probablement que la base de données le rejeter s'il l'a de toute façon, n'est-ce pas ? C' est donc ce que nous obtenons lorsque nous faisons une migration sur une table qui a R sur une croix, désolé, qui a ces annotations de données et règles de validation. Maintenant, je peux aller de l'avant et mettre à jour la base de données parce que cela ne fera aucun mal. Mais le vrai test pour cette leçon est ce qui se passe sur l'interface. Ici, je reçois quelques flèches. Ces flèches sont parce qu'il dit qu'il ne peut pas insérer la valeur null dans une colonne Touch ID, n'est-ce pas ? Parce que ici, j'ai dit que l'ID fiscal est requis en conséquence, il le modifie et le voit pas n'est pas nullable, envoyer une base de données NOT null serait, désolé, null, nullable serait coché. Donc, je ne peux pas passer en null. Mais j'ai supprimé plus tôt certaines données de la colonne docs id. C' est pour ça que cette migration a l'impression que je vous l'explique. D' accord. Quoi qu'il en soit, réparons ça au niveau de l'interface et puis nous pourrons revenir à cette migration plus tard. Bon, donc notre numéro un avec une serviette qui sont des validations fonctionne bien que ce n'est pas exactement comme ça que je voulais la démo. Mais voyez que vous obtenez une erreur ici. Donc, nous obtenons une erreur non gérée lorsque nous sommes des tendances et que nous chargeons les clients, remarquez que nous avons commencé à regarder les clients, donc cela fonctionnait. Mais quand nous allons sur la console de notre navigateur, nous voyons ici où nous obtenons notre réponse 500. Donc donc la lance, un chagrin de coeur ? Ce qui se passe vraiment ici, c'est que nous avons les données invalides. La base de données interroge la version bêta non valide. Et puis toute cette erreur, erreur , une donnée complète, va jusqu'à notre interface. L' API est Tolkien parce que la base de données ne sait pas quoi faire parce qu'elle voit un tas de règles et qu'elle obtient des données invalides, n'est-ce pas ? Donc, ce que je vais faire est de nettoyer les données invalides, c'est-à-dire les enregistrements dont j'ai supprimé les données vitales. Donc je vais juste sauter à l'explorateur d'objets. Et ce que je vais faire est juste supprimer ce que les réservations sont liées, donc je dois supprimer quel est le nom de notre base de données ? On y va. Je vais devoir supprimer les réservations ainsi que les clients, non ? Alors laissez-moi juste sentir les données rapidement. Ok, je n'ai qu'une seule réservation de toute façon. Cette vue des données ici. Et donc vous voyez ici nous avons null, null, rien dans l'adresse e-mail et non linéaire Touch ID. C' est ce qui cause les problèmes. Laisse-moi enlever ces deux-là. En réservation. Il s'agit d'un client ayant l'ID 1. D' accord. Donc, je vais enlever 23. Ce sont les problèmes d'outil. D' accord. Essayons ça. J' ai toujours l'aérosol attaché pour faire oubliable prénom et nom de famille. Donc, je viens d'ajouter le client de test. Et quand nous revenons en arrière, nous voyons que notre pH se charge correctement. Non. Donc, vous voyez la validation. S' il y a des données non valides, il ne sera pas en mesure de traiter ce qu'il ramène. Bon, donc tout est étroitement couplé. Donc, lorsque nous créons un nouvel utilisateur, si j'ai essayé de créer un client, désolé, crée un nouveau client et j'essaie de créer sans mettre quoi que ce soit que vous voyez ici que nous recevons cette série d'erreurs. Donc ça, laisse-moi juste jeter le camion au code et faire le parallèle avec toi quant à ce qui se passe. Tout d'abord, le validateur d'annotations de données voit, je regarde toutes les annotations de données valides attachées au modèle pour lequel ce formulaire est généré. D' accord, nous avons déjà parcouru toutes les annotations sont, ce sont des annotations. Il sait que cela est nécessaire et c'est la qualité des données attendue et autres. Donc, ce validateur qui est en haut de notre ferme, vous voyez, je surveille le champ, la valeur et ce que les exigences sont basées sur les données, sur les notations lorsque vous appuyez sur Soumettre. D' accord. Vous essayez de dire envoyer le formulaire à la base de données. Nous ne traitons que les soumissions non valides, ce qui signifie que la soumission non valide est des modes impairs automatiques. Nous pouvons mettre une soumission invalide, mais nous n'allons pas si loin. Le fait est que, lors de la soumission, il ne va pas dire, eh bien, c'est le résumé de la validation. Si la page se recharge, alors le résumé va montrer la seule façon dont la page ne se rechargerait pas est si tout était valide et qu'elle pouvait continuer. Donc, lorsque la page le recharge en affichant ce résumé de validation. Et puis nous avons ces méthodes de validation spécifiques au champ apparaissant sous chacune d'elles, n'est-ce pas ? Donc, nous obtenons ceci sous chaque champ, que ce message peut réellement être personnalisé. Parce que dans le nécessaire, nous pourrions mettre le message est 0, message d'erreur. On y va. Et on pouvait voir quelque chose comme TR, smoking. Je D, d'accord, donc c'est tout. Donc, nous pouvons le mettre comme un message personnalisé au lieu de celui par défaut pour voir le champ est requis. Vous pouvez mettre ce message d'erreur en fonction de l'exigence. Et puis fondamentalement pour chacun d'entre eux, vous pouvez spécifier le message d'erreur que vous voulez, n'est-ce pas ? Donc, vous pouvez voir le nom, notre identifiant de stock, donc tucks ID ne répond pas aux exigences de longueur. Très bien, donc avec ces deux messages, je vais me rafraîchir et je vais juste faire attention au champ d'identification fiscale. D' accord, donc j'ai rechargé la page. J' ai encore essayé et remarqué l'entérotoxine, c'est ce qui apparaît. Donc, notre message personnalisé est à venir parce qu'il est requis et rien n'est fourni. Et si j'en mets un là-dedans, rappelez-vous que nous avons dit que ce devait être le minimum de marcher jusqu'à ce que la terre soit, mais regardez-le. Non, Touch ID ne répond pas aux exigences de longueur. Donc, le message avec presque regarder contextuellement basé sur quelle règle est violée à ce moment dans le temps. Actuellement, si c'est nécessaire et que rien n'est là, alors je n'ai pas besoin de mentionner les exigences de longueur et de regarder le changement automatiquement. Donc si je commence à remplir ces vieux et que je l'appelle Archibald, et alors regarde ça. Douglas. D' accord. D' accord. Et nous remplissons le panier. Cool. Si je dis créer un client, regardez cela, mais alors l'adresse e-mail ne répond toujours pas tout à fait à nos exigences. Si je vais à Edit, alors nous devons nous assurer que la validation correcte sur notre EMEA cette boisson. Donc, pour cela, nous avons réellement besoin de cette annotation qui dit adresse e-mail. Donc oui, nous pouvons voir le type de données. Je pense que c'est plus à des fins d'information, non ? Mais à ce stade, nous voyons des bits valides et une adresse e-mail. Et je pense que pour le numéro de téléphone, on pouvait aussi voir le téléphone. On y va. Vous avez donc différentes validations pour différents types de données. Je ne serai probablement pas si strict sur le numéro de téléphone cependant, parce que je ne suis pas sûr de quelles règles la validation joue par un, mais nous voulions vraiment être strict sur l'adresse e-mail. Alors essayons encore celle-là. Donc, je suis Buck dans la vue d'édition pour ce client, si j'ai essayé de mettre à jour, remarquez qu'il ne va pas rejeter cette adresse e-mail, pas une adresse e-mail valide après m'assurer que je mets quelque chose qui ressemble à un e- adresse postale. Et puis c'est satisfait, je clique sur Mettre à jour et nous sommes prêts à y aller. Très bien, maintenant que nous avons des données valides dans ces champs sur, dans notre base de données, permettez-moi d'essayer de relancer cette migration. Donc, la migration est, sont là, j'ai juste besoin de le voir mettre à jour la base de données. Et voilà, c'est fait. Donc maintenant tout ce que nous avons les nouveaux champs et les nouvelles contraintes appartiennent à tous ces champs, non ? Donc, au niveau de la base de données, si vous êtes, si vous connaissez la conception de la base de données et les contraintes de développement sont des règles régissant marche peut être stockée. Donc, c'est ainsi que vous pouvez spécifier en utilisant le code. Première approche, les règles autour de ce qui peut être stocké dans toutes les salles. Il quand nous disons n varchar et la taille, c'est ainsi que vous pouvez déterminer la taille. Mais bien sûr, certaines de ces choses sont plus côté client que côté base de données. D' accord ? Donc, d'un, d'un point de vue partagé, c'est bon parce que nous arrivons à spécifier tenir le client doit se comporter et tenir la base de données devrait se comporter. Mais encore une fois, il y a des moments où les règles peuvent ne pas nécessairement aller dans les deux sens à ce stade, vous voulez introduire un autre niveau d' obstruction ou partout où les modèles de vue qui régissent ce le côté client ou l'interface utilisateur se sépare de la base de données et de ce que font les objets de domaine. Alors maintenant que vous avez une compréhension du trou pour mettre la validation sur vos avant-bras, vous connaissez le défi habituel, allez-y et ajoutez des validations similaires aux autres tables comme vous le souhaitez. Je ne vais pas nécessairement passer en revue celui-ci avec vous parce que celui-ci est plus de contextes. Vous pouvez avoir besoin de validations que je ne vois pas nécessairement comme importantes et vice versa. Vous allez donc de l'avant et regardez vos exigences en matière de données. Vous avez des exigences commerciales, quelles qu'elles soient, vous savez, mais vous voulez que vos données regardent et ajoutent vos validations en conséquence. 33. Données d'affichage Blazor - Détails: Salut les gars, bienvenue. Dans cette leçon, nous voulons mettre en place un composant qui nous permet d'afficher les détails d'un contexte d'enregistrement particulier. Voici notre client. Maintenant, nous savons que lorsque nous avons créé le client, nous avons entré plus de seulement 1234 bits de données. Nous saisissons également le numéro d'identification fiscale et l'adresse. Et bien, je pense que c'est le but. Le fait est que nous voulons être en mesure de voir et c'est pourquoi nous avons ce bouton bleu ici qui serait pour la visualisation. Nous devons donc définir ce composant. Maintenant, il y a deux façons de penser à cela. Premièrement, il doit être en lecture seule parce que nous ne voulons pas aller sur le bouton Afficher et ensuite avoir à faire. Nous ne voulons pas qu'il soit modifiable car nous affichons les détails. C' est un aussi. Comment est-ce qu'on a dit exactement ? Une façon commune de l'exposer dans un beau détail. Notre champ à gauche, détail au bon format. Certaines personnes réutilisent vraiment simplement la même ferme Leo qui a été utilisé dans la création et les éditer et les afficher, mais en lecture seule. Donc je pense que nous allons l'utiliser parce que celui-ci est vraiment facile à mettre en œuvre. Vous pouvez toujours modifier votre design. Bonjour vous le souhaitez, mais je vais vous montrer quelques trucs et choses que nous pouvons faire pour étendre ou composant de formulaire par rapport aux différents objectifs ont déjà les composants de formulaire créer, nous l'avons éditer maintenant nous allons l'utiliser pour simplement faire vue sont lus sur. Donc, en utilisant la section client comme exemple, nous allons aller de l'avant et ajouter un nouveau composant. Vous pouvez l'appeler vue ou détails alcool dans les détails. Et ce que je pense que nous utilisons le mot vue. Nous avons fait notre tête, alors laissez-moi supprimer les détails et recommencer. Laissez-moi créer un nouveau composant et je vais l'appeler vue en accord avec la convention de nommage que nous avons commencé avec. Donc, notre composant est appelé vue. Sur notre composant, nous allons devoir faire quelque chose de similaire à l'édition. Donc, nous allons certainement avoir besoin de tous ces éléments en haut parce que nous devons naviguer vers la page, mais celui-ci va être View. Et puis nous allons devoir avoir notre client HTTP ainsi que notre navigation. On n'a probablement pas besoin du gestionnaire de navigation, mais on verra ce qu'on fait. Nous devons également nous assurer de charger nos fosses. Permettez-moi donc de copier tout cela réellement mis sur notre point de vue parce que nous allons réutiliser ce composant. D' accord ? Non, je conserve tout cela parce que les paramètres entrant, quel client dois-je voir ? Nous acceptons l'ID, puis nous allons chercher le client. Je n'ai pas besoin de cette modification, car l'édition se produira sur ce composant. Laissez-nous nous concentrer sur cette section des composants de formulaire un, je n'ai pas besoin d'un bouton prend parce que je ne veux vraiment pas un bouton pour afficher de toute façon, je n'ai pas besoin de définir cela. Je n'ai pas besoin de m'asseoir sur une soumission valide parce qu'il n'y a pas de soumission qui va se produire. Mais une chose que j'aimerais faire est de dire composant de formulaire que lorsqu'il se charge à partir de cette page, il devrait être désactivé. Donc, je vais ajouter un nouveau paramètre. Je vais l'appeler le sable. Et ça va avoir un booléen. C' est vrai ou faux. Soit il va être désactivé, soit pas. D' accord. Notez qu'il est bleu car nous n'avons pas modifié le composant de formulaire pour le reconnaître. Alors passons au composant de formulaire et faisons notre modification. Nous avons donc besoin de ce nouveau paramètre appelé désactivé. Eh bien, je l'appelle le handicapé, donc cela signifie courant pas ici. Donc je vais l'appeler désactivé. Où suis-je ? On y va. Et il va avoir une valeur par défaut de false. Très bien, donc cela signifie que si ce n'est pas spécifié, tout comme avec notre bouton prend, si ce n'est pas spécifié, alors supposons que la batterie n'est pas désactivée. Très bien, vite, nous pouvons facilement voir si et puis notre AdSense, désolé. Et puis IF. Et puis à l'intérieur ici, nous pouvons voir si elle est désactivée ou si elle n'est pas désactivée. Cela signifie donc que si désactivé est faux, alors affichez le bouton. Très bien, donc n'afficher que ce bouton indiquant que les mises à jour sont enregistrées lorsqu'elles sont désactivées est false. Bon, maintenant, en ce qui concerne la forme et la désactivation de la ferme, et agréable moyen facile de désactiver un tas de champs. forme suffisante serait de les envelopper tous dans un jeu de champs, puis définir le jeu de champs pour être désactivé. Alors faisons ça. Donc, je vais ajouter juste les effondrer tous pour le rendre plus facile afin que nous puissions voir exactement où tout commence et se termine. Et puis je vais créer cette balise appelée Fields s'asseoir et la fermer. Mais alors je vais spécifier que désactivé est égal à et ce serait vrai ou faux. Donc si j'ai dit vrai, alors ce fœtus, s'il se sent réglé, désolé, est désactivé. Si je dis tombe, alors rien n'aurait changé. Cependant, je ne sais pas si c'est vrai ou Fazio de toute façon, je sais que c'est ce qui vient à travers le paramètre. Donc, je vais voir désactivé va prendre la même valeur que ce paramètre a. Et puis je peux mettre tout ça à l'intérieur de ce jeu de champs. Le bouton est affiché lorsque désactivé est égal à false, donc C, et c'est le CML voyant équivalent à false. Juste pour expliquer le cas où vous êtes un débutant et c'est le bouton. Et puis nous avons encore le bacille parce que quand nous voyons nous voulons toujours l'option de revenir à la liste. Bon, donc c'est à peu près ce qu'on fait ici. Alors revenons à View. Et puis vous voyez, vous savez, il faut reconnaître que le désactivé sera vrai sur les autres composants qui utilisent ce composant de formulaire. Nous n'avons pas besoin de spécifier quoi que ce soit avec désactivé car nous l'avons défini comme valeur par défaut sur false. Alors prenons ça pour un tour. Très bien, alors quand je clique sur la vue, regarde ce qui se passe. Toutes les données sont là. Pour le type d'icône en lecture seule. Tous ces éléments sont désactivés. n'y a pas de bouton ici pour suggérer de sauvegarder nos créations. Et je ne peux que retourner à List. Et on y va. Maintenant, je peux voir l'Amérique. C' est sympa et facile. Et ça n'a pas pris beaucoup d'efforts. Encore une fois, tout ce que nous avons fait était d'étendre nos composants de formulaire pour prendre un autre paramètre sous la forme de disabled, qui est un booléen que nous avons par défaut à false. Et puis nous mettons ceci si déclaration ou sur l'affichage du bouton. Si désactivez cela tombe, affichez le bouton. Et nous avons déjà la ductilité. Donc, nous n'avons pas mis ça dans la déclaration, bien sûr. Et la prochaine chose que nous avons fait était sur le composant de vue, nous allons de l'avant et récupérons notre dossier. Fondamentalement, quand l'entreprise obtient l'ID. Ensuite, nous chargeons notre composant de formulaire avec ces données client et le désactivons en cours de route. Très bien, donc c'est vraiment ça. Ainsi, vous pouvez aller de l'avant et appliquer ce même modèle aux autres composants des composants de vue que vous possédez. 34. Nettoyer et ajouter des changements à GitHub: Très bien, alors dans cette leçon, nous allons juste revoir ce que nous avons fait pour toute cette section et vérifier nos changements dans GitHub, les valider. Tout comme mon chemin de récapitulation, ce que nous avons fait était Explorer, comment nous communiquons avec l'API de reste de Blazer. Donc, la plupart de nos composants auraient ce client HTTP injecté et ensuite code pour suivre où nous avons fait cet appel. Nous avons également examiné comment nous pouvons atteindre les points de terminaison plus faciles à utiliser dans les différents composants et réduire le risque d'erreur. Et nous avons cherché à créer des composants réutilisables, à savoir sous la forme de ce composant de formulaire, où nous l'utilisons à la fois pour notre édition de création, puis nous avons vu comment nous pourrions l'étendre pour également utiliser pour des scénarios en lecture seule. Nous avons également introduit d'autres composants comme cette rubrique. Donc on n'a pas traversé ça ensemble. Je l'ai présenté, juste savoir où j'utilise Bootstrap, le style jumbotron. D' accord ? Et dans, injecter cet emprunteur sont désolés, j'attends un paramètre appelé texte, que je vais juste afficher. Donc, cela est utile comme sur notre page d'index où nous devions être trans ou se rappeler tout ce que nous voulions avoir trois ans avec cette herbe à chaque fois. Nous pouvons donc remplacer ces titres par ce composant de titre et nous passons simplement le texte que nous voulons afficher. composants réutilisables, non ? Eh bien, il en va de même pour la foule pour toutes nos ressources. Ainsi, toutes nos ressources peuvent maintenant créer, mettre à jour, supprimer et simplement afficher les données qui sont là. Dans notre API. Nous l'écrivons passé mal où nous avons enlevé la barre oblique api du chemin, alors que cela provoquait un conflit dans le routage. Donc, à la barre oblique de Poupon api. Et juste pour vous montrer une fois de plus ce que nous avons fait avec notre fichier de points de terminaison, nous venons de créer une classe statique avec des chaînes statiques qui viennent juste de construire les différents points de terminaison par ressource. Donc, si vous obtenez une autre ressource dont vous avez besoin dans l'API, vous pouvez simplement la faire pour Institute ici et la réutiliser en conséquence partout ailleurs et application. Nous avons également examiné la validation des données et le trou. L' ajout d'annotations de données à nos classes de domaine n'affectera pas seulement dit que l'UA traite de la validation au niveau de la batterie. De même, comment la base de données, ces contraintes lors de la création intermédiaire, la création des tables les modifient au niveau de la base de données. Donc, nous voyons, encore une fois, nous avons discuté qu'il y a des moments où vous pouvez vouloir séparer ces deux-là mais pour non, comme Oh, nous apprenons juste que nous n'irons pas si loin en avant. Je veux juste dire ça. Alors, allons-y et continuons pour obtenir des changements. Et c'est mon message rapide. Et puis je vais aller de l'avant et tout engager. Et une fois que cela sera fait, vous pourrez faire une pause et je vous reverrai dans la leçon suivante. 35. Utiliser une approche de code Derrière les codes de composants de Blazor Composants: Hé les gars, dans cette leçon, nous allons parler de Bowl peut totalement séparer notre codeur ou citation de balisage de notre logique ou le code C-Sharp ? Non. Le fait est que ce que nous avons jusqu'à présent fonctionne, n'est-ce pas ? Nous avons du C pointu dessus de balisage. Ce sont plutôt des directives. C' est une page. Même ces choses et autoriser, ce sont toutes des directives. En haut, nous avons notre balisage, qui est un hybride de syntaxe Ariza sur la syntaxe HTML. Et puis nous avons notre section de code ou de logique ci-dessous. Non, tout fonctionne comme il est. Mais alors il y a une approche que nous pouvons adopter lorsque nous avons en fait deux fichiers distincts. Un pour juste le balisage comme nous le voyons ici. Et puis nous pouvons migrer nos certaines parties de notre logique et du code C-Sharp dans notre code derrière le fichier. Très bien, donc je vais commencer à utiliser les couleurs index.js ou le composant. Je pense que c'est assez agréable et simple pour nous de nous lever et de mettre le concept sous nos doigts avant d'aller de l'avant et de faire le reste de nos composants, si vous le souhaitez, il va, c'est complètement facultatif. n'y a rien qui dit que vous devez le faire ou si vous ne le faites pas, vous ne faites pas quelque chose correctement. Cela dépend de vos objectifs, cela dépend de votre contexte, bien sûr, mais au moins vous savez comment le faire en cas de besoin. Donc, ce que nous allons faire est d'ajouter une nouvelle classe au même dossier avec nos composants. Et nous allons donner le même nom à cette classe. Donc, c'est index.js, balles de rasoir et point d'extension supplémentaire CSS. Donc, c'est le nom du composant points raise ou point cs. Très bien, Nous allons de l'avant et cliquez sur Ajouter. Et ce que vous pourriez remarquer dans l'explorateur de solutions, c'est que votre fichier d'index peut être imbriqué sous le composant rasoir d'index. Ça arrive parfois pas, parfois ça n'arrive pas pour moi. Ça a pu être pour toi, mais ce n'est pas un problème. Tant que vous voyez le fichier apparaître et que vous avez mal fait le nom, alors cela devrait fonctionner. Alors ouvrez ce fichier de classe et nous avons des partiels publics. Donc partiel signifie que c'est une mise en œuvre de moitié font partie de la mise en œuvre d'une autre classe, non ? Donc, il y a un composant est une classe et nous voyons, eh bien, la classe C-Sharp que nous faisons est une partie de cela. Donc, ils travailleront tous ensemble. Ils seront juste automatiquement attachés pour leur donner non, c'est bon. Ces deux types d'appartenir l'un à l'autre, n'est-ce pas ? Donc, tout commence par migrer certaines directives afford, null. On avait des injections, quelqu'un pour prendre ces injections, tout notre composant. Et je vais les placer à l'intérieur de la classe. Maintenant, au lieu d'avoir l'injection extérieure, ce que nous aurons est une accolade carrée ouverte, tête j'injecte une accolade carrée proche. Et nous devrons inclure certaines bibliothèques, à savoir les composants de base dotnet que je change leur objectif. Et puis dans d'autres bibliothèques pour ceux-ci, pour les clients et ces autres bibliothèques dont nous avons besoin. Donc, nous allons de l'avant et injectons et faisons la même chose pour le JS Runtime. Ensuite, nous pouvons définir ceci comme Get et asseoir sur ces deux propriétés. D' accord. Vous pouvez mettre l'injectable donc ils voulaient à côté de lui, Désolé, voulait au-dessus. Ça n'a pas vraiment d'importance. A Ozzie, vous avez la bonne syntaxe et vous êtes prêt à partir. Maintenant après avoir fait ça, la prochaine chose que je veux passer est toute la logique, non ? Donc je vais devoir prendre tout ça et je vais le couper. C' est une migration après tout. Maintenant, le truc, c'est que vous doublez le code et que vous aurez beaucoup de bateaux Arezzo. Il existe déjà. Laissez-moi vous montrer un exemple. Donc, si je laisse le code ici, je l'ai copié et je le colle ici, alors vous allez commencer à voir des erreurs. Eh bien, en fait, si je n'ai pas bougé les directives, donc si je l'ai injecté ici, ainsi que l'ai injecté dans le code derrière et vous commencerez voir des choses sur l'existe déjà. Ou vous avez une double initialisation de quelque chose, ce qui n'est pas une très mauvaise errata ici comme exemple, ambiguïté entre ceci, cette propriété, non ? C' est facile ici, et il est aussi le voit là-bas. Donc, une fois que vous avez vu ce genre d'erreur, si vous copiez et collez cela et vous savez, cela fonctionne. Donc, depuis que j'ai fait valoir ce point, permettez-moi de le supprimer encore une fois et d'aller de l'avant. Je vois la moitié de ces zones de disparus, les bibliothèques manquantes pour notre ou des bits de code. Et après avoir fait tout cela, où sans erreur des deux côtés, si je fais une construction, d'accord, donc notre construction a été réussie et maintenant prenons juste pour un tour et assurez-vous que cela fonctionne. Mais avant de faire cela, ce que je vais faire est d'introduire juste une ligne d'écriture de point de console rapide ici et l'async non initialisé, qui va juste dire le code de chauffage derrière. Donc, ceci est, cela nous permettra à partir de la console dans le navigateur lui-même de voir ce message. Et puis nous saurons que c'est certainement frapper le code derrière composant pas mérite comme aucun code et pas d'injections. Bon, alors allons-y et prenons ça pour nous. D' accord, donc ici nous avons frappé notre page de couleurs et tout est clone buck comme d'habitude. Laissez-moi juste aller à l'élément inspecter sur la console et vous verrez ici la ligne console.log que nous avons mis en frappant le code derrière votre tête. Donc, si à un moment quelconque vous voulez imprimer quelque chose sur la console ou vous savez, quelque chose ne va pas. Je veux savoir si vous vous asseyez dans le coin ou quoi que ce soit. Vous pouvez toujours utiliser ce console.log cette ligne et il va en fait simplement écrire sur la console dans le navigateur. Bon, pour que je puisse juste enlever cette ligne. Et voilà. C' est vraiment tout ce qu'il y a à déplacer votre code vers un code derrière un fichier. Encore une fois, c'est en fait très facultatif. Tu n'as pas à faire ça. n'y a pas de stipulation que vous devez le faire. Comme vous l'avez vu, nous avons tout mis en marche jusqu'à ce point. Ainsi, vous pouvez aller de l'avant et le faire pour le reste des composants. Vous savez, un défi lui-même migre sur le code, mais bien sûr, je vais le faire. Et plus tard, vous aurez mon code à comparer juste au cas où vous rencontreriez des difficultés. 36. Gestion des erreurs globales: Hé les gars, bienvenue. Donc, dans cette leçon, nous allons parler de la gestion globale des erreurs. Aucune gestion des erreurs dans c-sharp n'est vraiment effectuée à travers ce que nous appellerons des instructions try-catch. J' ai tapé bac, appuyé deux fois sur Tab et puis on a eu ce bloc de code, non ? Essayez, faites quelque chose, attrape toute erreur qui vient à votre chemin. Lancer signifie planter le programme. Pensez-y si vous n'êtes pas si familier avec ce qu'est la gestion des erreurs, en dehors de ce que je viens de vous montrer, pensez à chaque fois que vous utilisez une application quand quelque chose ne va pas, il a une flèche. Il fait l'une des deux choses. C' est soit cela fait apparaître un message d'erreur qui dit, hé, vous savez ce que vous avez essayé de faire, cela n'a pas tout à fait fonctionné. Ces dragons, le programme est toujours en cours d'exécution. Ou parfois, il jette juste l'ancien genre de programme, Hey, vouloir griffonner est invalide et puis le programme se bloque et les sous-marins fonctionnent. C' est donc essentiellement la gestion des erreurs. Donc, vous pouvez soit planter le programme à travers l'instruction throw que je veux juste redresser. Ou vous pouvez effectuer une action. Montrez un message, faites savoir à l'utilisateur, hey, vous savez, quelque chose s'est mal passé, veuillez réessayer et puis ils peuvent réessayer. Nous aurions vu que dans le passé, nous avons apporté quelques modifications et je pense que nous essayons d'obtenir mes réservations ni la liste des réservations. Vous auriez vu cette barre jaune monter et aller dans la console et lire l'erreur, puis Bogan tendance, correctif sur le phénol, qu'est-ce qui ne va pas ? Évidemment, vous ne voudriez pas nécessairement ce genre d'expérience utilisateur pour votre oreille, l'utilisateur réel, c'est correct pour vous en tant que développeur parce que vous devez le réparer. Mais quand l'utilisateur utilise le programme, vous ne voulez pas qu'ils voient recharger et notre jaune par quelque chose a mal tourné. Je n'est qu'une flèche en V. Ce que nous voulons faire dans cette leçon, c'est la mise en place. Une façon que nous pouvons réellement gérer les erreurs, peu importe où elles se produisent dans notre application tout en écrivant le moins de code possible. C' est aussi la clé. Bien sûr, les contextes de billetterie parce que, vous savez, citez, n'est pas nécessairement mauvais, mais vous ne voulez pas avoir à écrire ces blocs try-catch chaque fois que vous allez effectuer une opération qui a cet appel d'API. Parce que si l'API se sent, alors notre application se sentira comme nous l'avons vu. Mais alors nous devrions écrire ce try catch à chaque endroit où nous aurions fait un appel API. Et comme vous pouvez le voir, je crache tout C'est la logique et le composant de rasoir phys et ce serait un bon nombre. D' accord. Donc, vous ne voulez probablement pas nécessairement adopter cette approche. Ça marcherait, mais on va l'essayer d'une manière différente. Donc, ce que nous allons faire pour implémenter notre gestion globale des erreurs est d'installer ce paquet appelé Interceptor client HTTP. Donc, nous allons juste passer au nouveau get dans notre application client. Et nous cherchons l'intercepteur client HTTP. Donc, nous allons de l'avant et installons une ceinture à outils, blazer à points, un intercepteur à points. Maintenant, après que cela a été installé, nous allons passer à notre fichier program.cs, puis nous allons faire quelques ajustements, commençant par nos services de construction qui ajoutent le client HTTP. Donc je vais changer ce client ici. Quand ouvrir et fermer les parenthèses, et je vais juste mettre pour SP court. Et bien, on peut retirer le mot client. Donc parce qu'il y a des types de sourds qui travaillent. Donc SVN client. Et puis je vais ouvrir une accolade bouclée ouverte et fermée, mais je vais l'ouvrir d'abord. Et puis après la définition de l'adresse de base client, je vais fermer cette accolade bouclée. D' accord ? Ou si avec moi ici, et puis après cela, nous mettons un point-virgule et puis nous apportons 29 à nouveau. On y va. Donc, nous avons, au lieu de juste client va ouvrir et fermer les parenthèses tenant Sb, qui représente le fournisseur de services, non ? Et puis les plantes qui représentent le client HTTP. Et puis nous ouvrons l'accolade et ensuite nous définissons l'adresse de base pour le client. Nous ne changeons pas cette ligne, ne voyons pas que nous faisons est d'ajouter un point-virgule. Ensuite, nous fermons l'accolade et fermons que les parenthèses sont. Nous ne modifions pas cela non plus, mais à l'intérieur de ces accolades, je vais aussi les points client et intercepter grignoter. D' accord, et ensuite ça va avoir besoin que j'inclue cette ceinture de bibliothèque. Qu' est-ce que c'était la ceinture à outils, le Dr Blaser, les extensions, l'injection de dépendance. On y va. Et puis à l'intérieur de cela, nous allons mettre tout un fournisseur de services, qui est l'objet de la vitesse ou du fournisseur de services, que nous avons défini là. D' accord, alors on peut mettre le point-virgule là. Et après ça, nous allons à Dawn un peu plus, juste une balle ici. C' est bien. Nous pouvons enregistrer notre dans nos services d'interception. Donc, vont dire les services de points de constructeur. Les points ajoutent un intercepteur client HTTP. Donc, le but de l'intercepteur est de s'asseoir et de surveiller tous les appels API et il saura si c'était une réponse réussie ne sont pas avant qu'il revienne. Donc, nous avons déjà traversé quoi, ce que nous avons déjà passé en quelque sorte à quoi ressemble le succès et à quel appel infructueux il ressemble en termes de codes de retour, n'est-ce pas ? C' est, tu sais que 500, 400, ça ne réussit pas. 200 est généralement un succès, cent trois cents, cela signifie une certaine quantité de succès ou le succès n'a pas été atteint peur. Donc, ce qui se passe est que lorsque vous arrivez à 500 et quelque chose a mal tourné, l'application elle-même, comme nous l'avons vu, juste utiliser un très vague, il ne vous dit pas ce qui s'est passé exactement mal. L' art ne fait pas savoir à l'utilisateur, hé, vous savez, les difficultés techniques traînent plus tard. C' est ce que nous essayons d'accomplir ici. Mais l'intercepteur sera un gentil. Manière propre d'avoir ce code surveillé partout sans que nous ayons à écrire des captures d'essai partout. Donc, après cela, nous devons créer un fichier de code pour laisser l'intercepteur savoir comment il devrait se comporter, dans quelles circonstances. Donc, au lieu du projet client, je vais supposer que ça crée un nouveau dossier. Je vais juste appeler ça ses services. Et puis dans les services, nous ajoutons une nouvelle classe. Et je vais l'appeler service d'intercepteur http. Il UDP interception du service. Et nous allons de l'avant et ajoutons cela. Et nous allons commencer par un constructeur. Nous devons donc injecter deux choses pour être très spécifiques. Nous avons besoin de l'intercepteur http et nous avons besoin de notre nav, Monica. Donc, nous pouvons simplement aller de l'avant et les mettre dans les paramètres de notre constructeur. Allez-y et incluez les références manquantes. Maintenant, nous entrons dans une petite chose cool ici pour les obtenir réellement initialisés dans les résultats froids, vous savez, l'argent pendant que vous l'écrivez ou nous avons fait Windows, cliquez sur l'ampoule et puis nous disons créer et affecter le champ. Donc, il va juste automatiquement aller de l'avant et créer un champ assigné et faire tout cela dans l'éjection. Nous pouvons donc le faire pour les deux paramètres, la fois pour le gestionnaire et l'intercepteur. Et remarquez que j'utilise le champ pas la propriété parce que c'est la cupidité privée, ou le droit. Par défaut, il n'est pas fourni avec le trait de soulignement. Donc, je vais juste mettre sur des scores pour être cohérent avec la convention de nommage que j'ai utilisée jusqu'à ce stade. Mais ce n'est pas grand-chose. En dehors du Smith. Vous l'utilisez juste parce qu'ils ont les mêmes noms. Donc, c'est bien. Nous pouvons aller de l'avant, savoir que nous avons fait nos injections. Et la première chose que nous allons faire est de configurer quelque chose comme un gestionnaire d'événements dans celui-ci. Ceci est appelé un voulu de faire continuellement un autre appel à quelque chose. Donc c'est comme un événement, non ? Donc je vais dire vide public, disons surveiller l'événement, pas vrai ? Et je vais juste faire cette initialisation 19 et voir point d'intercepteur. Et puis vous voyez ici nos événements que nous pouvons préparer du pain. Donc, je vais dire après l'envoi et ensuite le faire est comme un incrément. Donc, après cin, ce qui signifie en permanence chaque fois que vous faites cela, faites juste cet appel de fonction. Donc, je vais voir inter réponse. Encore une fois, nous le voulons, cela va rester entre notre client et l'appel API. Donc, il doit vraiment regarder quand un appel est fait, obtenir ceux de Butler avant le client et ensuite portable pour vous dire ce qu'il devrait faire quand il intercepte la réponse. Donc, en interceptant notre réponse, ce qu'il faut faire est d'évaluer quel genre de réponse il s'agit et de prendre une action. Donc, je suis juste de générer la méthode pour la réponse d'interception, vide privé, la réponse d'interception et l'expéditeur et les arguments d'événement. Si vous avez déjà travaillé avec WinForms ou des formulaires Web, vous savez tout à ce sujet si vous n'avez jamais eu à les construire en dehors de ce contexte, bien sûr, mais laissez-nous continuer. Ce que nous voulons faire, c'est un message. Nous pouvons juste rencontrer une chaîne vide pour commencer. Et puis je voulais voir si E, Donc E représente l'événement ou la réponse de l'événement, le résultat de moi essayer de faire quelque chose. Donc E point. Et si vous regardez ici, vous verrez que vous avez accès à la réponse sous les demandes. Je peux regarder pour voir ce qui a été demandé et la montre pour voir quelles réponses. Donc, je vais dire que si le point de réponse E point est un code de réussite, accord, est-ce que la citation de succès signifie que c'est le 200 à 300, le 100 et quelque chose qui ne signifie pas une erreur, non ? Eh bien, si vous le regardez par définition, c'est vraiment à 100 à 99, sinon c'est faux. C' est donc ce qu'est le succès. Donc, je voulais vraiment faire la gestion des erreurs, ce qui signifie que si je veux, je veux vraiment regarder, si ce n'est pas un code de réussite, alors je fais quelque chose. Très bien, parce que si c'est un Cisco de sel, alors l'application peut fonctionner comme d'habitude. Mais si ce n'était pas un succès que je voulais entrer en action. Donc, je voulais dire que le code de réponse var est égal à. Et puis nous pouvons juste dire que e point point Stato a marqué. On y va. Et puis nous pouvons avoir comme un commutateur notre déclaration if juste pour passer par les différentes options. Et si je voulais faire quelque chose si c'était un 40 pour différent de si c'était un 500 différent de si c'était un 40, 1, ce qui signifie non autorisé et des trucs comme ça. Droit. Donc vous avez différent si vous voulez rencontrer différents chemins en fonction de, oh mon Dieu, qui a eu ça ? C' était un accident sur mon empire. Mais là, il vous donne déjà tous les codes d' état qui n'auront probablement pas vraiment besoin, nous n'avons pas besoin de tous ces codes. Donc je vais juste annuler ça. Et ceux qui étaient vraiment, vraiment, vraiment, veulent vraiment se concentrer de toute façon serait le code d'état HTTP cas. Laissez-moi simplement le faire à partir du code d'état HTTP et faire toutes les inclusions que je dois faire. Et puis je veux peut-être regarder pour 500 ou bien, commençons par le pas trouvé, non ? Donc, si c'est sur pas appelé, alors je veux prendre un certain plan d'action. Laisse-moi juste mettre ça là. Et disons que si c'était peut-être 40 Huan sont non autorisés, non autorisés et ils ont aussi interdit, non ? Donc, si c'est l'un de ceux-ci, alors nous voulions probablement montrer la même chose à nouveau, un message et ensuite les valeurs par défaut, je vais juste laisser cela pour dire que si ce n'était pas l'un de ceux-ci, alors juste par défaut. Donc, cette plage de message d'erreur générique qui dit, vous savez, quelque chose s'est mal passé ces dragon plus tard, ce qui serait probablement comme un 500. Donc je vous montre que vous pouvez être précis. Ou vous pouvez juste avoir ce générique. Donc, même si nous ne voulions pas voir des chemins différents, nous pourrions simplement dire, si ce n'était pas un message de réussite, notre succès a été marqué, alors faites-le. D' accord, donc je vais mettre ces dollars. Et la raison pour laquelle nous avons le gestionnaire de navigation, le gestionnaire injecté est que je veux que nous ayons différentes pages pour les différents chemins qui pourraient être pris. D' accord. Donc, je suis allé de l'avant et j'ai rempli tout le reste et je vais juste vous guider à travers le sol. Le cas pour le pas téléphoné. Nous allons dire qu'un nouveau point gestionnaire navigue vers une page appelée fluorophore, que nous allons bien sûr créer. Ce message est ce qui sera affiché probablement dans la, la console du navigateur. Donc on va devoir jeter quelque chose à tout ça, mais on y arrivera finalement. Donc, nous allons de l'avant et naviguons vers le 40 car nous avons adoré cela à la console. Si vous êtes loin mi-mars, non autorisé naviguera vers non autorisé. Nous avons également adoré cela dans la console, puis par défaut, signifie tout ce qui était un échec. Nous naviguons à la page 50, 100 et puis nous voyons quelque chose s'est mal passé. Veuillez contacter l'administrateur. Après avoir fait toutes ces vérifications, nous allons devoir lancer une exception. Donc on peut juste dire jeter une nouvelle exception et on va juste passer ce message. Bon, donc ça va déclencher l'obligation de savoir que quelque chose s'est mal passé. Mais encore une fois, nous pouvons réellement naviguer vers une page où nous montrons à l'utilisateur un gentil, sympathique nous, que nous avons géré la situation. Maintenant, après avoir fait tout cela, nous avons encore une chose à faire là où nous devons nous débarrasser de l'événement. Nous avons donc commencé l'événement où nous appelons continuellement cette méthode à regarder. Et puis nous devons appeler l'événement Dispose, où nous allons faire le contraire. Donc, ici, nous avons ajouté et accumulé. Ici, nous faisons juste moins égal à l'art. Donc, après avoir fait tout cela, nous allons devoir enregistrer et notre program.cs, les faits que ce service existe. Donc on va faire ça en dessous. L' annonce est l'intercepteur client HTTP où nous venons de mettre et de sculpter et de mettre dans le nom du fichier, bien sûr, inclure toutes les références manquantes. Et puis nous sommes prêts à aller de l'avant et à mettre en œuvre tout ce service. Revenons donc à notre fichier CSS point point d'index. Et ce que nous allons faire, c'est laisser cette classe partielle hériter de moi jetable. Donc, cela nous donnera réellement une méthode qui nous permet de disposer de n'importe quel objet que nous ne voulons pas après la fin de sa vie. Donc, généralement, ce qui se passe est que la disposition est appelée lorsque le composant se poursuit sont lorsque le composant n'est plus nécessaire par l'application. Mais ce que nous voulons faire, c'est mettre dans une logique personnalisée pour éliminer notre intercepteur. Alors, avant de pouvoir faire ça, injectons l'intercepteur. Donc, je vais juste dupliquer cette ligne et je vais ajouter HTTP inter scepter. Laisse-moi juste copier ce service d'intercepteur. Au lieu de tendances sont les isotopes. Allez-y, incluez les références manquantes. D' accord, et laisse-moi commencer par la disposition. C' est probablement le plus facile à faire ici. Nous disons juste point d'intercepteur et nous avons déjà la méthode qui dit disposer événement. Donc on peut aller de l'avant et faire ça, n'est-ce pas ? Non, en dehors de ça, on veut vraiment surveiller ce qui va se passer. Donc, juste avant de faire notre appel, nous pouvons voir des événements de surveillance de points intercepteurs. Et c'est tout. Donc, quand nous disons événement monétaire, il va alors commencer cette méthode qui n'est pas un suivi pour voir quelle est la réponse et ce qu'elle devrait faire par la suite. Très bien, donc c'est une façon agréable et propre d'avoir quelque chose là pour regarder ce qui va se passer. Donc on peut le faire partout. Nous avons un service appelé bateau à faire dans autant de dossiers. Je vois que c'est beaucoup plus facile à mettre en place. Ensuite, tout le try-catch, essay-catch, essay-catch, parce que cela conduirait à beaucoup de répétitions. Donc, je vais le faire à nouveau dans la création. Donc, j'ai en fait mis par inadvertance le code là sans aucune injection et c'est à nouveau à partir de zéro un que je vais mettre dans l'œil des impléments jetables cette interface. Et puis je vais voir, et vous ne voulez pas nécessairement après avoir écrit le code dans cette artère et je suis sûr que vous le savez, mais je sais que vous pouvez l'écrire dans n'importe quel ordre si vous êtes à l'aise avec tant que vous suivez les étapes. Donc, nous avons l'intercepteur en cours d'élimination, nous avons l'interception surveillent la fonction, désolé, l'appel API ici. Et puis la dernière partie de ce puzzle est juste l'injecté. Et j'en vais à nouveau, copiez cette ligne pour que je n'aie pas à tout écrire à partir de zéro et voilà. Très bien, donc nous prenons note de la fin de cette activité. Une autre chose que nous devons faire est de créer les pages d'erreur parce que nous avons vu que voulait une page appelée fluorophore pour naviguer outil, un appelé sur l'auteur comme indésirable appelé 500s. Donc je suis mort et j'ai créé ces composants. 40 pour et ce n'est rien des fonds. C' est juste une page avec une étiquette H1. Voir nous prend ressource de danger que vous cherchez, il n'a pas pu être trouvé. C' est l'adresse de navigation en tant qu'OLAP pour dire barre oblique l'adresse. Donc c'est 404. Nous avons une configuration similaire pour le 500 et nous avons non autorisé et garder à l'esprit sur Azar que vos composants doivent commencer par des lettres majuscules ou non autorisé est U majuscule, mais l'adresse de navigation est bien comme un peu commun. C' est à vous de voir. Je ne mets rien de trop fantaisie dans ces composants, mais bien sûr, vous pouvez les améliorer comme vous ou votre contexte l'exige. Non, dans le contrôleur de couleurs, je vais mettre un pas trouvé juste au début de cette méthode où nous, vous savez, quand la page d'index est appelée une cause obtenir des couleurs, non ? Donc, ce qu'il appelle le get et essaie d'obtenir les couleurs. Donc, nous allons juste retourner nos 40 pour d'abord et voir comment cela réagit. Droit ? Alors allons de l'avant et regardons la page pour les couleurs et nous chauffons les points d'arrêt afin que nous voyons, vous savez, qu'il devrait juste retourner un 400 pour quelqu'un pour enlever les points d'arrêt et appuyer sur F5 pour qu'il continue. Et voilà, la ressource que vous cherchez ne pouvait pas être le téléphone. C' est notre page 404. D'accord. Bien sûr, nous obtenons cette erreur non gérée parce que nous lançons une exception. Si nous regardons dans la console, nous allons voir cette exception être levée avec le message, n'est-ce pas ? Donc, c'est à vous de décider si vous voulez vraiment lancer une exception et vous savez comment ce chargement de barre jaune, parce que cela ne signifie rien pour l'utilisateur, n'est-ce pas ? Non pas que nous utilisons. Allez également dans la console et regardez les flèches. Donc nous pourrions faire sans cela, jeter de nouvelles cartes d'exception à la fin de l'intercepteur. Et l'intercepteur gère vraiment tout avec élégance pour nous. Bon, pour qu'on puisse juste dire, naviguer jusqu'à cette page, n'est-ce pas ? Nous pourrions même améliorer le, les composants de telle sorte que nous passons simplement dans le message comme paramètre. Donc, nous ne voulons pas dur à écrire dit que ça prend de l'argent. Eh bien, c'est, encore une fois, c'est entièrement à vous de décider, mais vous avez le concept et aussi vous pouvez aller avant et l'implémenter dans votre application. Et c'est une façon agréable et propre de gérer les flèches parce que nous ne savons pas ce qui pourrait arriver avec l'API. Quelque chose pourrait être interrompu dans notre qualité get bokeh 500. Au lieu d'écrire trop de code personnalisé pour chaque 500 potentiel, nous écrivons simplement du code générique, du code global pour voir quelque chose s'est mal passé. S' il vous plaît glisser dans les administrateurs de tir de notre p cependant. C' est entièrement à vous de choisir. 37. Ajouter des changements à GitHub: Hé les gars, bienvenue. Donc nous sommes arrivés à la fin d'un autre point de contrôle. Et dans cette section, tout ce que nous avons vraiment fait était de regarder comment nous pouvons refactoriser une partie du code dans nos composants en ayant notre ou la section des composants de l'interface utilisateur différente du code derrière, à droite. J' ai donc fait ça pour les couleurs, les clients, les modèles mixtes, les véhicules. Je ne l'ai pas fait pour les réservations. J' ai donc laissé celui-ci dans son état d'origine pour préserver ce qu'il peut ressembler. Et puis je l'ai fait pour tous les autres, non ? Aussi ne l'a pas fait pour les composants étrangers parce que vraiment c'était tout ce qu'il y avait. Donc je n'ai pas pris la peine de te montrer que ce n'est pas absolument nécessaire. Bien sûr, ce n'est pas nécessairement idéal de le mélanger et de le faire correspondre comme nous le voyons dans cette section, c'est comme ça et ensuite séparé dans d'autres sections. C' est bon d'être cohérent à tous les niveaux. Cependant, je les laisse là comme exemples de code pour votre fonctionnalité ou vos amis. Autre que cela, nous avons également ajouté la gestion globale des erreurs en utilisant l'intercepteur HTTP, http, qui nous permet d'utiliser simplement une ligne pour sorte de moniteur. Et nous avons fait cela spécifiquement dans l'index une ligne à sorte de moniteur si elle sera réussie ou non. Bien sûr, avec cette ligne, nous avons l'injecteur, le service à la clientèle, ainsi que nous nous assurons de disposer juste pour nous assurer que rien ne reste dans la mémoire trop longtemps. Donc, après avoir apporté tous ces changements, nous voulons aller de l'avant et vérifier. Donc, comme d'habitude, nous lisons ou message utile et puis aller de l'avant et de commettre tout et couler. 38. Personnaliser la mise en page de identité et la logique de la logie de l'identité: Hé les gars, bienvenue. Donc, ce que nous voulons faire dans cette leçon est en quelque sorte d'explorer quelques-unes des parties les plus importantes de la bibliothèque d'identités et de voir ce que nous devons modifier. Qu' est-ce qui est agréable à avoir et juste avoir une sensation générale de lui. Donc, je ne vais pas marcher dans les moindres détails, du moins pas dans ce cours. Si vous voulez comprendre l'identité et comprendre toutes les fonctionnalités, peut mélanger mon autre cours où nous passons par l'identité, noyau et tous les rouages intérieurs étrangers, bien que nous voulons juste une sorte de brillant sur elle parce que à la fin de la journée, nous voulons fournir un peu de base pour la protéger. Et c'est ce que nous avons fait. Nous avons mis en œuvre ou un login, nous avons mis en œuvre notre inscription. Et dans notre projet, nous avions éraflé un tas de pages liées à l'identité et à la gestion. Si nous étendons simplement ceci, si vous avez oublié dans le projet serveur, dans les pages d'identité des zones, si vous m'aviez suivi, alors vous auriez échafaudé toutes ces pages. Tu vois ça ? Et au lieu de la ménorragie, plus de pages de sorte que ces positions qu'ils ont réellement fourni beaucoup de, peut-être pas tous off, mais quelques pages destinées à vous aider et vos utilisateurs à gérer leurs propres utilisateurs ou cônes à l'intérieur de la demande. Si vous n'avez pas suivi les étapes, vous pouvez toujours aller à Pages, cliquez sur Ajouter un nouvel élément d'échafaudage, puis vous voyez l'identité, puis vous pouvez érafler les adultes. Sinon, vous pouvez toujours revisiter la vidéo précédente. Maintenant, dans cette vidéo, je veux juste que nous traversions ce qui est là et comment nous pouvons le modifier pour avoir une meilleure expérience pour nous-mêmes. Donc, nous avons fait la connexion, nous savons comment semer des utilisations et ainsi de suite. Je vois que cette page est radicalement différente du reste de notre site Web. Maintenant, vous voulez probablement modifier cela. Et si vous regardez vraiment le contenu de la page, vous verrez que tout ici n'est pas vraiment pertinent pour notre application. Donc vous pouvez, si vous ne faites pas ressembler exactement cette peau avec la partie triste, la barre latérale et tout. Mais vous n'avez probablement pas besoin d'inclure le texte en utilisant un autre service pour vous connecter, qui est bien sûr contextuel, car si c'est un up interne pour votre entreprise, alors le seul service que vous voulez faciliter est l'utilisateur géré par l'entreprise ou cônes. S' il s'agit d'une application face au public pour les utilisateurs généraux, grand public, alors vous voudrez peut-être regarder l' étendre pour prendre en charge la connexion Facebook et ainsi de suite. Mais encore une fois, je ne vais pas couvrir tout cela dans ce cours particulier. Mais si vous voulez modifier cette page, vous verrez que dans l'URL, il est dit identité barre oblique une barre oblique deux-points de connexion. Donc, si nous revenons à notre projet et regardons dans nos pages échafaudées verrait l'identité sont copropriété. Et puis nous avons la page de connexion. C' est donc la page qui nous est servi lorsque nous cliquons sur connexion. Donc, cela signifie tout changement sur moi si nous voulons supprimer le lien de mot de passe oublié. C' est donc un lien de confirmation récent que nous utilisons. Ou commençons par les connexions externes, les connexions externes. Donc, nous n'avons pas de connexions externes à quelqu'un voulait supprimer cette section entière. Je vais juste effondrer qu'ils ont supprimé. Et puis probablement je veux que cette section sur avec les zones de texte prenne plus de place. Donc, ce que je vais faire est d'étendre cela à MD 12 afin qu'il s'étire pour les annonces à travers. Très bien, je peux aussi dire Utilisez les cônes de votre entreprise pour vous connecter. Très bien, donc ce sont toutes les choses que nous pouvons faire ici dans l'application. Et vous pouvez le modifier comme vous le souhaitez. Si vous vouliez modifier la disposition générale de la page, car vous remarquerez que le login et le registre ont une disposition similaire. Encore une fois, il ya juste une page est disponible pour nous pour modification. Voici une page de registre. Donc, si nous voulions faire une modification similaire pour supprimer ces connexions externes exploitables, je peux également réduire et supprimer cela, étendre ce formulaire pour prendre toute la page. Et puis, quels que soient les changements que nous devons apporter, nous pouvons faire. Non, je n'étais pas sur le point que si nous voulions changer la mise en page générale de toutes ces pages, alors ce que nous pouvons faire est de passer dans l'explorateur de solutions et regarder et voir commence, ce qui indiquera où cette page de mise en page est appelée . Et ce sont des pages barre oblique partagée barre oblique layout.css HTML. Et si vous regardez en commun, vous ne le verrez pas. Mais si vous descendez dans le dossier Pages, alors vous trouverez partagé. Et voilà notre mise en page. Donc, à partir d'ici, et si vous avez déjà utilisé les pages dotnet Core MVC ou chevalet, vous serez au moins familier avec ce genre de page de mise en page où il est standard Bootstrap 4 page. Et puis vous pouvez changer les éléments de menu. Donc, vous pouvez voir ici l'application de gestion actuelle, au lieu de juste le nom du projet, vous savez, vous pouvez personnaliser toutes ces choses. Il montre un tas de partiels et quelques conditions. Vous ne voulez probablement pas nécessairement modifier chaque chose, mais vous pouvez certainement changer quelques choses pour le faire sentir plus comme votre application plutôt qu'un modèle mère. Bon, donc l'application de gestion de voiture et Tom, vous mettez les endroits clés. S' il y a une déclaration de confidentialité, alors bien sûr, vous allez de l'avant et faites cela. Et cela rend l'année et toutes ces choses merveilleuses que je sais la plupart de cela une fois de plus, a été en quelque sorte fait pour le soutien des pages liées au serveur d'identité. Très bien, donc vous voulez être très prudent comment vous faites des modifications. Mais pour les balises HTML générales, tout ce qui n'est pas à soulever orienté, alors vous pouvez aller de l'avant et apporter vos modifications et les corriger comme bon vous semble. Maintenant, je vais juste redémarrer cette application compte tenu de tous les changements que je viens d'apporter. Et puis quand l'application apparaît et que je vais me connecter, sachez que vous allez voir la page de connexion ressemble différemment, n'est-ce pas ? Je viens de modifier la mise en page dans une certaine mesure. La ferme ne demande plus Theobald, c'est tout ce qui n'est pas pertinent pour l'application. Et le texte semble un peu plus invitant null. D' accord. Et juste la même chose pour la page d'inscription ? Non, en ce qui concerne l'ajout de champs à la page d'inscription. Et une autre chose courante que vous voulez probablement faire est non seulement demandé pour l'e-mail, mais peut-être e-mail ou nom d'utilisateur ou juste nom d'utilisateur parce que Ryan Non, ce qui se passe est que ce formulaire est par défaut de demander une adresse e-mail pour le nom d'utilisateur et juste fermer certains onglets qui ne sont pas absolument hors de propos, n'est-ce pas ? Non. D'accord. Commençons donc par la page de registre. D' accord. Donc, la page de registre est en cours application de pages Razor sont des tableaux de pages page. Donc il a le code derrière, pas vrai ? Donc, si nous regardons juste les pages en arrière par répété, vous verrez le CSS, HTML. Css. Nous avons en quelque sorte regardé quelque chose comme ça quand déjà ne peuvent pas être des composants blazer et le code derrière le fichier, n'est-ce pas ? Donc, chaque page ici a un code derrière. Donc, quel que soit le fichier CSS point de registre, HTML et CSS derrière, c' est le CS5 derrière lui. Et ce que vous verrez ici, c'est qu'il a une propriété clé appelée modèle d'entrée de type modèle appelé input. Et puis ce n'est vraiment qu'une classe. Et ce verre est utilisé pour modéliser la forme. Donc, cette classe n'a que le champ pour l'adresse e-mail, qui est fortement tapé comme une adresse e-mail. Nous avons examiné la validation plus tôt. C' est pourquoi nous devons utiliser une adresse e-mail au moment de l' inscription et ensuite nous devons l'utiliser à des fins de connexion. Sachez que si nous supprimons cette contrainte et nous avons dit, vous savez, chaîne publique, nom d'utilisateur pour l'argument. Et nous avons dit entrer votre nom d'utilisateur ou votre adresse e-mail. Ce n'est pas aussi strict que d'exiger une adresse e-mail à ce stade. Cependant, je ne vais pas déranger ça. Je pense que l'adresse e-mail est un bon moyen de garder tout ce dont vous avez besoin pour la colonne nom d'utilisateur. Et il sert un but d'aller à la fois dans le nom d'utilisateur et l'adresse e-mail. Donc nous pouvons laisser cet étranger sur décevoir toutes ces choses clés au cas où vous voulez probablement modifier. Connaissez notre utilisateur d'application. Permettez-moi de m'arrêter et de passer à notre modèle d'utilisateur d'application. Ici, nous voyons que nous avons FirstName, LastName, et puis c'est, il hérite de l'utilisateur d'identité. Cela signifie que nous avons la capacité de stocker prénom et le nom de famille dans notre base de données pour chaque utilisateur, ce qui n'est pas une mauvaise option, n'est-ce pas ? Non. Que faire si nous le voulons lorsque la personne enregistre le prénom et le nom d'entrée. Et par extension, vous pouvez ajouter d'autres champs si vous voulez une date de naissance, sexe, et cetera, vous pouvez ajouter tout cela ici. Mais la partie clé est que dans le modèle d'entrée, vous devez avoir des représentants pour ces champs. Donc, si je dans le modèle d'entrée met dans les intérêts bien ces deux champs, et nous allons les rencontrer requis parce que cela n'a pas de sens pour nous. Ou faites utiliser un IAM, désolé, Prénom et Nom facultatif, mais l'e-mail n'est pas correct. Donc e-mail, prénom, nom, mot de passe, et confirmation du mot de passe. Et vous voyez qu'ils utilisent les données sur les notations que nous avons examinées quand les validations ne peuvent pas déjà être validées, n'est-ce pas ? Donc toutes ces choses sont nécessaires non, sur get. Tout cela est faible. Le pH. Nous pouvons même supprimer cette particule lors des connexions externes. Nous n'utilisons pas de connexions externes. Qu' est-ce que je ne suis pas encore un code linéaire. Sur la poste. Nous voyons qu'il valide. C' est donc ce que nous validons. Et puis il construit l'objet utilisateur avant qu'il ne continue et le crée. Non, je viens de demander Prénom et Nom en plus de l'e-mail et du mot de passe. Cela signifie donc en construisant cet objet, je peux savoir fournir des valeurs pour FirstName. Et maintenant ces Brian Kernighan, prénom peut maintenant être égal à point d'entrée prénom. Encore une fois, l'entrée est juste le type d'objet qui représente le modèle d'entrée, qui est ce que nous venons de modifier. Donc, je peux maintenant mettre dans le prénom et je peux maintenant mettre dans le nom de famille. Cela signifie que lorsque quelqu'un s'inscrit, il devrait avoir des données dans les champs prénom et nom de famille. Eh bien, c'est le code derrière l'interface, cependant, ne reflète toujours pas cela. Donc, ce que nous allons faire est de modifier l'interface pour savoir qu'elle devrait avoir des zones de texte pour le prénom et le nom de famille. Et maintenant, ils le font simplement en copiant et en collant la zone de texte pour l'e-mail. Et je vais juste dire au premier prénom. C' est donc une étiquette pour la première entrée nommée pour le prénom et une validation pour FirstName. Et puis la même chose pour LastName. Et puis e-mail quand je les copie par deux fois. Par conséquent, l'e-mail reste comme e-mail. Alors sachez que nous avons modifié ce formulaire lorsque quelqu'un s'inscrit, il sera en mesure de fournir tous ses détails, puis de s'inscrire et d'avoir ce dossier. Alors faisons-le ça pour un test rapide. Donc, je vais juste m'inscrire afin qu'il voit le schéma pour le prénom, le nom de famille, pas de prénom remarqué. C' est un peu ça ensemble. C' est CamelCase mais il n'y a pas d'espace entre les deux, donc je vais juste réparer ça avant même d'aller plus loin. Donc, de retour en entrée, ce que je peux faire est dire affichage. Mon nom est d'abord le nom avec un espace dedans. D' accord, c'est ce que l'étiquette va rendre. Bon, donc ce ne sera pas les noms de famille, alors laissez-moi juste redémarrer ça et vous montrer à quoi ça ressemble. Et nous y voilà. Prénom, nom, donc ils voient que ça a l'air beaucoup mieux. Alors laissez-moi juste mettre quelques valeurs aléatoires et appuyez sur Register et voyons ce qui se passe. Très bien, donc le registre, un processus a réussi et c'est parce qu' il a réussi sur post créé cet objet, créé l'utilisateur. Je suis allé de l'avant et depuis ce code maintenant cette partie d'Etruria, cet expéditeur de courrier électronique et ainsi de suite. On pourra le regarder plus tard. Hold to réellement mis en place sur le système de messagerie dans notre application blazer, ce qui est très important pour la sécurité parce que nous voulons vérifier que la personne qui s'inscrit peut recevoir et valider Will ils sont, droit. C' est juste un autre niveau de sécurité qui apporte du confort à la fois à l'entreprise et à vos clients potentiels, n'est-ce pas ? C' est ce qui s'est passé quand on s'est inscrit. D' accord ? Maintenant, si vous regardez mon insuffisance, ça pourrait nécessiter un peu de réparation et c'est bon. Mais alors si je clique sur la section qui dit Bonjour, GOP va faire apparaître la page de profil, qui est encore une fois juste un autre fichier qui se trouve dans ce dossier. Non, Celui-ci est à l'intérieur de gérer, dit une barre oblique deux-points gérer. Et je crois que ce serait un indice, non ? Donc, une barre oblique deux-points gère. Et puis nous cherchons le fichier d'index, et c'est la page que nous regardons où il montre le nom d'utilisateur, le nombre complet, tout ce qui est dans le système pour cette personne écrit pourrait facilement mettre celui-ci dans, Enregistrer et il mettrait à jour le profil avec cela, je clique sur email, il me montre que vous voyez toutes ces choses sont juste ici. Ainsi, vous pouvez donner à un utilisateur la possibilité de gérer son propre ou copropriétaire, réinitialiser son mot de passe ou changer son mot de passe ou autre, et configurer un PHP si nécessaire. Nous n'avons pas de tophi, mais je vous montre tout ce que notre bibliothèque d'identité nous permet de faire. Encore une fois, vous pouvez toujours modifier la mise en page si vous voulez qu'elle affiche plus d'informations ici. Donc, pas de modèle d'index n'affiche simplement le numéro de téléphone. Mais alors vous pouvez toujours étendre cela. Vous pouvez toujours l'étendre pour inclure le prénom, le nom et tous les autres détails que vous voulez qu'ils l'utilisent pour pouvoir voir et modifier lorsque le R sur ce. Maintenant que le bucking est en place, je vais juste me déconnecter. Et puis vous verrez qu'il y a un enregistrement des erreurs ou non, lorsque nous configurions la navigation ou réécrivions l'ensemble du composant de navigation, j'aurais supprimé quelques guillemets vervet. Donc je vais écrire ça mal ou bien ? Non, non. Si nous sautons sur le composant de menu nav, vous verrez bien que nous avions mauvais pour le contenu d'affichage de connexion à cette zone. Bon, maintenant si je pouvais juste comparer cette section pour l'autorisation sur avec l'affichage de connexion, vous verrez bien, premièrement, la comparaison des composants. Il y a quelques injections sur certaines bibliothèques utilisées dans l'affichage de connexion. Et il y a aussi du code à la fin du composant d'affichage de connexion. Maintenant, ce qui se passe est que la procédure de logo est vraiment comme une soumission de formulaire par opposition à un simple clic de lien. J' aurais donc remplacé le bouton qui aurait soumis un formulaire ou au moins commencé un processus de soumission de formulaire pour naviguer vers le vote authentifie. Cette partie est très vitale. J' aurais contourné cela et sauté directement à l'URL , c'est pourquoi nous avons cette erreur. Il disait, eh bien, si ça venait d'une source inconnue. Donc, ce que je dois faire ou ce que nous devons faire est de laisser ce Novalink onclick appelé ce code. Mais une fois de plus, tout est dans et l'affichage de connexion. Par souci de simplicité, nous allons supprimer l'affichage de connexion. Et nous allons juste mettre tout le code dans les scènes du menu nav. C' est là que tout se passe avec autorisé et les nombreux articles et tout, non ? Donc, je vais juste copier cette fonction à partir de l'affichage de connexion. Si vous l'avez supprimé, si vous l'avez fait, alors c'est bien. Vous pouvez toujours simplement faire une pause et reproduire ce morceau de code. Et je vais aussi prendre ces bibliothèques, donc injecte et aussi Shan State Manager, gestionnaire de navigation. Et ces deux bibliothèques, ou haut ou bien, les bibliothèques et les fonctions ou classes injectées, n'est-ce pas ? Et puis ce que nous pouvons faire est sur le lien de navigation qui dit F est égal à l'authentification et aux logos. Je vais le mettre comme un hachage le repère car il semble que obtient un lien actif. Mais heureusement, nous utilisons un composant blazer et les composants blazer peuvent faire en cliquant. Donc, de la même façon que le bouton dans l'affichage de connexion, ce n'était qu'un bouton. Et ça aurait fait ça. Onclick commence psi rien. Je vais dire à ce NoveLink que quand il est cliqué, il devrait appeler cette fonction. Commencez à dire ALT, qui est ici. Encore une fois, vous sentez vouloir séparer ces PFAS ont le composant et le code derrière le fichier. Ensuite, nous avons déjà fait un exercice ou nous l'avons fait. Donc peu de libres d'aller de l'avant et de le faire. Mais pour cette opération simple, je vais juste rester simple. Je ne suis pas allé faire tout ça. D' accord. Alors essayons ce processus de logo une fois. Donc, je suis Buck en tant que JPSM management.com, puis je clique sur déconnexion et vous voyez que c'est un processus complètement différent, tout à fait différent sentiment. Je sais que ça marche. Donc, vous voyez où beaucoup de points et vous pouvez revenir en arrière et vous inscrire. Non. Ainsi, vous voyez même ces procédures peuvent être gérées avec nos pages et comment tout circule du point de vue de l'utilisateur à travers les différentes parties de l'application. Bien sûr, nous autorisons tous ces liens. Donc, une fois que vous cliquez sur un lien, vous devez être autorisé. Et la raison plus profonde de l'autorisation, tout comme un résumé, est qu'une fois que vous autorisez automatique Valley, C'est un cookie créé qui a un Tolkien. Et ce Tolkien est ce qui est utilisé pour authentifier cet utilisateur à travers l'APA, le projet serveur. D' accord, alors rappelez-vous que tout ce que l'utilisateur fait quand ils ajoutent des voitures font une opération merveilleuse. Ils sont vraiment dans le client par pièces. D' accord ? Et puis quand ils doivent frapper l'un de ces points de terminaison API, il doit y avoir un Tolkien attaché à cette requête. Et c'est une partie de ce qui a été envoyé ici quand nous avons construit ce client HTTP. Et nous lui avons dit qu'il devrait toujours envoyer un gestionnaire de message d'autorisation. Maintenant, plus tard, nous allons voir comment nous pouvons envoyer des demandes d'API autorisées. Parce que comme ça étourdit, une fois que nous utilisons ce client, il va automatiquement essayer d'attacher un Tolkien. Disons que si aucun jeton n'est présent, alors vous obtiendrez toujours une sauvegarde 40, 1, 4 ou 3, en voyant que vous ne pouvez pas accéder à la ressource côté API. Donc c'est sa façon. Avoir la connexion de l'utilisateur est si vital. Mais il peut y avoir une situation où vous ne voulez pas l'utilisateur ou vous ne voulez pas forcer l'utilisateur à devoir se connecter pour accéder à une certaine page ou être en mesure d'interagir avec certaines données. Il pourrait y avoir cette situation. Donc, nous allons voir comment le week-end faire cela plus tard. 39. Interop de JavaScript avec les bibliothèques tierces: Hé les gars, bienvenue. Dans cette leçon, nous voulons faire une plongée plus profonde dans JavaScript, interop, savoir que nous avons abordé C'est un peu quand nous avons fait un appel. Et c'était à notre propre petite méthode interne onclick. Lorsque nous avons cliqué sur notre bouton ici, nous avons eu cette confirmation sur. Êtes-vous sûr de vouloir supprimer le droit ? Maintenant ? La réalité est que vous voudrez probablement que cela soit un peu meilleur. Vous ne voulez pas que ce soit la tonne d'alerte de vanille de boîte de confirmation qui est livré intégré avec un navigateur. Vous voulez probablement utiliser une bibliothèque tierce comme peut-être pour que vous appreniez jusqu'à présent, donc pour lui donner un peu plus de caractère. Une autre chose que vous voulez probablement faire est de modifier un tout, que les données sont affichées. Donc, non, tout est juste affiché dans la table de roquette et ça continue et continue. Donc, plus j'étais un lamda, le pH n'est pas. Aujourd'hui, nous allons nous concentrer sur l'affichage des données ici dans la grille. Donc, nous allons mettre dans une grille plutôt diplômée et je suis allé me concentrer sur la page des réservations parce que je pense que celle-ci ferait bien avec la grille plus que les autres, au moins dans le contexte, mais il n'y a pas de limitation . D' accord ? Donc, ce que nous voulons faire est de transformer cet affichage tabulaire de données en une grille. Et la grille que nous allons utiliser aujourd'hui, ce sont les tables. Donc, si vous n'avez jamais utilisé les deux tables auparavant, vous pouvez aller à Data Tables.net et vous pouvez utiliser cette barre oblique URL exacte, exemples barre oblique style Bootstrap 4 point HTML. Nous utilisons donc Bootstrap 4 dans notre application blazer. Donc, je veux l'habillage pour les tables de données qui sera le mieux avec la mise en page globale que nous avons. Très bien, alors quand vous serez sur cette page, vous pourrez l'expérimenter. Si vous êtes familier avec les tables de données, quelqu'un sait de quoi nous sommes tous aujourd'hui ? Si ce n'est pas le cas, alors c'est une façon agréable et amusante, un moyen facile de tabuler toutes les données qui arrivent. Il a la pagination automatique. Certes, tout cela se passe côté client. Donc c'est comme une victoire rapide. Plus tard, au fur et à mesure que l'application commence à croître, vous voulez probablement implémenter. La pagination côté serveur réduira la charge. Mais pour null pour un petit haut qui semble juste avoir cette victoire rapide en implémentant des tables de données. Et cela nous donnera un peu plus d'informations sur la façon dont Blazer interagit avec JavaScript et d'autres choses que nous devons considérer lors de ce genre d'opération. Donc, sous le spectacle, tous les liens d'accès ou les liens CDN pour toutes les ressources nécessaires au fonctionnement des tables de données. Et ils devraient être inclus dans cet ordre particulier. Très bien, et ce minimum, ce code est requis. Après tout ça ? Non. Il s'agit de liens et de liens vers des fichiers hébergés sur Internet. Ils sont bons en termes de quand vous avez accès à Internet. Ils ont tenu l'application pour charger plus vite, surtout comme la surutilisation du klan dit blazer. Et surtout si quelqu'un décide d'aller progressivement sur télécharger l'application. Vous savez, ne pas avoir le Fazlollah physique réduire l'empreinte de l'AP en général. Cependant, en mode hors ligne ou quelqu'un essaie d' ouvrir cela et il sera dans un accès Internet immédiat. Et ces liens ne peuvent pas être atteints pour le moment. Ensuite, dans cette situation est probablement bits il d'avoir les fichiers physiques. Donc vous savez, vous pouvez donner, prendre et évaluer votre appétit au risque. Mais une fois de plus, pour la victoire rapide et juste pour la compréhension globale de la façon dont JS interruption fonctionne, nous allons juste utiliser les liens CDN et nous allons inclure ces références dans notre projet au fur et à mesure que nous continuons. Maintenant, commençons. Et ce que nous allons faire est de créer des références scripturales à ces liens à l'intérieur de notre application blazer null, où nous devons les inclure est très spécifique sur les particules. Donc, nous devons aller à la page index.html et je vais juste arrêter là en cours d'exécution ou du tout afin que nous puissions faire notre édition dans la page index.html qui est dans le dossier racine, et c'est index.html. Nous aurions besoin d'inclure ou de références d'Écriture avant notre fichier WebAssembly Blazer dot ab.js. Donc je veux dire, nous pouvons l'inclure avant le service d'authentification, mais celui-ci est un peu secondaire au fanatique le plus souvent pour celui-ci maintenant c' est parce que nous utilisons le client blazer sont le projet WebAssembly. Si nous utilisons les projets de serveur blazer, alors ce serait dans le fichier hôte et une contrainte similaire s'appliquerait réellement. Alors continuons dans notre index.html et je vais juste les coller là. Et puis ce que nous devons faire est un peu d'elle à l'intérieur des scripts dot js. Donc, je vais dire que le script est égal à S, Script, SRC est égal à et puis le lien. Et puis nous allons de l'avant et fermons nos balises de script. Et puis nous allons le faire pour tous ces liens. Et une fois que vous avez terminé cela et que vous avez vos liens ressemblant à ceci, laissez-moi simplement supprimer cela. Ensuite, nous pouvons revenir à la page des tables de données et désolé, et nous pouvons récupérer les fichiers CSS afin que tout ce que vous êtes en mesure d' utiliser et c'est presque les mêmes règles s'appliquent lorsque vous traitez avec gustation ou désolé, le CSS est ce que nous voulons. Les mêmes règles s'appliquent lorsqu'il s'agit d'applications Web. Si nous allons utiliser dans la bibliothèque, vous devez vous assurer que vous avez toutes les références pertinentes à la bibliothèque. Donc, je suis allé de l'avant et ajouté les liens d'outil au fichier CSS de table de données, bien sûr, gonfler en fait seulement besoin d'un parce que l'un d'eux est Bootstrap, que j'ai déjà dans mon projet. Donc, je vais en fait avoir juste une référence. C'est un écran qui est, je vais vite avant de continuer. Donc, quand ils ont la référence du vagabond, et c'est la seconde où ses amis sont ici. Les tables de données pointent Bootstrap, 4 points main.css. C' est ce dont nous avons besoin. Savoir. Nous devons écrire notre propre fichier de script, que nous allons réellement faire une initialisation dynamique parce que si nous prévoyons d'utiliser la table de données à plusieurs endroits que nous devons être en mesure d' appeler une fonction spécifique à partir des actes de tables, passer la table à laquelle nous voulons qu'elle soit appliquée. Le nom de la table ou un identifiant de la table, qu'il s'agisse d'une classe ou de l'ID, nous savons comment cela fonctionne, ou si vous êtes déjà familier avec son fonctionnement. C' est pourquoi nous devons écrire ce JavaScript personnalisé sur lequel nous avons le contrôle. Très bien, donc je vais juste dans le dossier racine www, allez-y et ajoutez un nouveau dossier et je vais l'appeler Scripts. Et puis à l'intérieur je vais scripts, je vais ajouter un nouvel élément sous la forme d'un fichier JavaScript. Et je vais juste l'appeler point de table de données js, point de table de données js là, nous le saurons dans data.table ab.js, je vais avoir une fonction qui m'appelle garder simple. Table de données ou table. D' accord ? Et cette fonction va prendre la qualité de l'environnement à la table. D' accord ? Et à peu près tout cela va faire est d'initialiser les documents et nous disons document.ready. Vous savez que c'est une partie standard de jQuery. Fonction entendue, accolade ouverte et fermée, ouverture et fermeture accolade. Et puis à l'intérieur de ça, nous allons juste chercher des éléments ou une table de signe de dollar. Donc, comme je l'ai dit, le nom de l'élément ou quelque chose pour identifier l'élément est ce qui sera passé en tant que paramètre. Donc point de table, puis c'est aussi simple que data.table. Donc, c'est des tables de données entières vous obligeraient à l'initialiser. D' accord, on ne fait que traverser ça parce qu'on en a besoin pour qu'il soit accessible par l'interruption, l'interruption. Mais sinon, nous savons tous que c'est tout ce dont nous avons vraiment besoin dans une partie assise HTML régulière. Le prochain que je vais faire est de supprimer notre disposer la queue parce que ce qui se passe est que lorsque la page passe, nous ne voulons pas que ce composant persiste dans le navigateur, dans la console, et persiste dans la mémoire que tout ce que je était à la table de données de trois pages notre objectif que nous voulions atteindre est déplacé, n'est-ce pas ? Donc nous allons appeler cette méthode d'élimination que nous savons que nous allons effacer cette table de toute référence. Il fait chaud, non ? Nous avons toujours besoin du document ou de tout autre document, donc je vais juste copier et coller ça. Mais à l'intérieur de cette section, je vais dire les données de points de table, les points de table détruisent. Vous voulez ou déplacez leurs amis. Et puis je vais trouver les éléments. Et je vais le faire en disant document.write, sélecteur de requête et chercher table plus. Et puis un mot clé qui se passe habituellement, c'est qui dit « underscore wrapper ». Et puis je dirai que le nœud parent élément a supprimé les éléments enfants, non ? Donc, je suis juste en train de supprimer toutes les traces de cet élément une fois que nous avons terminé avec le DataTable, Donc, disons sont sur la page, va charger la table de données, vous naviguez loin. Nous voulons tuer la table de données et supprimer l'élément de la fenêtre entière, de l'application entière jusqu'à ce que vous reveniez de toute façon après la réinitialisation, c'est une sous-partie du territoire. C' est quelque chose qui doit être fait pour garder l'obligation sur l'exécution propre et, encore une fois, réduire cette empreinte de l'application. Bon, maintenant que nous avons ce fichier de script dans le HTML, bien sûr l'Ultimaker pour les instituts, et je vais y faire référence après tout, non ? Donc, je peux simplement glisser et déposer cela depuis l'Explorateur de solutions et il y a notre fichier de script personnalisé. Passons maintenant au composant où nous avons l'intention d'utiliser ce JS Runtime. Et j'ai dit que nous allons commencer par les réservations, aller à l'index pour les réservations. Et je vais commencer par inclure haut frette sur l'injection, disant impléments jetables. Donc, je jetable est C Sharps que nous faisons collecte des ordures aurait réellement interagi avec elle avant. Non. Donc, lorsque ce composant est terminé, je jetable entre et détruit le composant dans la collecte de la mémoire. Donc, cela va travailler main dans la main avec notre méthode d'élimination ici, mais nous le verrons dans quelques secondes. Co-exécutif, tout va le lier. Maintenant, je vais donner à notre table ici et IBM quand appeler l'équipe de réservation, n'est-ce pas ? Ou des tables de réservation. Cette table de réservation, n'est-ce pas ? Non, nous le savons tous. Maintenant, nous devrions savoir qu'en HTML et nous donnons à un élément un ID, c'est un identifiant unique. Cela vous sera utile lorsque nous allons appeler notre méthode asynchrone. Parce que rappelez-vous que nous allons appeler cet ajout à la méthode de table de données, qui va prendre comme paramètre le nom de l' élément, il devrait appliquer la table de données appelée 2M. Donc, ce que nous allons faire ici, c'est appeler une autre méthode protégée. Donc protégé est évier et nous voulions remplacer la tâche. Et celui-ci que nous écrasons est sur après que le rendu voit, ce qui prend un booléen appelé premier rendu à utiliser sur les charges dans IntelliSense. Laissez-moi essayer encore une fois. Très bien, si protégé par-dessus, puis de l'espace. On y va. Ensuite, nous allons après sous un chante je pense que parce que j'ai écrit async plus tôt, il n'a pas demandé celui-là. D' accord. Laisse-moi juste réparer ça pour que ce soit asynchrone. Bien sûr, on y va. Donc, cette méthode, et je le fais directement sur le non initialisé. Donc, vous pouvez voir qu'il y a quelques méthodes ici qui peuvent être exagérées à des fins spécifiques. Donc, le rendu après, un évier est vraiment une méthode à voir après que le composant a rendu, que voulez-vous que je fasse ? Souvenez-vous maintenant, je dirai qu'il est important de faire certaines choses à certains moments. Donc la façon dont nous avons inclus les fichiers, peut-être que cela aurait pu être une exagération, peut-être que nous aurions pu mélanger sur une grande partie de la commande. Bien sûr. Il vaut mieux les charger avant que tout ne sépare le Maryland ici, laisse-moi les remettre. D' accord. C' est très bien. Mais en ce qui concerne un composant, si nous allons appeler fonctions JavaScript de notre propre couloir, à partir de code tiers. Nous devons le faire après que le composant a chargé tous ses actifs. C' est donc ce que dit cette méthode après le rendu asynchrone, après que le composant a terminé le chargement de tout ce qu'il doit faire. Que veux-tu faire avec ce supplément ? Donc, pendant qu'on veut le faire, c'est en plus. Donc, je vais juste supprimer cette ligne par défaut. Et je vais voir que je ne veux pas attendre un, G, S, et nous savons ce code, nous avons fait ce trimestre, le bon appel JS est sink et récupérer une valeur tellement que je vais juste copier cela, non ? C' est le même code. Js est notre objet, invoquer un évier. La seule différence est le type de retour. Je voulais donc mettre ce type de retour en tant qu'objet. Ou vous pouvez réellement voir un vide art, désolé, invoquer void async, qui ne renvoie rien, n'est-ce pas ? Alors essayons le vide. Si le garçon ne fonctionne pas, nous revenons juste à la, à l'appel Async. Mais quand nous faisons cela, nous devons transmettre ce nom de méthode. Donc, dans le cas de notre confirmation, le nom de la méthode en JavaScript est confirmé, n'est-ce pas ? Dans ce cas, le nom de la méthode que nous appelons est notre table de données. C' est notre méthodologie créée ajouter tableau de données. Ok, quels sont les paramètres ? Donc, cela prend un paramètre, la confirmation, le message que nous voulons qu'il affiche dans cette situation, notre paramètre ici est la valeur d'ID de notre table. Très bien, C hashtag ou livre, et puis la valeur de l'ID, et c'est tout. Donc, lorsque le composant a rendu, nous voulons appeler le code JavaScript. D' accord ? Non, j'aurais dit que le jetable, donc on doit voir ce qui se passe quand on se débarrasse. Donc, nous allons lier le code jQuery dispose aux codes éliminés par le composant presque par défaut. Je vais juste dire vide je jetable point disposer quand vous êtes en train de disposer. C' est ce que je veux que tu fasses pour moi. Je veux appeler g is invoke. Et je vais juste vous montrer que c'est vrai, mais une méthode différente cette fois, le même paramètre, même méthode d'appel sauf que j'appelle la table de données est éliminée et c'est un vide, donc nous ne sommes pas prêts à attendre cet appel de méthode. D' accord, alors prenons ceci pour un tour et voyons si notre discours de réservation reflétera nos besoins que personne ne nous allons à notre page de réservations. On y va. Nous avons notre tableau de données affichant nos options de pagination. Nous pouvons rechercher son instantané tout ce que nous pouvions faire dans le week-end normal de séance HTML, pas faire dans notre application blazer, cela va juste pour montrer combien il est facile d'intégrer une bibliothèque tierce. Donc, je pense que j'ai commencé avec l'exemple que vous voulez probablement changer ancien disconfirm à quelque chose comme une alerte douce ou quelque chose que vous pouvez aller de l'avant et l'essayer par vous-même, obtenir les actifs, les mettre dans le puis vous avez juste à appeler votre appel au moment approprié. Maintenant, remarquez que lorsque je navigue vers les autres pages, tout est propre. Je n'ai pas mis les tables de données sur les autres pages, mais quand je retourne aux réservations, tout va bien. Maintenant, si ce n'était pas une solution et je vais juste vous montrer les conséquences de l'affaire de dépossession. Tu penses que c'est peut-être des étapes inutiles. Donc, je vais juste commenter ce redémarrage de la ligne. Et puis nous avons regardé la page des réservations. Maintenant, regarde en haut. Ce que j'ai fait, c'est aller aux réservations, aller à une autre page sur les mentons combustibles. Maintenant, je suis sur les réservations. Regardez ce qui se passe quand je vais dans les véhicules. Il est toujours en stock, donc il ne se débarrasse pas de la table de données du conteneur. Parce que rappelez-vous que ce WebAssembly une fois qu'il est chargé, tout est préchargé à la fois. Donc, nous devons nous garder une petite empreinte sur certaines choses que nous ne voulons pas envahir à travers l'application dans cette situation, que la table de données de seulement la page des réservations monte, a commencé à apparaître sur les clients. Et chaque fois que je vais à des réservations et aller à une autre évaluation de page pour continuer à accumuler et à accumuler. C' est pourquoi ce code de disposition est de la plus haute importance. Donc Alice Goldbach sans commentaire à cela. Je suis désolé. Je ne voulais pas juste expérimenter et je suis content que tu sois là. Très bien, donc c'est une introduction agréable et facile à interrompre JavaScript interruption, Désolé, avec blazer. Vous pouvez étendre à nouveau tra, d'autres bibliothèques tierces, et ensuite peut-être peut pousser vos compétences vers le haut des enchères et développer une bibliothèque personnalisée ou un composant qui implémente simplement l'une de ces bibliothèques afin que vous puissiez réduire la quantité de travail et vous appelez sur le code répété pour l'appel GS. D' accord. 40. Support de téléchargement de fichiers: Hé les gars, bienvenue. Dans cette leçon, nous voulons jeter un oeil au support de téléchargement de fichiers que Blaser a. Donc, ce que nous allons faire pour cette leçon est d'ajouter un champ d'image à la table des véhicules. Les téléchargements de fichiers ne sont pas limités à des images bien sûr, mais à titre d'exemple, nous allons utiliser le véhicule parce que lorsque nous ajoutons un nouveau véhicule, probablement voulu prendre une photo du véhicule, mettre dans le système pour une raison quelconque . Mais il peut également être appliqué à peut-être lorsque nous sommes client d'embarquement, nous voudrions probablement quelques détails sur eux. Vous savez, leurs passeports sont un permis de conduire valide, des formes de documentation. Ainsi, le même concept que nous sommes sur le point de l' appliquer au téléchargement d'une image du véhicule pourrait être appliqué dans plusieurs scénarios, quelles que soient les règles métier selon les exigences que vous pourriez avoir. Alors commençons. Donc, dans la classe de domaine de véhicule, nous voulons ajouter deux nouveaux champs, et je vais juste les ajouter ci-dessous ici. Et le premier sera public par RE, donc c'est juste un budget et je vais appeler cette image, il y a cette image de nuage, d'accord ? Et préparez-vous lorsque nous transportons notre image de l'application cliente vers l'API. Nous allons devoir le convertir en un tableau d'octets, une ferme, et ensuite nous allons le démonter, envoyer sur le fil, puis le réassembler pour le sauver de l'autre côté. Et c'est à peu près ce attelle hors sujet. Mais ce que nous voulons vraiment faire est de prendre note du nom, quelqu'un d'avoir ce nouveau champ appelé nom de l'image. Et c'est vraiment ce qui va identifier l'image. Donc, ce que nous allons faire est quand nous le recréons et l'enregistrer le disque sur l'API a dit que nous allons voir quel que soit le nom que nous lui avons donné dans la base de données afin qu'ils puissent être récupérés chaque fois que nous en avons besoin. Non, l'un d'entre eux est requis dans la base de données, et ce n'est pas celui qui est requis. Donc, ce que nous pouvons faire est d'ajouter une annotation au-dessus pour dire et ne pas être balayé. Très bien, donc pas balayé va essentiellement voir un quand nous sommes sur le point de faire une migration, ignoré ce champ. Très bien, donc c'est très important chaque fois que vous modifiez vos classes de domaine et que vous mettez probablement dans des champs que vous ne voulez pas dans la base de données. Vous ajoutez simplement cette annotation non mappée et elle ignorera la base de données. Bon, alors voyons ça en pratique. Donc, je vais juste ajouter la migration. Et ça va être l'image de la cape. Véhicules. Laisse ça aller. Et quand cela est fait, nous pouvons jeter un oeil et nous voyons que nous n'avons qu'un des deux champs que nous venons d'ajouter. Donc le nom de l'image n'est pas ajouté deux véhicules. Donc on peut aller de l'avant et obtenir les données, d'accord. Alors sachez que c'est fait. Passons à l'API et faisons quelques ajustements. Tout d'abord, s'il vous plaît injecter ces deux lignes ou ces deux bibliothèques. Nous avons l'hôte web et l'environnement, et nous avons l'accesseur de contexte HTTP AI. Donc, cela va nous donner accès au dossier des fichiers statiques. Donc dotnet core par défaut comme un dossier de fichiers statiques, qui est notre racine www de genre passé par cela plus tôt. Qu' est-ce qui est stocké dans cela ? Donc, à l'intérieur de ce dossier, nous voulons avoir un autre dossier appelé Upload. Donc, vous pouvez aller de l'avant et créer cela juste un clic droit, aller à ajouter et dire un nouveau dossier et l'appeler uploads. Et puis nos objets d'environnement d'hôte web oeil que nous injectons ici nous donnera en fait un accès facile à construire notre route vers notre dossier de téléchargements ou l'accès aux contextes HTTP afin que, comme vous le savez, nous donne accès à quelques détails de requête sur un seul - , les détails que nous voulons concerne le serveur actuel ou la valeur de l'hôte actuel, sorte que nous construisons réellement une URL, qui est ce que nous allons stocker dans la base de données. Donc, nous allons descendre à la Crée. Très bien, et juste enlever mon point d'arrêt là. Et nous savons déjà que nous faisons notre gestion globale des erreurs de ce côté de l'API. Donc nous n'avons pas à nous soucier d'essayer et d'attraper s'il y a une erreur en cours de route, ça va jeter les 500 et nous pouvons avancer. Mais ce que nous voulons accomplir ici est la construction de l'URL que le RI, disons la reconstruction du fichier. Parce que tu te souviens que c'est un tableau d'octets, non ? Non, ou ça va être une mauvaise zone quand il vient du client via l'API, ainsi de suite pour le reconstruire à partir d'un tableau d'octets dans une image physique dans notre dossier de téléchargements. Alors allons y entrer. Donc, d'abord, alors je vais avoir est l'URL var, et cela va être des contextes HTTP égaux accessor pas la requête de point de contexte HGTV, valeur de point d'hôte point. Donc, je vais appeler cette URL, pourrait l'appeler hôte actuel, URL actuelle. Mais finalement, juste parler du, vous savez, comme quand nous l'exécutons à partir de Visual Studio va être deux-points hôte local. Ce port lorsque nous le déployons sur Internet, sera quel que soit le nom de domaine. Donc c'est tout ce que ça va vraiment récupérer. Ensuite, nous voulons construire notre chemin. Et comme je l'ai dit, ou le chemin viendra du chemin racine Web de l'environnement hôte Web, ce qui nous donne juste un chemin direct à la racine WW. Et puis nous avons notre dossier de téléchargements. Et puis nous allons juste injecter dans le nom de l'image de point du véhicule, qui devrait bien sûr être transmis avec toutes les informations dans l'objet VGG à un moment de la création. Maintenant, nous allons entrer dans les bonnes choses où nous créons réellement le fichier. Nous allons donc utiliser notre flux de fichiers pour le faire. Donc, nous avons le flux de fichiers VAR est égal au système dot o point de fichier créer. Et puis ce que nous créons est quelle que soit l'image ou le chemin que nous avons construit ici, nous passons juste la fin. Ensuite, notre flux de fichiers, nous allons lui dire d'écrire l'image de point de véhicule. Maintenant, rappelez-vous encore une fois, l'image est notre zone de morsure, donc ce sont nos données. Donc, nous voyons à droite, ces données commençant à 0 et De 0 à toute la longueur du tableau. Donc conceptuellement, donc en voyant un fichier d'annulation, ce bec, peu près exact, si vous passez juste au-dessus, vous verrez écrire un bloc d'octets dans le flux de fichiers. Donc n'importe quel type de fichier, c'est vrai. Il ne se limite pas aux images, étaient juste faire des images ici, mais n'importe quel type de fichier, nous sommes juste l'écrire dans le système de fichiers. Et puis nous fermons ce flux une fois que nous aurons fini. Et puis ce que nous allons faire est de changer le nom de l'image au niveau de l'objet. Donc nous avons déjà le nom et nous l'utilisons pour le chemin. Bon, cependant, notre nouveau nom, le nom l'image de point de véhicule va être égal à https deux-points slash slash notre URL, n'est-ce pas ? Ou vous pouvez l'appeler la valeur de l'hôte actuel ou de l'hôte, quel que soit le nom que vous voulez. Mais c'est là que notre adresse à peu près barre oblique, uploads barre oblique, puis l'origine sur la messagerie instantanée qui est passée par l'API. C' est donc ce qui sera stocké dans la base de données. Et puis nous allons de l'avant et faisons l'insert régulier et Enregistrer. Très bien, donc je vais juste mettre un peu d'espace là qui crée le fichier côté API ou côté serveur. Bon, alors passons à notre composant de formulaire pour nos véhicules. Donc, je vais mettre dans un nouveau groupe de formulaire tel probablement juste le met au sommet. Et je dirai que celle-ci est pour une image optionnelle, non ? Donc l'image d'étiquette facultative. Et puis ce qu'on va faire, c'est avoir un fichier d'entrée, une langue. D' accord, donc vous avez vu les différents types d'entrées. On a fait ça. On a fait le nombre, on a pris. Donc nulle part faire le fichier d'entrée. Et puis inchangé, nous allons faire un fichier de handle et un gestionnaire d'événements Exxon. D' accord. Je vais aussi mettre dans un peta acétal là avec un petit avertissement, télécharger un avertissement de fichier. Pour qu'il puisse aller de l'avant et faire ça. Et puis nous allons faire les initialisations ci-dessous. Donc le premier qui est, je vais initialiser l'avertissement. Maintenant, cela l'initialise. Tu n'as pas besoin de changer quoi que ce soit, hein ? Non. Il ne le définira que si le besoin de l'avertissement se pose juste en dessous de ce cygne, nous allons avoir notre téléphone privé vide Shun pour gérer les téléchargements, désolé, la sélection de fichiers. Donc j'ai une poignée privée vide rapide et comme Sean. Et puis nous avons comme paramètre l'événement de changement de fichier d'entrée R, puis R Tolkien, que nous appelons juste e. Très bien, donc nous saurions tout ou les événements fonctionnent jusqu'à présent, nous avons seulement fait en direct sur soumission valide. Et maintenant, nous sommes à la recherche d'un événement personnalisé qui est 45 sélection. Ainsi, chaque fois qu'un fichier est sélectionné, il le déclenchera automatiquement. Et c'est le type de données que nous allons stocker tous les détails nécessaires sur l'événement qui se produit, pas vrai. Un cas en point va avoir une variable de fichier. Je vais dire que le fichier var est égal à point E. Je voulais regarder E. On voit qu'on a des fichiers, des cônes. On va avoir plusieurs fichiers ? Donc, si nous permettions à l'utilisateur de télécharger plusieurs fichiers, vous pourriez simplement les obtenir une fois comme un tableau ou une collection juste ici nous sommes. On n'en demande qu'une. Donc le fichier E dot. Mais alors nous devons nous assurer que ce fichier a réellement du contenu, n'est-ce pas ? Donc ou parce que rappelez-vous que si la clinique, même si elle ne sélectionne rien, cet événement aurait été déclenché. Droit. Donc, nous essayons d'entrer dans le fichier, mais nous devons toujours nous assurer que quelque chose a été sélectionné et ensuite nous pouvons commencer notre processus. D' accord. Aucun remplissage automatique a été abondance de prudence. Vous voulez vérifier notre extension sur le fichier. Donc, je vais dire var EXT, qui est court pour l'extension. Et puis je vais juste faire un System.out.println. Accédez à l'extension sur le point de fichier Nim. Très bien, donc cet objet de fichier a tout ce que nous devons savoir sur les États-Unis en ce moment avec le type de contenu, nous avons le dernier modifié le nom, la taille de tout ce dont nous avons besoin. D' accord, au fait, ce type de données de fichier s'appelle sourcils notre fichier. Donc, c'est le type de données et qui est disponible pour le téléchargement de fichiers dans blazer, sourcils ou fichier. Ensuite, nous allons mettre dans une instruction if pour vérifier les extensions de fichier que nous traitons pour elle. Donc, dans cette situation, nous ne voulons que JPG, JPG et PNG. Bien sûr, en fonction de votre situation, vous pouvez vouloir plus ou vous pouvez avoir des restrictions différentes. Mais une fois de plus, il s'agit de connaissances transférables et de concepts transférables. Donc ici, je vérifie juste si l'extension que nous venons de glaner à partir du nom de fichier est si elle contient l'un de nos acceptés, mais je la mets à plus bas parce que parfois les fichiers sont enregistrés avec toutes les majuscules sont des majuscules mixtes comme le extension. Donc, vous savez, juste pour garder tout sur un niveau où le forcer à minuscules et comparer avec l'équivalent minuscule. Ensuite, dans cette déclaration if, si on nous donne l'un des types de fichiers que nous recherchons, alors je veux créer une toute nouvelle valeur pour le pic, ce que j'appelle un ID de pic, mais c'est vraiment que cela sera donné à la photo. Non. Mon scénario ou ma raison de le faire est, je ne sais pas quel nom amusant cet utilisateur pourrait avoir pour l'un de ces fichiers, non ? Je ne veux pas risquer d'avoir un conflit entre deux fichiers avec le même nom de fichier non plus. Donc, ce que je fais est de générer en utilisant la bibliothèque de grille, bons points, nouveau bon à une chaîne. Et ce qui se passe, c'est qu'un bon vous donne comme une chaîne de 16 caractères. Et certains de ces blocs de caractères sont séparés par des traits d'union. Je remplace juste tous les traits d'union par un texte vide. Donc, à la fin, vous obtenez juste un gros blob de caractères apparemment aléatoires. Si vous n'êtes pas familier avec ce qu'il est, c'est ce qu'on vous racontera. Et puis nous voyons le nom de l'image de point de véhicule est. Ils fusionnaient ce volume vide avec l'extension. Donc, c'est ce que nous voulons appeler le fichier sur le système de fichiers. Ensuite, je vais initialiser une image de point de véhicule, qui est notre militaire à un nouveau par RE étant donné la taille file.js. Donc nous avons le fichier maintenant, donc nous avons juste initialiser une batterie, c'est la taille du lot d'automne. Et puis nous allons attendre le fichier pas ouvert flux, point lire un évier, puis l'image de point de véhicule, et c'est une scène, donc c'est pourquoi il y a une ligne. Donc je vais juste faire de ça un évier vide. D' accord, et ça devrait prendre soin de cette époque. On y va. Très bien, Donc, cela va essentiellement juste dire Fichier Ouvrir et copier ou contenu dans notre tableau d'octets, qui est l'image point de véhicule. Maintenant, c'est si nous obtenons les choses que nous voulons. Sinon, je vais juste donner un avertissement Upload File. Donc, un peu de contenu à voir. Veuillez sélectionner un fichier image valide et leur indiquer les extensions. Je ne vais pas mettre JPEG. Tu pourrais si tu le voulais, mais je pense que c'est assez clair. En fait, si nous obtenons le fichier du panier, je veux juste m'assurer que si l'erreur était là avant, que c'était toujours le cas. Donc, je vais juste initialiser ceci ou définir la valeur de téléchargement d' avertissement de fichier détruire pas vide si on nous donne le panier. Donc, si c'est MDRD et qu'il va toujours être vide. Si vous tapez du contenu et que nous avons le bon, alors il sera vide. Non, donc c'est bon. Bon, donc prenons cette application pour une rotation de charge artificielle. La majorité du formulaire. Je vais juste aller de l'avant et sélectionner une de mes images ici, puis créer le véhicule. Et puis nous voyons que nous avons le nouveau véhicule, mais nous n'avons aucun moyen d'afficher ce véhicule, n'est-ce pas ? Non. Donc, ce serait bien si nous voyions l'image juste ici sur la page d'index pour montrer quel véhicule il est. Donc, nous allons sauter sur la page d'index et a fait la modification suivante vont vider nouvel en-tête dans cette table. Non, je n'ai pas besoin de mettre l'image. Je ne vais pas mettre de texte dans l'en-tête, mais nous allons avoir cette nouvelle colonne, cette nouvelle td qui va juste avoir IMG SRC être égal au nom de l'image point du véhicule. Alors rappelez-vous que le nom de l'image est le chemin sur le serveur où l'image peut être téléphone. Donc on voit juste votre source. Est-ce que cette URL à peu près que nous aurions construit à partir du côté de l'API. Et puis je mets juste dans un style personnalisé pour dire que la hauteur et la largeur sont de 150 pixels. Donc je vais juste enregistrer ça et prendre, et quand nous rechargeons notre page, nous voyons notre image apparaître. D' accord, donc encore une fois, c'est juste l'incorporation. Laissez-moi faire un élément d'inspection et vous voyez que c'est l'URL https hôte local. Donc, c'est ce que nous avons obtenu à travers le contexte, accéder à son désolé, la valeur de l'hôte, puis le dossier de téléchargements et puis ce nom de fichier image. Alors essayons d'en ajouter un sans l'image. Donc, Toyota visite, je vais juste mettre quelques valeurs factices pour passer à travers cela rapidement. Et puis nous allons de l'avant et cliquez sur Créer un véhicule. Et d'accord, donc quelque chose d'intéressant vient de se passer. Un. n'y a pas de création. Il y avait donc une erreur aussi. On a vu ces 500 pages s'allumer et ensuite s'enfuir. Donc quelque chose est certainement 0. Revenons donc au contrôleur et nous allons devoir apporter quelques modifications ici. Donc, le fait est que notre code ici suppose qu'une image sera présente. Donc je pense que c'est, ça me donne une erreur à ce stade parce qu'alors ça voit, non ? Rien parce que ce serait nul à ce stade si aucune image n'était sélectionnée pendant le processus de téléchargement de fichier. Bon, donc ce que nous voulons faire alors est peut-être envelopper ceci dans une déclaration if que nous essayons de faire tout cela lorsque l'image ou la longueur du tableau d'octets est supérieure à Z. Si la longueur du point de l'image du véhicule est supérieure à 0, alors allez-y et obtenez l'URL, obtenez le chemin, et faites toutes ces choses fantaisie avant de tenter d'enregistrer. Donc, cela signifie que si aucune image GameOver, alors il fonctionnera comme normal. Donc, cette étape est importante parce que nous voulons également prendre cela en considération lorsque quelqu'un met à jour le véhicule, il peut avoir lancé l'opération de mise à jour et changé l'image ou non, n'est-ce pas ? Alors quand savons-nous quand deux gènes. Donc, cette déclaration si pourrait réellement être réutilisée ici. Si ce tableau d'octets a des données, alors il est une hypothèse sûre qu'une nouvelle image est présente. Nous devons reconstruire le chemin du fichier basé sur le nouveau nom qui a été donné à ce nouveau pour télécharger ce fichier, aller de l'avant et mettre à jour les champs de données. Et finalement, nous mettons à jour le véhicule. Ensuite, vous remarquez que toutes ces lignes de code se répètent en quelque sorte. Donc, ce serait bien si nous créions une forme de fonction ce genre de ceux tout ce levage lourd et probablement retourne juste ce chemin d'image. Donc je vais juste prendre toutes ces lignes et je vais créer une autre fonction privée, ne le fais pas. Donc, cette fonction, je viens de le faire pour que vous puissiez toujours juste faire une pause et répliquer ce que je vais vous guider à travers quand même, chaîne privée, je l'appelle créer un chemin de fichier. J' aurais pu l'appeler créer un fichier. Cela dépend chose probablement créer un fichier est un peu TR description est-ce qu'il crée le fichier. Et puis ce que nous allons faire possible alors que le tableau d'octets de l'image et le nom de la chaîne, non ? Donc, je viens de copier et de coller le code. C' est pourquoi nous avons ces flèches de référence. Donc on va juste échanger ces vieux. Donc, au lieu du véhicule, le nom de l'image, je vais juste dire le nom. Au lieu de l'image de point de véhicule, je passe l'image. Et puis ce serait aussi l'image. D' accord ? Et puis à la fin de cela, je vais juste retourner cette URL construite https barre oblique les URL téléchargées, puis nous passons le nom buck. D' accord. Donc, ce que nous pouvons faire est que nous allons voir si la longueur de l'image est supérieure à 0, alors le nom de l'image va être un appel à cette fonction. Donc, nous l'appelons Créer un fichier. Et nous passons en véhicule. Des points. Et le premier est le tableau d'octets, donc l'image, puis le nom de l'image de point de véhicule. D' accord, donc de cette façon, nous n'avons pas à répéter trop de lignes de code est juste une simple instruction if et 19. Donc je pense que c'est beaucoup plus, c'est beaucoup plus propre et c'est plus réutilisable dans ce format. Si nous avons une image que l' appel de fonction met à jour ce champ au moment où il revient ici, nous savons que le fichier aurait déjà été créé et ensuite aller de l'avant et mettre à jour. D' accord. C'est donc une question traitée, non ? C' est ce qui jetait l'époque où il n'y avait pas d'image fournie par une erreur ? Non. L' autre problème est que nous avons notre intercepteur qui signifie jumbo, ce qui est qu'il crée augmenter. Très bien, donc c'est une création pour les véhicules. Et rappelez-vous que nous avions configuré nos intercepteurs pour surveiller toutes les activités. Donc, en fait, avoir une réponse ici. Si votre code ne ressemble pas à ça, c'est bon. Ça ne devrait pas être là. Mais nous avons cet intercepteur pour surveiller l'ancienne colonne de cette opération et ensuite prendre une certaine mesure. Donc, nous avons vu l'axone parce que vous avez vu le texte rouge flush sur l'écran, mais ensuite il a toujours navigué vers la page d'index. Et c'est ce que nous ne voulons pas forcément, non ? Donc, nous devons faire un petit courage ici, où pendant les tests, pendant la mise en œuvre, j'aurais jeté une exception à la fin de cette déclaration switch que j'ai plus tard. Donc nous allons devoir le remettre parce que ce qui s' est passé , c'est qu'il a frappé cette déclaration if. Bien sûr, si vous avez une flèche, ça veut dire que nous avons probablement FIFO 100 beaucoup. Un de ce qui précède, nous savons que ce n'est pas un 40 pour parce qu'il est allé à la ressource. Nous savons que ce n'est pas non autorisé. Donc ça veut dire que ça a dû être un 500 et ensuite il devrait avoir un outil os, la page 500, mais ensuite c'est des os là et ensuite navigué ici. Nous avons donc besoin d'un moyen d'arrêter l'exécution de l'application après cela se produit. Et cette façon sûre serait de jeter la nouvelle exception. Donc, je vais lancer une exception de requête HTTP. Donc, c'est une exception de requête HTTP juste, il va juste avoir le message dedans. Juste pour voir que c'est probablement ce qui a mal tourné. Et donc cela arrêtera l'exécution après avoir navigué vers cette page. Alors ça n'irait pas si loin. D' accord. Essayons encore une fois. D' accord. Donc, nous sommes de retour sur la page des véhicules créer un nouveau véhicule. Et je ne vais pas choisir une image et ensuite je vais aller de l'avant et créer un véhicule. Et ainsi eu cette erreur. Excusez-moi, cela devrait être de vérifier si ce n'est pas égal à null. Bon, donc je ne devrais pas prendre la longueur parce que si rien n'est fourni, alors ça sera nul. Donc c'est mon erreur. Faisons juste cet ajustement afin que l'image de point du véhicule ne soit pas égale à null. Ensuite, allez-y et essayez de faire le véhicule de création. Bon, alors essayons ça. Bon, donc nous sommes de retour dans l'écran de création de nouveaux véhicules. Nous ne choisissons pas une image. Et puis nous allons aller de l'avant et créer un véhicule. Donc maintenant que nous avons fait cela, nous voyons qu'il va dans la tête, le crée, il avec succès, et il n'y a pas d'image. D' accord, ce qu'on va faire, c'est juste pour s' assurer que notre interception fonctionne parce qu'on a fait ça réparé. Je veux juste le vérifier. Donc, au début de cela crée, non ? Je pense que nous ferions ce test où j'ai jeté une exception au début, mais ensuite c'était en obtenir une liste. Donc, il n'y avait pas de code réel pour naviguer n'importe où par la suite. Donc, c'est pourquoi j'aurais quitté l'activité sans aucun drapeau rouge, mais normalement juste jeter une exception en haut du VBR post. Vous n'avez pas nécessairement à faire cette étape. Vous pouvez simplement suivre. Je voulais juste vérifier que ou la modification où une fois de plus remplir ou formulaire avec des données factice, puis je clique sur Créer un véhicule. Et puis nous voyons que nous atterrissons sur nos 500 sans être navigués. C' est donc le comportement attendu de cet intercepteur et la façon dont il navigue. D' accord, donc nous avons ajusté ça et ce n'est que les parties du processus. Et parfois, vous allez regarder quelque chose, puis plus tard, vous trouvez une erreur. Mais c'est toujours bon d'attraper ces choses tôt. C' est bien que, où, vous savez, passer par cette activité et puis nous voyons un chink dans l'armure et ajusté en fonction. D' accord, donc une vérification de plus et c'est tester la fonctionnalité de mise à jour, n'est-ce pas ? Donc ds1 pour aller de l'avant et mettre à jour l'image pour la Prius. Et je vais juste choisir les belles routes bleues qu'elles sont. Cliquez sur Mettre à jour et nous y allons. Donc, vous voyez créer des œuvres, mettre à jour des œuvres. Il n'y avait pas d'imaginal. Laisse-moi le faire encore une fois. Parce que vous savez, les images, le remblai pour un système, non, donc nous avons les quatre images affichées. Très bien, donc vous pouvez prendre ce concept et aller de l'avant et probablement amélioré par l'écran de vue. Et encore une fois, ce concept est quelque chose que vous pouvez appliquer à d'autres choses quand il s'agit de télécharger des fichiers. Un autre bon exemple, encore une fois, serait de demander des documents juridiques de la part des clients. Lors de la création, vous avez besoin d'une pièce d'identité, quels que soient les numéros d'identification fiscale fournis, vous avez besoin d'une pièce d'identité trop spécifique, n'est-ce pas ? Toujours voler à ça. Donc, vous pouvez aller de l'avant et expérimenter avec ça. Mais vous avez le cadre à suivre. 41. Repository HttpClient: Hé les gars, bienvenue. Dans cette leçon, nous voulions que ce cours mette en place un référentiel de requêtes HTTP. Et tout le contexte pour cela est qu'il y a quelques choses que nous voulons faire et que nous devons faire continuellement lorsque nous faisons notre client HTTP. Parce que je veux dire, cette ligne est tout simplement NADPH. Nous pesons les messages clients en tant que JSON, JSON asynchrone, obtenons les points de terminaison et nous passons l'objet, c'est assez simple. Mais alors que vos appels pourraient devenir un peu plus compliqués. Et dans cette situation, un niveau de complication que nous avons dû mettre cet intercepteur unidirectionnel à cet intercepteur directement dans chaque composant, dans le composant ou dans le code derrière. Et puis nous avons dû nous assurer que cette ligne était présente. Donc je suis sûr que c'était un peu ennuyeux. Et puis si vous en avez un autre, si l un autre composant ou ils vont devoir prendre cela en considération, ils doivent sortir de ceci et ensuite généralement en septa. Et si quelque chose change, tu as tout un tas de choses pour les guépards. Donc, bien sûr, c'est toujours bon quand nous mettons notre code que nous savons répété dans une forme plus utilisable, non ? Donc, en plus jusqu'à ce que l'intercepteur battant le client HTTP est injecté directement dans chaque composant. Et puis nous avons ces appels de fonction. Et puis si nous avons des informations supplémentaires ou des frappeurs que nous avons besoin de mettre sur eux aurait tous ces composants et modifier une fois de plus. Donc, ce que nous allons faire est de mettre en place des référentiels génériques. Donc, vous auriez vu la puissance d'avoir des trucs génériques déjà à partir de quand nous avons fait notre unité de force pour former l'API a dit, droite, nous avons dit le dépôt générique pauvre et nos unités de dépôt de travail. Donc, du côté client, nous allons configurer notre référentiel client HTTP. D' accord, âme. Ce que je vais faire est de créer un nouveau dossier dans le projet client. Et on va appeler ce nouveau dossier, et je vais l'appeler contrats, non ? Parce que de façon générale, vous avez des contrats et vous avez des services juste ici, nous appelons cela les conventions de dénomination de dépôt et de dépôt de fer. Mais c'est essentiellement le même concept l' interface qui dit que c'est ce que je peux faire. Et puis nous avons la mise en œuvre qui le fait. Nous savons donc que nous avons essayé d'injecter le contrat dans nos applications comme nous l'avons fait avec l'unité de travail I plutôt que l'unité de travail. Bon, donc notre contrat va être une nouvelle classe. Ce que je crée juste un cours d'art. Bien sûr que vous voulez changer ça. Je l'appelle juste référentiel HTTP. Nous allons de l'avant et ajoutons cela, puis nous le changeons de l'interface de classe. D' accord ? Et puis ce dépôt va prendre un paramètre générique de t. Nous l'appelons juste t, où t est une classe. Cette chape sûre ou la classe du côlon T. D' accord, donc nous sommes en mesure d'accommoder les différents types. Encore une fois, générique. Donc, à l'intérieur de cette implémentation, nous allons avoir quelques méthodes. Obtenir, obtient qui renvoie une liste de t. Donc t est encore une fois l'objet que nous demandons ou le type de données que nous demandons. Alors, passez à travers les virages. On obtient que renvoie une liste et nous pourrions probablement qualifier cela un peu plus pour dire obtenir tous sont la liste ou quelque chose, je vais juste laisser je reçois tous les quatre sont nulles. Mais tâche qui va créer, qui prend l'URL et l'objet à créer. Nous avons tâche les mises à jour qui jours l'URL, l'objet, et l'ID. Et nous avons défenses supprimer, qui prend juste l'URL et l'ID. C' est tout pour notre contrat. Je référentiel HTTP sais dans nos services sont ces raisons le dossier de services que je vais ajouter sur kras et nous allons l'appeler référentiel HTTP. Maintenant, dépôt http, nous aurons ce générique ou paramètre. Et il héritera du dépôt HTTP, qui a également ce paramètre générique. Et puis nous le qualifions là où t est une classe. Et puis nous allons de l'avant et incluons les espaces de noms manquants. Et puis nous devons faire cette implémentation de l'interface. Donc maintenant, nous avons créé notre méthode et sommes prêts pour, vous savez, s'étoffer. Donc, je vais devoir injecter au moins le client HTTP. Et bien sûr, nous savons que nous avons l'intercepteur que nous voulons présent dans chaque appel. Bon, donc je vais faire un constructeur. Et dans ce constructeur, je vais avoir le client HTTP et ou le service d'intercepteur http. Donc, je vais juste aller de l'avant et inclure toutes les références manquantes, puis nous initialisons juste les champs. J' ai donc copié et collé les noms des champs avec le sur les partitions. Laisse-moi juste échanger ces avoine. Nous sommes prêts à affiner ce qui se passe sur une création. Regardons en arrière ce que nous avons fait quand nous créons. Donc, quand nous avons dit créer micro, serait Wanda intercepteur, et puis nous ferions cet appel qui prend ce point de terminaison, le point de terminaison approprié et l'objet pour la création. Donc je vais juste copier que je ne suis pas allé au tribunal. Eh bien, je vais juste copier. D' accord. Et puis allez-y et incluez les références manquantes. Donc méthode MC un évier. Et nous devons également inclure, eh bien, nous n'avons pas besoin d'inclure les points de terminaison. La raison signifie que nous sommes censés fournir l'URL. Donc, je ne sais pas quel est le type d'objet. Je ne sais pas quelle est l'URL ici. C' était étroitement couplé parce que vous saviez que vous étiez sur le coup. Donc, nous savions passer au-dessus de cet objet et de cet objet. Donc, ici, nous ne savons pas quelle sera l'URL. Donc, je ne peux pas utiliser cette valeur dure car elle provient de ces composants spécifiques. Je vais juste prendre l'URL qui est transmise lorsque cette méthode est appelée. Et je ne sais pas quel est l'objet. Bullets, je vais juste passer à l'OBJ et c'est tout, non ? Pour la suppression. Que se passe-t-il quand on le fait ? Je vais juste sauter sur l'un de ces composants d'index. Et vous pouvez voir ici que je n'ai même pas utilisé l'intercepteur ici. Bon, donc c'est une de ces choses. Donc nous voulons intercepter sont présents tout le temps. Mais bien sûr, c'était fastidieux de le répéter, mais je vais juste emprunter cette ligne de code qui est pertinente, donc, le Supprimer, nous allons commencer par notre intercepteur sur le troisième événement, non ? Et cette méthode Async. Et puis nous allons juste voir l'URL et l'ID. Encore une fois, ce n'est pas spécifique, donc vous devez garder le même format. Donc, l'ID de barre oblique d'URL , d' accord, pour les gets, et je suis sûr que vous obtenez l'idée par non, cet intercepteur doit être utilisé dans toutes les méthodes. Parce que, bien sûr, nous voulons surveiller ce qui se passe, non ? Et puis nous allons juste mettre les appels appropriés en fonction de ce que nous aurions fait dans le composant correspondant. D' accord, donc je suis allé de l'avant et j'ai rempli toutes les méthodes restantes. Donc, pour obtenir, nous avons le terme d'interception et ensuite nous retournons notre client de pondération de JSON async, vous devrez peut-être inclure une bibliothèque manquante, par exemple, celle-ci. Mais nous incluons cela et nous allons de l'avant. Nous avons le paramètre type de type T parce qu'une fois de plus, nous ne savons pas ce que nous obtenons. Et puis nous voyons l'URL slash l'id 4 obtient tout le concept similaire sauf que nous retournons une liste et cela devrait probablement être plus comme Alice parce que nous avons vu I list dans la requête, juste, donc je vais juste revenir et c'est très bien. Et l'URL, d'accord. Et puis pour la mise à jour de la tâche, nous allons voir, mettre JSON une stratégie de synchronisation, RL écraser l'ID et notre objet. Une autre chose que nous devrions probablement envisager ou nous devrons faire est de disposer, n'est-ce pas ? Donc nous voulions juste nous assurer que nous conserverons cette force. Il y a donc une interface que nous pouvons inclure jetable. Et puis nous pouvons avoir plusieurs héritages de plusieurs interfaces en C. Sharp. Et puis cela implémente la méthode d'élimination juste ici. D' autres plus éditer avec notre code où nous disons dans les événements de disposition point intercepteur. D' accord, alors ensuite, nous devons aller à notre fichier program.cs et enregistrer notre dépôt HTTP. Donc c'est tout ce qu'on va faire. Les services de point Builder sont transitoires, puis nous allons dire typeof, puis passer le nom de notre contrat, le référentiel HTTP oeil, puis les crochets de type. Donc, parce que c'est générique, l'implémentation ou l'enregistrement semble légèrement différente de ce que nous aurions pu voir avec l'unité de travail ou de distribution. Laisse-moi juste apporter ça rapidement. Donc quand on a fait l'unité de travail, c'est à ça que ça ressemblait avec le fait que je suis transitoire, non ? Nous avons donc les parenthèses, ce type de ce genre dans cette situation cependant. Nous allons voir accolade ouverte, typeof I HTTP ou poster avec les crochets type virgule du dépôt HTTP avec des fusées. Notez qu'une fois de plus, c'est générique. Nous pourrions obtenir des implémentations spécifiques et en fait avoir comme des référentiels spécifiques que Collie spécifique, désolé que je tourne. Voir dans une couleur spécifique, mais qui directement mappé aux types de données que nous utilisons. Il pourrait donc avoir le référentiel de réservations, le référentiel de couleurs. Et bien sûr, cela nous donne la possibilité d'étendre la fonctionnalité directement pour le type particulier ou différentes opérations. Peut-être que les réservations pourraient avoir besoin d'autre chose que les autres n'ont pas. Donc, le modèle générique pourrait ne pas nécessairement fonctionner. Donc, à ce stade encore une chose à propos d'avoir plus de dépôts, mais pour l'instant nous faisons de simples foules de, donc je vais juste avoir le dépôt générique simple que tout le monde peut utiliser et apprécier et remarquer où je le mets. J' essaie de le mettre après l'enregistrement du client HTTP et du truc de l'intercepteur. Bon, alors maintenant que nous avons tout ça, nous pouvons revenir à nos composants. Et je vais commencer par, nous commençons toujours par le simple. Alors faisons les couleurs, n'est-ce pas ? Donc, dans les loteries de création ou le fichier, nous aurions injecté l'intercepteur ainsi que le client. Sachez ce que je vais faire est d'injecter le référentiel HTTP. Et ce que nous devrons faire ici, c'est soit nous avions l'instruction using directement au composant, soit nous savons que nous pouvons simplement ajouter une instruction using aux importations de vue afin que tout le monde l'ait. D' accord, donc c'est quelque chose qu'on peut considérer. Mais je vais juste pousser de l'avant avec les couleurs et ce vieux. Donc, parce que c'est générique, nous devons spécifier la classe de données, donc je vais devoir voir la couleur. D' accord ? Et puis d'autres le laissent en tant que clients. Donc, cela signifie, ok, Donc, cela est injecté et puis le client n'a plus posé comme point JSON un évier. Non. Le client aura un appel de fonction pour créer. Et les deux paramètres seront le point de terminaison et la couleur à créer. Je peux supprimer l'intercepteur et laissez-moi juste commenter le mode pour un non. Et puis prenons ces cavaliers. Donc, nous allons essayer de créer une nouvelle couleur et ensuite voir comment tout se lie. Bon, alors allons-y. Apportez les couleurs de la maison, créez une nouvelle couleur. Et puis je vais mettre dans ce qui est une autre Caracalla commune ? Mettons en vert. Et puis nous créons de la couleur, et nous y allons. Donc, notre client HTTP se déclenche toujours même si nous ne sommes pas dirigés l'appeler. Et nous avons notre dépôt savoir. Donc nous avons moins d'injections, moins de points de contact et moins d'entretien dans l'ensemble si quelque chose change, n'est-ce pas ? Donc maintenant je peux juste supprimer ces références de débiteur, supprimer ça, je dispose de l'héritage et supprimer cette injection de l'intercepteur. Et puis vous pouvez voir que notre code de composant semble un peu plus propre. Donc, c'est un joli petit modèle que vous pouvez toujours penser. Tu sais, chaque fois que tu fais quelque chose encore et encore et encore et que tu répètes le code et que tu commences à y ajouter. Et puis vous avez plusieurs points de contact, alors vous pouvez commencer à penser à comment pouvez-vous obstruer ces bits lourds loin d'un composant ou d'une méthode ou de n'importe quelle classe en général, et le mettre dans une classe pour lui-même et le réutiliser. Donc, vous pouvez aller de l'avant et mettre en œuvre cela. Ensuite, je vous défie juste de passer par et refactoriser et de mettre à jour toutes vos références qui auraient pointé directement vers le client HTTP et l'intercepteur à savoir pointe vers le référentiel approprié pour cela composant. Donc, quand j'ai dit le référentiel approprié, eh bien, celui-ci, mais bien sûr, la classe Data doit être la bonne, non ? Bien sûr, nous avons déjà les points de terminaison passés et les objets. Donc, si vous utilisez le mauvais, alors vous obtiendrez une erreur. Jetons un coup d'oeil aux micros. Si je fais cela sembler ajustement au mix, je vais remplacer le client par ce dépôt. Inclure une référence. Ensuite, je dis couleur et puis ici je vois que cela devrait être créé. Ensuite, je vais finir avec une flèche parce que je transmets le mauvais type de données selon ça, n'est-ce pas ? Donc, vous savez que la Confédération, si juste pour s'assurer que j'ajoute des types de données sont toujours corrects. Et puis vous pouvez simplement aller de l'avant et supprimer les références à l'intercepteur et les références jetables. Et puis vous pouvez simplement le faire à tous les autres composants en conséquence. 42. MISE à JOUR : Suppression des cordes de magiques cordes de ficaux: Bon, bienvenue aux développeurs de blizzard. Dans cette leçon, nous allons chercher à réduire nos cordes magiques et toute cette opération n'est pas unique pour déclencher un développement. C' est juste une bonne pratique en général. Et nous allons juste discuter d'un, quelles cordes magiques sont sur la raison pour laquelle nous devons les réduire. Donc, à partir de ce que notre chaîne magique est, une chaîne magique est toute chaîne qui est à peu près codée en dur et elle s'aggrave quand elle est répétée autour de l'endroit. Donc, un exemple pratique de l' endroit où nous aurions utilisé des chaînes magiques serait comme dans notre contrôleur de réservations pour notre API. Non, ce sont beaucoup d'extrêmes. Les dangers de l'utilisation de ces chaînes magiques seraient que si je change le nom de la table du véhicule demain, il n'y aura aucune indication par l'IDE que l' environnement de développement que quelque chose a changé sur ce peut ne plus être pertinent ou panier. Donc, quand j'ai cette chaîne magique codée en dur et que je vois véhicule et client. Et puis peut-être que j'ai changé le nom de la table du client parce que rappelez-vous ceux-ci sont joints qui doivent être inclus avec les réservations. Donc, cela signifie qu'il doit y avoir une table correspondante avec ce nom, sorte que le nom change, alors le code ne lancera pas d'erreur. Et nous ne saurons pas jusqu'à ce que les clients se plaignent que Hey, j'ai cliqué sur ce bouton et ça n'a pas fonctionné à ce moment-là. Ce n'est déjà pas une bonne impression. Bon, donc on va voir comment on peut changer ces cordes magiques d'avoine. Et nous allons commencer par nos unités de travail. D' accord, donc la première façon d'obtenir le nôtre cela correspondra problème extrême serait dans la liste des inclusions au lieu du codage en dur, le mot véhicule, codage en dur, le mot client, je pouvais vraiment voir le nom off et puis mettre dans le nom de la classe que je souhaite inclure qui serait véhicule. Donc, cela rendrait effectivement une représentation de chaîne du mot véhicule, ce qui est parfaitement légal sous la forme des Includes, qui attend une liste de chaînes. Donc, cela signifie que si quelque chose change sur la classe de véhicule, peut-être que le nom de celui-ci a changé ou quelque chose comme ça, alors cela va certainement jeter une erreur parce qu'il n'y aurait plus de classe par le nom de véhicule. Cependant, c'est une bonne solution, mais elle ne corrige pas nécessairement l'ensemble du scénario, moins par rapport à notre besoin d'inclure des propriétés supplémentaires. Parce que si dans la classe de domaine de réservations, si je change réellement le nom de la propriété du véhicule pour sauver les coups sont voiture ou quelque chose comme ça, alors il n'y aurait toujours aucune indication à ce niveau qu'il n'y a plus longtemps une propriété de navigation à inclure par le nom du véhicule. Donc ce qu'on va faire, c'est changer le vieux mythos y compris. Donc, au lieu d'utiliser une liste de chaînes, nous allons utiliser un type de données différent appelé une IA interroyable. J' inclus une requête de bien, C'est, c'est tout à fait une bouche, mais ça va ressembler à notre ordonné, j'ai ordonné queryable. C' est en fait un type de données très similaire. Donc, je vais juste aller de l'avant et remplacer dans notre référentiel générique la liste des Incluts à savoir être. D' accord, on y arrivera. Il va avoir la même fonction de première partie, notre support d'angle de téléphone I interrogeable t, c'est la même chose sauf que la deuxième partie est que j'inclue un objet virgule t interrogeable. D' accord ? Et puis c'est vraiment juste la fonction. Donc, il retourne quelque chose comme une fonction. Et je dois inclure une autre bibliothèque de base dotnet. Donc c'est tout le problème. Et puis nous aurions remplacé ce coeur baromètre. Donc, c'est aussi avoir à faire cela à nouveau pour le Git. Donc, je vais juste aller à la get et en remplacer cela aussi. Maintenant, c'est dans l'interface, bien sûr, quoi que nous fassions, l'interface que nous devons faire dans l'implémentation. Donc, notre mise en œuvre n'est pas heureux en ce moment parce que nous avons changé quelque chose, mais pas pour vous inquiéter, nous allons bientôt se mettre à la vitesse jusqu'à présent notre GET, nous faisons la même chose. Je change cela à notre incroyable interrogeable, et je vais aller de l'avant et inclure les références manquantes. Alors la même chose pour le obtient tout. Je sais que nous avons fait que nous devons refactoriser un certain nombre de choses. Premièrement, notre méthode est sur toutes les autres méthodes qui appelaient ceci. J' utilise ce paramètre inclut. Très bien, donc non, à l'intérieur de notre implémentation sur la façon dont l'inclusion fonctionne null, c'est un mythe étrange. Donc, nous n'avons pas besoin d'aller pour chacun à travers chaque propriété et d'essayer de l'inclure. Au lieu de cela, ce que nous allons faire est juste de supprimer ceci pour chacun. Et puis nous disons que la requête n'est pas égale aux Includes, qui est une fois de plus une méthode. Et puis interroger. Très bien, tellement à peu près quand nous passons dans un objet qui va ressembler à une expression lambda, semblable à contenir les regards OrderBy et ainsi de suite. Mais quand on y arrivera, on y arrivera. Ce qui va se passer, c'est que si quelque chose est arrivé, dans le manteau supérieur, que nous connaissons déjà le concept de. Ensuite, la requête va aller de l'avant et exécuter qui inclut des parties de celui-ci contre lui-même. Et puis nous avons cette requête avec le permis inclus. Ce sont plutôt des données, non ? Donc, nous devons faire quelque chose de similaire dans nos gets tout où nous disons juste des requêtes égales à exécuter, qui inclut contre vous-même, s'il vous plaît. De la même façon avec le RW. Notez que l'ordre BY qui faisait la même chose. Eh bien, c'est ce que fait l'inclusif. D' accord, j'inclut la double interrogation. Maintenant que nous avons ça, je vais revenir à mon contrôleur de réservation. Et maintenant, nous voyons que tout ce que j'étais une sorte de chaos s'est rompu parce que nos paramètres d'inclusion ne sont plus la liste de chaîne. Donc, je peux juste enlever ça, non ? Nous savons que nous avons besoin de véhicules et de clients, donc je vais le faire avec celui-ci que nous n'avons pas encore modifié. Donc, pour le spiromètre inclus, nous allons passer l'expression. Donc je suis allé voir Q et une startup qui lambda, expression lambda. Et je peux maintenant voir inclure. On y va. Maintenant inclure peut venir, mais c'est ce que j'ai là-bas. Allez-y. Et si cela arrive avec une erreur que vous pouvez aller de l'avant et inclure les références manquantes sont. Donc, quand je dis inclure ici, je peux mettre une autre expression lambda à l'intérieur qui inclut l' expression, puis commencer à inclure les propriétés de navigation réelles de la classe de réservation afin que nous, nous savons où parler directement à la classe par opposition à Espérons troisième, en mettant une chaîne et en espérant qu'elle correspond à quelque chose dans cette classe. Bon, pour que je sache C, je veux inclure le véhicule. Et devinez quoi ? J' ai besoin d'inclure plus d'une chose afin que je puisse juste ci et cela le long et dire point inclure à nouveau. Donc, notez que j'ai inclus et puis inclure. droite. Donc, si vous en avez besoin pour inclure cette propriété et un enfant de cette propriété, alors vous pouvez voir include, dot puis include et vous continuez à descendre pour atteindre. Mais pour chaque fois que vous dites inclure, vous regardez directement la classe en question, au moins dans ce cas la réservation. Donc, vous ne regardez que les propriétés de réservation au fur et à mesure que vous allez. Donc j'ai besoin et j'ai besoin de client. D' accord. Permettez-moi de le diviser un peu en différentes lignes pour que nous puissions voir exactement ce qui se passe. Et voilà. Donc, tout est fortement tapé. Donc, si quelque chose change dans la table de réservation, il apportera certainement le code juste pour dire que nous allons changer le dépôt et tout le code est cassé. C' est bon quand il est cassé à ce stade parce que vous le réparez. Ensuite, vous pouvez aller de l'avant et publier votre application avec plus de confiance. Donc, je vais juste aller de l'avant et répliquer cette déclaration inclure haut ici parce que nous savons que c'est ce dont celui-ci a besoin. Aussi, supprimez cette liste et laissez-moi juste m' assurer de me débarrasser de toutes les flèches que j'ai écrites comprend deux fois les deux-points. Bon, donc c'est un problème résolu. D' accord, donc je vais juste faire une construction et voir où d'autre peut être brisé et notre liste d'erreurs, heureusement c'est court, non ? Non, mais nous pouvons voir ici serait un autre endroit où ces cordes magiques pourraient causer un problème. Bon, donc maintenant je peux juste voir les points inclus, et regarder ça. J' utilise le même code que j'ai utilisé pour les réservations et je reçois des erreurs. Pourquoi est-ce que je reçois des erreurs ? Eh bien, un, les propriétés de navigation pas à l'intérieur des véhicules. Donc, c'est mal. Le client est ce que le véhicule n'est pas dans les deux sens. Et bien, je n'inclurais pas le consentement de l'égalité. Donc, le problème avec cela une fois de plus était que si j'avais mis en nom ici, c'est un véhicule et il n'y aurait aucune indication que cela ne peut fonctionner tant que le programme ne se bloque pas. Donc, cela va réellement économiser beaucoup de temps dans le débogage et empêcher les livres de se produire à ce stade, non ? Donc maintenant je peux voir inclure le micro. Et puis je peux voir que inclure encore une fois. Et celui-ci serait modelé sur appel. Bon, donc maintenant nous avons tous les trois de ceux qui sont inclus, et je vais juste copier la ligne et l'utiliser ci-dessous, inclut également les deux-points et puis notre déclaration et puis je peux me débarrasser de ces listes. Très bien, donc en fin de compte, cela aide à nettoyer beaucoup de votre code, rendre plus pare-balles à mesure que vous allez le long et qu'il grandit. Maintenant, un autre domaine que je veux aborder, un flux magique qui pourrait causer des problèmes serait à l'intérieur de notre objet de réservation ou factice un objet où nous avons cette validation en cours. Bien que ici, je vois que c'est notre message et il doit être appliqué à cette propriété. Encore une fois, si ce nom de propriété a changé, eh bien, c'est trop une flèche. Mais si ce nom de propriété a changé, puis nous l'avons changé ici et nous l'avons changé là-bas. Nous pourrions facilement oublier de le changer parce que nous sommes probablement plus attirés par les lignes rouges que de chercher chaque heureux que nous avons dit le mot ou les mots datent. Donc, mon point serait une fois de plus, et nous pouvons dans ce cas utiliser la méthode originale que j'ai montrée où nous voyons le nom off et puis s'il vous plaît le nom de la propriété dans cela. Donc, cela rendra à une chaîne. Donc, si quelque chose change dans le nom de la propriété, cette ligne rouge nous alertera également. Ce sont donc de petits conseils de développement. Encore une fois, ce n'est pas spécifique à l'entreprise, il s' agit plus simplement de directives générales de développement pour vous assurer que vous construisez à l'épreuve des balles. Donc, les applications et qu'ils sont plus maintenables pour le long terme. 43. IMPORTANTE - Fix Delete Endpoint de Fix Delete: Hey les gars, j'ai juste un addendum rapide à la leçon précédente où nous aurions un peu refactorisé notre code et supprimer les chaînes magiques constantes comme elles sont appelées quand nous appelons nos points de terminaison, cependant, que des bits de refactoring et la façon dont je a écrit une sorte de problème introduit avec la suppression. Donc, qu'arrivera-t-il si vous écrivez le code comme je l'ai fait, vous finiriez quand vous supprimez cela, ce point de terminaison retournerait un 404. Et la raison en est que j'ai créé la chaîne statique de point de terminaison de mix avec cette barre oblique de fin. Et puis dans la construction de l'URL, toujours nous mettre barre oblique. Donc, cela signifierait que vous auriez une barre oblique API, barre oblique que l'ID. Et puis cela ferait en fait cesser de fonctionner si facilement. Vous pouvez corriger cela en supprimant peut-être cette barre oblique de fin sur l'API et sur la chaîne statique sous plutôt que vous pourriez simplement supprimer ces barres obliques de fin. Ainsi, lorsque vous construisez une nouvelle URL, vous pouvez mettre cette barre oblique. Ou si vous voulez laisser la neige fondante sur la chaîne statique et supprimer la barre oblique là. Mais je pense qu'il est plus difficile de voir ça marche ou vous savez exactement comment ça marche. Donc, je vais supprimer les slushes des points de terminaison de l'API. Et puis en formant l'URL elle-même, je vais mettre cette barre oblique là. 44. Soutien d'applications Web progressifs: Salut les gars, bienvenue. Nous sommes donc ici pour parler d'applications web progressives. Non, les applications web progressives sont PWA en bref. Il est persona fait référence aux applications Web qui utilisent des API de navigateur modernes et vous permettent de créer des ups Web téléchargeables. Alors laissez ce couler un peu. Donc, quand on dit des applications web téléchargeables, ces applications web, un peu comme l'orbitation est ici. Souviens-toi quand on le créait. Et je me suis assuré de souligner certaines options. Et l'un d'eux était des applications web progressives. Donc, il est venu avec certains fichiers qui prennent en charge les applications Web progressives, à savoir le service de travail et ces fichiers JS comme un JSON manifeste. Tous ces éléments sont en quelque sorte inclus parce que nous avons choisi l'application web progressive. Très bien, donc afin de télécharger cette application web et juste, juste le 0 que cela est disponible dans le navigateur basé sur chrome. Donc, comme vous pouvez le voir ici, j'utilise Microsoft Edge. J' ai utilisé Edge. Quoi ? Microsoft Edge au moins au moment de cet enregistrement, est basé sur le moteur Chromium de Google Chrome. Google Chrome est le pionnier pour cette technologie. L' opéra est également basé sur cette technologie. Pas tout à fait sûr de la prise en charge de Firefox pour les applications web progressives, au moins au moment de cette leçon. Mais nous pouvons utiliser le bord et faire une preuve de concept. Donc, pour télécharger cette application, tout ce que nous devons faire est de chercher ce petit bloc de construction en haut ici dans la barre d'adresse et de voir quand je survole, il est dit Gestion actuelle installée. C' est donc le nom de notre application que nous avons construite. Et je peux aller de l'avant et cliquer dessus. Donc, le fait est que cela est en fait comme une version modifiée d'un parc éolien qui a été fait dans le passé. Très bien, donc c'est en fait, c'est basé sur le Web, mais il y a certaines personnes qui aiment avoir les applications sur leur ordinateur. Ils voulaient parfois travailler en mode hors ligne. Et toutes ces choses peuvent être rendues possibles pour les applications Web grâce à cette technologie d'application Web progressive. Donc, quand je vais de l'avant et cliquez sur Installer en fait juste prendre quelques secondes et mettre cette application sur ma machine. Voici donc l'application sur ma machine. Et vous pouvez voir qu'il ne gagne plus dans le navigateur. Je peux toujours cliquer dessus. Allez à info. Je peux l'ouvrir dans le navigateur si je veux. Je peux désinstaller. Je peux même coûter un appareil multimédia, c'est sur ma machine. Très bien, et il y a l'icône dans la barre de menu Démarrer. Vous ne pouvez probablement pas le voir. Mais je passe en fait au-dessus de l'icône ici où je peux juste l'épingler à la barre des tâches. Il y a l'icône. D' accord, donc tous ces fichiers, le point manifeste JSON. Même quand je m'arrête, laissez-moi m'arrêter et laissez-moi passer à ces fichiers. Le JSON manifeste ici, je pourrais changer le nom de l'application et le nom court, toutes ces choses, la couleur a grandi des icônes. Il y a un certain nombre de choses que vous pouvez faire à partir de ces fichiers qui influencent ce qui est présenté lors du téléchargement. Donc, c'est cette icône, c'est de la cendre qui est apparue sur mon application l'ayant installée sur l'ordinateur. D' accord. Donc, si nous changeons cela pour peut-être le logo de l'entreprise ou ainsi de suite, tout de suite, quand il s'installe, c'est l'image qui sera affichée. Et une fois de plus, il peut faire tous les changements dans ces fichiers. Mais je voulais juste 0 que tout dur la boîte juste en sélectionnant quelques options supplémentaires. Lorsque nous étions en train de créer ce projet, nous l'avions indiqué, et nous avons eu si gracieusement la possibilité d' utiliser des applications web progressives avec notre blazer up. Donc maintenant, nous pouvons avoir une situation hybride où web un web up, ils peuvent facilement installer sur un appareil Windows, sur un, sur un, sur un Linux, sur un MAC, sur un iOS, sur un Android, ça ne fait vraiment pas grand-chose à la fois. Nous utilisons un navigateur moderne qui prend en charge cette technologie. 45. Ajouter des changements à GitHub: Hé les gars, bienvenue. Et nous sommes à un autre point de contrôle où nous allons juste vérifier notre quota GitHub. Mais avant de le faire, je veux passer en revue certains des principaux points de discussion des activités que nous avons menées ensemble et souligner certaines des mises en garde parce que je vous ai montré des trucs et ensuite je vous ai laissé finir c'est en haut. Je vous encourage à terminer tout de même, bien sûr, avoir mon cool de référence, mais juste au cas où vous rencontrez des difficultés en cours de route, je veux juste vous signaler certaines choses. Et c'est ce que nous allons faire avant d'aller de l'avant. Donc, pour récapituler certaines choses que nous avions faites dans cette Section 1, nous avons commencé par personnaliser, ou du moins regarder comment nous pouvons personnaliser les pages d'identité. Nous avons vu qu'ils ont tous été générés là où nous les avons échafaudés dans la section des pages d'identité. Et nous avons vu que nous pouvons modifier le login ou l'enregistrement. Nous pouvons les étendre en fonction de nos règles et exigences commerciales. Donc, vous avez une bonne idée de la façon de faire tout ça. Nous avons également examiné la mise en œuvre de l'interruption JS avec des bibliothèques tierces. Donc, je vais juste aller avec la page de réservation où nous avons fait ça sur la page d'index. D' accord. Donc une autre chose que j'aurais fait est de m' assurer que tous les composants ont du code derrière le fichier. Donc, une fois de plus, c'est en fait facultatif, donc je ne dis pas que vous devriez ou si vous ne l'avez pas, vous n'avez rien accompli parce que si cela fonctionne, cela fonctionne et ça a fonctionné, il est conçu désolé de travailler dans les deux formats. Cependant, je suis allé de l'avant et j'ai importé chaque score de composants dans le code derrière le fichier. Très bien, donc pour la page d'index, nous devons implémenter l'élimination de l'IA parce que rappelez-vous que nous avons cette méthode d'élimination que nous avons implémentée. Donc, dans le composant lui-même, nous avons dit que je jetable ou je dispose dot disposer. Dans cette situation, nous allons juste l'hériter et ensuite l'utiliser, et nous l'avons déjà fait auparavant, donc ce n'est rien pour les étrangers. Sinon, on ne sait pas. Nous avons nos injections au fur et à mesure, nous faisons notre JS Runtime et après sous un évier, nous allons de l'avant et rendons la table de données. Nous avons déjà parcouru l'école, mais juste comme un résumé, nous savons, nous savons, ce qu'il faut pour implémenter ou mettre dans une bibliothèque JavaScript tierce dans nos applications blazer. Donc, cette technique va à travers le tableau pour fondamentalement n'importe quelle bibliothèque JS tierce que vous voulez implémenter ici. Maintenant, une autre chose que j'aurais fait hors caméra est d'implémenter un certain niveau de sécurité. Il existe donc une politique de sécurité appelée ce qu'on appelle la politique de sécurité du contenu, où nous pouvons aller de l'avant et imposer des restrictions sur les scripts que nous voulons exécuter sur notre application. Maintenant, cette politique n'est pas unique à blazer, c'est une politique Web. Je suis juste en train de l'implémenter dans blazer ici, mais c'est à quoi cette politique doit ressembler pour que vous puissiez faire une pause et essayer de la répliquer. Mais je suis allé vous accompagner. Donc, le metatag, l'équiv de tiret HTTP. Politique de sécurité du contenu. Donc, il est juste un en-tête que nous envoyons au navigateur pour laisser le navigateur savoir quels fichiers de script, quels fichiers CSS nous voulons exécuter sur notre application. Et cela devient important pour aider à lutter contre les attaques de script intersite. Cette politique va donc de l'avant et instaure des restrictions. Et il lui permet de savoir que tout ce qui ne vient pas du site lui-même ou inclut ce code particulier ou a une évaluation dangereuse et ne l'exécute pas. Nous lui faisons également savoir que nous faisons confiance aux scripts de ces sources. Et de même pour les styles que nous avons dit, Ok, nous allons nous accepter. Nous pouvons accepter les styles en ligne, et nous accepterons une feuille de style à partir d'ici. Donc Nevada tiers, donc à peu près si nous allons aller de l'avant et inclure d'autres bibliothèques tierces, et nous voulons protéger notre site Web de la même manière que nous aurions juste à étendre ce métatag pour inclure ces choses. Non, les politiques de sécurité du contenu sont des méthodes très populaires pour sécuriser les sites Web. Encore une fois, lire plus à ce sujet à partir du site Web même Firefox, que je viens de soulever à l'écran CSB. Et vous pouvez simplement lire dessus et voir exactement quel type de protection vous pouvez obtenir et regarder ces valeurs signifient vraiment dans la construction de cette politique. Maintenant, nous sommes également allés de l'avant et modifié ou dans le service septa quand nous modifiions le téléchargement de fichier. Donc nous testons une chose, déplions une autre échappatoire. Mais nous sommes allés de l'avant et avons ajouté cette exception à l' interception 0 parce que nous en avions besoin pour arrêter l'exécution une fois qu'il y avait une erreur, car elle continuerait à essayer et exécuter. Nous avions donc besoin de l'arrêter dans ses camions et de faire savoir à l'utilisateur que quelque chose s'est mal passé. Et dans ces mêmes notes, nous avions implémenté le téléchargement de fichiers. Nous l'avons fait spécifiquement pour les véhicules. Et le composant de l'avant-bras pour les véhicules est beaucoup plus grand que les autres composants de forme parce qu'il a un peu plus de logique qui se passe là-dedans. Mais une fois de plus, c'est juste comme ça que nous pouvons isoler le code du composant dans le fichier pour que tout reste compact et facile à trouver, non ? Dans une tentative pour réduire la répétition et la maison dans les dizaines ou appeler le client et la même méthode encore et encore, eh bien, nous avons créé un dépôt HTTP, que je l'appelle juste un dépôt HTTP assez générique pour accepter n'importe quel type de données et effectuer l'action requise, savoir certaines choses que je veux. Certaines décisions ont été prises ici que plus tard, quand j'étais un refactoring est revenu à hanter l'homme, vous avez probablement soit passé par son R, sont en train de le traverser. Alors laissez-moi juste pointer que vous avez dit dans la mise en œuvre d'un mettre ceci en tant qu'idéaliste, mais alors, vous savez, je ne peux pas les mélanger beaucoup. Je liste et liste à travers tout le code. Donc, cela aurait causé des conflits. Donc, soit vous le changez en liste, puis changez tout le reste pour lister ou changez cela l'idéaliste et tout comme l'analyste. Quoi qu'il en soit, cette petite incompatibilité de type de données pourrait avoir causé quelques maux de tête ici et là. Mais mon facile me les réparer à cette liste parce que la plupart des autres choses que nous sommes juste liste dans mon code de toute façon ou dans le reste du programme. Bon, pour que tu puisses aller de l'avant et faire attention à ça. Et vous verrez également que si vous avez fait le dépôt et la liste, alors il est en fait plus facile pour vous n'auriez pas cette incompatibilité de type de données pour ceux qui sont liste, n'est-ce pas ? Donc, comme je l'ai dit, je suis mélangé et je les assortis. Ce n'est pas nécessairement une bonne pratique. Quand nettoyer ça, bien sûr. Mais si vous utilisez une liste USA LLC, si vous utilisez la liste inutile. Mais la bonne chose à propos de l'idéaliste est que c'est juste une obstruction d'une liste ou d'un type de collection qui est liste. Donc, parce que nous renvoyons une liste de notre référentiel générique, cela n'a pas provoqué de conflit de type de données parce que nous affectons le L2. C' est une abstraction, c'est une obstruction de niveau supérieur. D' accord ? Donc, ce est relativement inconnu est oui, je suis juste pointé que vieux au cas où vous vous demandez. Et puis finalement, nous avons exploré ce qu'il faut pour avoir une application web progressive, comment cela fonctionne exactement. Il y a beaucoup plus à ça. Ce que je ne vais pas obtenir trop en profondeur, mais nous avons vu combien il est facile de simplement l'installer sur la machine ou sur un appareil. Et nous pouvons personnaliser les images et certains bits d' informations de ces fichiers qui se trouvent dans le dossier racine www. D' accord. Donc, avec tout cela dit et fait, et c'est nous aller de l'avant et faire un check-in. C' est un énorme check-in pour moi en raison de quelques fichiers qui ont été modifiés en cours de route. Et nous avons les images et toutes ces choses merveilleuses. Donc, bien sûr, les émeutes ou message amical et utile qui dépeint à vous-même, à l'avenir vous et à votre équipe ce qui a été fait exactement. Et puis je vais juste faire un commit et pousser. Donc, une poussée bien sûr a envoie ça se demander, Shauna évier signifie que s'il y a des changements là-bas C'est inactif sur le dessus, alors il va les tirer ne pas aussi, puisque je suis le seul à travailler, ça n'a pas vraiment d'importance lequel est utilisé. Donc, c'est bien. Et c'est tout pour cette section. On se voit. Et c'est tout pour cette section. A bientôt. 46. Déployer sur Azure: Hé les gars, bienvenue. Nous sommes donc à ce module où nous pouvons déployer notre application sur Microsoft Azure. Et Microsoft fait votre est le fournisseur phare de Cloud par Microsoft. Et ce qu'ils font, c'est qu'ils offrent la possibilité déployer vos applications pratiquement en toute transparence sur Internet. Et ils fournissent une infrastructure gérée afin que vous n'ayez pas à vous soucier d'aller et de configurer les serveurs et de s'asseoir cela et de la sécurité qu'ils vous donnent tout cela hors de l'emballage. Et c'est relativement abordable. Nous allons donc déployer notre application telle que vous la voyez ici, sur Azure. J' ai dans un autre onglet lié à Azuri. Vous pouvez y arriver Azure dot microsoft.com. Et ce qu'ils ont, première chose que vous allez voir est que vous pouvez commencer gratuitement. Donc, il est vraiment facile de s'inscrire, surtout si vous avez déjà un live de cônes, que vous avez probablement utilisé lorsque vous avez installé Visual Studio au début de ce cours sont dans le prix passé de ce cours. Mais il est facile pour vous de vous inscrire, commencer gratuitement, vous obtenez 12 mois, ainsi que 200 crédits de dollars pour aller vers des services et des expériences que vous voulez. Maintenant, personnellement, j'ai un salaire à mesure que vous montez, ce qui signifie que je ne paie que pour l'utilisation des ressources. Donc, dans ce tutoriel, certaines ressources ne seront pas gratuites, comme si vous étiez sur le plan gratuit, c'est bon. Mais si vous êtes déjà épuisé votre période d'essai et que vous faites ce cours et que vous déployez que vous devrez peut-être payer pour certains services, ce que je vais tous les pointer. C' est comme nous allons le long et essayons de tout garder au strict minimum. Mais si vous ne pouvez pas nécessairement suivre et faire bullseye au moins, nous verrons comment cela fonctionne le déploiement d'une application sur Microsoft Azure et c'est assez facile. Alors commençons. Pas de Buck dans notre projet, nous avons un travail de préparation à faire dans nos configurations avant de pouvoir penser aux deux déploiements dans notre fichier JSON AP settings.js. Nous devons configurer un chemin. Eh bien, nous devons mettre en place un certificat SSL et le configurer spot pour notre service d'identité. Donc, ce qui se passe est que sur la base de la configuration que le serveur d'identité a modifié les boulons, nous devons configurer un certificat SSL afin que l'application cliente puisse réellement parler à l'application serveur. D' accord, parce qu'alors ça va échouer au démarrage. Donc en fait eu un petit seau avec la somme ne saute devant la boucle. Et je vous montre juste la solution à ce problème très répandu que vous pourriez avoir si vous ne suivez pas ces étapes. Très bien, donc l'application cliente doit communiquer avec notre serveur avec le service d'identité. Il doit essentiellement faire comme dans les coulisses, se connecter pour que le client sache ou le, désolé, le service d'identité sait que le client est là, il est prêt à se connecter. Cela se fait sur une connexion très sécurisée. Un certificat SSL est donc nécessaire pour faciliter cela. Donc, dans le développement, c'est bien parce que dans les paramètres d'application, ce point de développement JSON. Vous verrez ici qu'il dit les développements de type clé. Donc ça dit juste, ok, eh bien, c'est un moment de développement, ce n'est pas un problème cependant, dans notre bouleversement. Donc tu n'as pas de réglage comme ça. Et nous avons le client où il dit que c'est le client qui connecte le profil est qu'il s'agit d'un serveur d'identité, SPA. Et si vous allez aux contrôleurs et à tous les contrôleurs de configuration IDC, alors vous allez voir où toutes les choses du client entrent en jeu. Donc ce contrôle et à l'étranger, cela n'avait pas beaucoup de sens au début de ce cours. Et je n'ai pas passé trop de temps à expliquer ce qui se passait ici. Mais ensuite basé sur toutes les interactions et toutes les choses que nous avons faites jusqu'à présent. Et vous voyez comment nous devons nous authentifier contre le serveur oblige sur nos gains. J' avais l'entité afin d'utiliser le client avec succès, le Tolkien doit être facile à toutes ces choses. Donc, ce contrôleur tire fondamentalement juste ces cordes. Il sait où le client ID, encore une fois, cette plante, non ? Il est au courant de tout cela et il ne fait que faciliter cette communication. Mais une fois de plus, les certificats SSL doivent être présents. Facilitez donc cela. Maintenant, dans ce déploiement, nous déployons simplement une application personnelle. Donc, le certificat va être un autocenseur que nous allons générer sur la machine et ensuite utiliser. Mais dans un contexte de production, alors bien sûr, vous voudriez utiliser un certificat prêt à la production et correctement émis par l'une des principales autorités. Cependant, les concepts resteront les mêmes. Alors commençons juste. Donc maintenant, pour commencer, ce que nous voulons faire est de faire apparaître PowerShell va utiliser cet outil très puissant. Encore une fois, si vous êtes sur une machine Windows, mais c'est un outil très puissant et nous allons l'utiliser pour générer ou des scripts SQL. Donc, vous voulez l'aborder en tant qu'administrateur. Très bien, Donc Exécuter en tant qu'administrateur, vous pouvez soit rechercher dans la barre de recherche ou vous pouvez trouver l'icône elle-même Cliquez avec le bouton droit de la souris et vous voyez que vous l'exécutez en tant qu' administrateur afin que vous puissiez utiliser l'une ou l'autre option pour obtenir ce bâtiment. D' accord, donc la première commande, et ce qu'on va faire, c'est en construire. Donc, si c'est la première fois que l'utilisation de Porsche obtient facilement un C, sorte de comment cela fonctionne. Eh bien, ce ne serait pas la première fois qu'on utilise des bêtises parce que le gestionnaire de paquets et l'étudiant visuel utilise en fait commandes PowerShell et des commandes, n'est-ce pas ? Donc, ce type de format obtient l'aide de tiret ou la base de données de tiret et ajoute la migration de tiret. C' est ce qu'ils appellent les commandes PowerShell, non ? Donc, ici, nous allons utiliser une commande conduit pour créer une nouvelle recherche. C' est donc une variable. Très bien, si vous ne faites pas PHP, cela ne devrait pas vous sembler trop peu familier. Et puis nous allons dire nouveau moi et puis il peut appuyer sur Tab et il va compléter automatiquement la ligne, non ? Donc Newell a auto-signé des certificats, DNS, nom. Et puis je vais l'appeler, appelons ça voiture dans Tau était voiture ou une serviette Watson, non ? C' est ce que je suis pris dans le DNS. Donc, de manière générale, que vous voulez, vous voulez que cela représente l'URL du site Web. Encore une fois, il s'agit simplement d'un déploiement ou d'une mise en marche. Donc, les concepts sont là, même si l'aspect pratique peut ne pas nécessairement s'appliquer dans une situation réelle. Bon, donc nom DNS, je vais appeler ça voiture jusqu'à Watson ou vous pouvez appeler quelque chose avec lequel vous êtes plus à l'aise. Emplacement du magasin de certificats. Donc, il est un peu un emplacement par défaut est cert deux-points A propos de la machine locale slash, qui contextualise juste et tout va bien. Et puis on a juste, comme on vient de voir des cas, ils seront trop petits. On y va. Ça a l'air un peu mieux. D' accord. Donc, vous allez auto-censurer la voiture de nom DNS jusqu'à ce que n'était pas CERT, cert, magasin, emplacement, recherche , machine locale, barre oblique cert deux-points, machine locale fondue. Et remarque la direction de cette barre oblique, coupe ma droite. Donc, il le crée, puis il stocke tous les détails à l'intérieur de cette variable appelée CRT. D' accord, alors nous devons favoriser protégé. Donc, nous allons voir PWD et convertir outil, ou désolé, outil de conversion, flux sécurisé. On y va. Dash string, et puis nous allons juste lui donner une chaîne. Donc j'allais utiliser le patron par défaut ou que nous connaissons et aimons. Bien sûr, une fois de plus, vous utiliseriez un mot de passe beaucoup plus fort dans notre situation réelle. Et puis nous avons dit une force et comme jolie et textes appuyez sur Entrée. Donc, nous stockons le mot de passe en tant que PWD. Ensuite, nous allons construire le chemin. Donc cinq est égal à, et ensuite nous disons monsieur colon. Et puis si je viens d'appuyer sur Tab, il termine la machine locale M baignoire, dire Candace, utiliser le haut pour une sorte de vitesse ce long. Je fais ça lentement pour qu'ils puissent suivre. Et ils disent des empreintes digitales cert dot. D'accord. Et puis nous allons avoir construit tout cela exporté dans un fichier physique. Donc, je vais dire export dash b, fx, certificat, tiret CERT, cert, et surf est tombé point py. Et puis le chemin du fichier est là où nous voulons qu'il appelle, n'est-ce pas ? J' ai donc un chemin de fichier à c deux-points slash sh. Ok, laisse-moi juste faire des certificats du côlon. Donc c'est mon dossier sur ma machine. Ainsi, vous pouvez aller de l'avant et créer votre propre dossier sur votre propre machine. Et puis vous pouvez utiliser ce chemin de fichier. Il ne le créera pas pour vous, alors assurez-vous qu'il existe. Mais vous voulez lui donner le nom de fichier pour que je puisse voir Blazer n'était pas cert, alors nous l'appelons juste point, point p effets. Bon, donc c'est le fichier que je voulais générer. Et puis le mot de passe est le Il y aura tout droit, allez-y et appuyez sur Entrée, puis il me montrera que la recherche a été créée. Donc, pour la facilité, une fois que je vais faire parce qu'il y a deux raisons que je vais le faire de cette façon. Un, pour faciliter les victoires rapides. Donc nous allons juste le mettre dans le projet. Saurons-nous où c'est ? Et nous allons également mettre dans la connexion ou les détails de puces dans notre clinique, dans nos paramètres d'application, dans nos configurations afin qu'il puisse être utilisé. Je vais le transformer en pôle jamais. Et probablement la façon dont vous voulez vraiment le faire dans notre environnement sûr réel serait deux. Lors du déploiement, lorsqu'il est déployé en tant que votre téléchargement sur Azure, laissez-nous gérer le certificat, puis configurez votre configuration pour voir le certificat tel qu'il est géré par Azure. Maintenant, parce que je voulais garder tout à bas prix, je ne vais pas faire tourner la version payante d'Uzziah qui permet tout cela de se produire. Nous utiliserons le niveau gratuit. Donc, à cause de ça, je vais rester simple. Mais encore une fois, le concept est là. D' accord, âme. Importons ce certificat dans notre projet. Et tout ce que j'ai fait était d'aller le trouver sur le système de fichiers le copier et de le coller dans le projet. Et voilà. Et ce que nous voulons faire est de changer les propriétés pour s'assurer qu'il est désolé, il copie toujours. Tu ne peux pas dire copie si elle est plus récente, c'est bon. Très bien, alors ce qui se passe, c'est que nous voulons quand nous déployons qu'il inclue cela dans le déploiement. Donc maintenant tout ce que nous avons besoin de mettre à jour notre configuration afin que le serveur d'identité sache où aller et trouver le certificat qui devrait courtier cette connexion. Encore une fois, c'est pour que nous puissions passer à travers cette activité. Mais le prob, le moyen le plus sûr de le faire serait de laisser votre gestion de la clé et ensuite avoir le point de configuration vers cette clé gérée. D' accord, donc de cette façon il n'y a pas de clé physique F0, F4 pour que personne puisse y accéder. Et bien sûr, je veux dire, cette façon peut être sécurisée si nous avons juste beaucoup d'os pour les droits d'accès au service et personne ne peut vraiment accéder au fichier de clé physique et à tout ce que les balles, vous savez, probablement mieux de simplement le gérer parce que Uziah ne saurait le mieux. Donc, ici, nous allons mettre quelques configurations pour les clés. Donc, à l'intérieur de l'objet de configuration du serveur d'identité ou de l'objet JSON, nous avons des clients, et c'est nos clients et ainsi de suite. Nos clients vont mettre une virgule puis une clé. Et puis nous disons deux-points et puis ouvrons un nouvel objet de configuration. Ensuite, nous allons spécifier le type, le nom du magasin, le chemin du fichier et le chemin d'accès. Et c'est à ça que ça ressemble, non ? Donc, nous avons le type qui est fichier. D' accord ? Si elle était gérée par un type 0 serait différent. Donc, nous avons le type qui est le nom du magasin de fichiers. Nous allons juste l'appeler mon chemin de fichier, le chemin qui affirme. Donc, je l'ai juste mis à la racine du projet. J' aurais pu le mettre dans un dossier, peu importe, mais partout où je l'ai mis, C' est le chemin du fichier et le mot de passe est la posture qui a été utilisée. D' accord ? Si quelqu'un accède au sponsorisé et peut accéder au fichier, alors évidemment, quelqu' un pourrait le décomposer. Mais une fois de plus, c'est un certificat auto-signé. Donc, toute l'idée derrière cela est de ne pas être le plus sûr et d'être plus sûr coûte plus d'argent. Donc, dans cette situation, nous gardons juste le bas coût une fois de plus. Donc, après avoir fait tout ça, on peut aller de l'avant et se déployer. Je vais donc faire un clic droit sur le projet de serveur, cliquez sur Publier. Et puis dans l'écran publié, nous allons dire commencer. Donc, à partir de publié, nous pouvons toujours simplement envoyer tout à un dossier, le mettre sur nous, un serveur local et l'avoir exécuté. Nous pourrions déployer sur Azure, ce que nous allons faire. Selon l'institution, vous pouvez choisir l'une des options ci-dessus. Eh bien, encore une fois, nous nous concentrons sur l'azurite et aussi, il flotte juste dans le prochain. Et puis nous voulons un service d'application gardera les fenêtres, ainsi de suite, changez que Suivant, et puis ils confirmeront votre abonnement sur. Donc, à ce stade, vous pouvez être invité à vous connecter. Tu peux aller de l'avant et faire ça. Mais les points-virgules utilisant pour Visual Studio est mon Microsoft.com et utilisé sur 0. Donc, ils me connaissent, ils savent quels abonnements, ainsi de suite. Et vous avez un test de slash de développement payer-as-you-go où vous ne payez que pour ce que vous utilisez et vous obtenez les ressources à la diapositive ou à moindre coût. Mais bien sûr, vous ne les utilisez pas pour des raisons d'entreprise, n'est-ce pas ? C' est donc mon abonnement sur lequel je suis. J' ai plus de groupes de ressources, ou le groupe de ressources est comme un conteneur, comme un conteneur logique qui dit que toutes ces ressources appartiennent à ce haut. Donc, vous avez tendance à vouloir avoir notre groupe de ressources par up. D' accord ? Donc, je vais aller de l'avant et créer un nouveau groupe de ressources. Eh bien, en fait, je crée, donc je crée un nouveau service AP, qui suggère ensuite ce groupe de ressources pour ce service App. Et App Service est un serveur géré. Et je continue à voir géré, géré, ce qui signifie que vous n'avez pas à vous soucier l'infrastructure et de l'installation de Windows lors de la configuration d'IIS. Tu n'as pas à t'inquiéter de tout ça. Tout est prédéfini. L' environnement est qu'ils disent fondamentalement que j'ai l'environnement, donnez-moi juste les fichiers et je vais faire le reste. On peut lui donner un nom. Donc, nous pouvons probablement changer cela pour dire que le courant n'était pas actuel, blazer, quelque chose, quel que soit le nom que vous voulez en fonction de ce que votre entreprise veut. Groupe de ressources. Vous pouvez le laisser par défaut ou si vous voulez créer, alors vous voulez avoir un nom spécifique, alors vous pouvez le faire. Tout le bruit du plan de vapeur là où nous devons le changer. Donc, je peux cliquer sur Nouveau et nous pouvons sélectionner un emplacement. Donc basé sur l'endroit où I East US 2 est mon centre de données le plus proche. Mais alors vous voyez qu'ils sont restés là pour un certain nombre d'endroits géographiques. Je veux choisir celui qui est le plus proche de vous pour avoir le plus efficace ou sur le droit ? Donc, après avoir choisi East US 2, je choisis le plan que je veux. Et bien sûr, le mot magique est en haut, le mot libre. Alors je vais y aller et cliquer. D'accord. Ensuite, nous pouvons cliquer sur Créer, puis donner quelques minutes. J' ai dit quelques minutes, mais ça a vraiment pris moins d'une minute, du moins pour moi. Mais à la fin de cette activité, nous avons l'absurde est créé. Ensuite, je peux juste aller de l'avant et cliquer sur Terminer. Donc, la ressource est là dans la charge de travail. Il est assis connu en attente Web, déployez-le jusqu'à présent. Eh bien, nous avons un autre lâche et qu'il faut attacher, et c'est notre base de données, non ? J' ai donc besoin de configurer les besoins des abeilles. Utilisons-nous Azure SQL ou utilisons-nous une base de données locale ? Et toute la base de données SQL Azure est une autre version du logiciel de gestion. Le T s'occupe de tout ça pour vous. Ils voient juste qu'est-ce que vous voulez que la base de données soit créée pour vous ? Tout ce que vous avez à faire est de créer une table est de lire et d'écrire et de quitter Mary, vous n'avez pas à vous soucier d'installer environnements d' encerclement sur toutes ces choses. Nous allons donc simplement utiliser la base de données SQL Azure. Cliquez sur Suivant, null. La base de données a besoin d'un serveur, comme nous le savons, n'est-ce pas ? Utilisez les actes de B car nous devons avoir un serveur et s'il vous plaît, donc nous devons réellement les créer. Et puis cette étape est là où le coût entre en jeu, juste à. Cette étape n'est pas nécessairement gratuite du tout. Bon, Donc nom de la base de données, nous allons juste laisser les valeurs par défaut, la gestion actuelle points Server DB, où les besoins sont servis. Eh bien, c'est une base de données donc nous devons créer le serveur. Donc, après vous avoir obtenu à nouveau, de sorte que les serveurs ou à un coût et vraiment vient parce ennuyeux, vous devez payer pour cet espace. Et je vais juste appeler ce serveur DB juste le joli nom générique. Je ne veux pas qu'il soit trop spécifique car il fait un serveur qui va avoir beaucoup de vieux broche différents qui n'est pas disponible. Gestion actuelle, Watson. Et c'est une fente à la Watson bien sûr est forte pour WebAssembly de sorte qu'il sonne comme accepté que l'un des États-Unis de l'Est 2. Donc, vous voudrez garder toutes les ressources qu'ils auront peu dans la région géographique CMD. Et je vais juste utiliser la vraie guerre comme nom d'utilisateur et p sin signe dollar de sable Dala W 0 RD pour le mot de passe, le même signe de dollar, signe dollar W 0 RD. D' accord. C' est tout ce qu'il faut pour mettre en place un tout nouveau service. Vous aurez facilement ce n'est pas, si vous deviez installer le serveur Microsoft sur votre machine, il Bravo prendrait un peu plus d'attention que le simple formulaire qui donne le coup d'envoi d'un bouton OK, puis en cliquant sur Créer. Et puis celui-ci pourrait prendre un certain temps. Et quand cela sera fait, nous aurons notre serveur de base de données et base de données créé Android pour vous. Donc on peut aller de l'avant et frapper Next. Et puis ils nous demandent de confirmer la chaîne de connexion. Donc, cela réutilise la même vraie guerre et signe P, signe dollar, signe W RD. Très bien, alors ils vous donnent cette valeur de chaîne de connexion, que vous pouvez toujours jeter un coup d'oeil à n'importe quel peut le copier et le garder à vos propres fins. Mais cette source de données est l'adresse du serveur. Eh bien, oui. Donc, le serveur de base de données. D'accord. Et c'est le nom de la base de données. Tu sais, des cordes de connexion à boulon déjà. Mais vous pouvez simplement ouvrir un SQL Server Management Studio, mettre cette valeur, puis authentifier puis vous connecter. Et la bonne chose est qu'il est automatiquement sécurisé de sorte que votre Has il a tout mis sur la liste noire. Il n'y a rien seul. Donc, si vous avez essayé de vous connecter à partir de votre machine, ça dira, eh bien, je vois votre adresse IP, mais il s'authentifie et indique ensuite que vous voulez être listé en blanc pour que nous, vous savez, les accès non autorisés sont interceptés ne sont pas significativement raison de cette stratégie de sécurité par défaut sur votre base de données. J' essaye juste de te montrer à quel point c'est cool quand il s'agit de garder la sauvegarde. Et puis demandez, où voulez-vous stocker votre valeur de connexion ? Je vais juste le laisser dans les paramètres de l'application. Key Vault est un service payant. Si je ne me trompe pas, que vos paramètres d'application qui vient composants, bien sûr, vous avez un qui fonctionne, puis un qui est très sécurisé, plus sécurisé. Donc on va rester avec celui qui fonctionne de toute façon. Bon, alors allons de l'avant et cliquez sur Suivant. Et puis ils suggéreront que nous devons déployer des dépendances sur Acetyl-CoA Secret Store pour que nous puissions frapper Finish, permettre à ça de faire son truc. Et puis quand il est fait ou publié pitch sait n'a pas d'avertissement que tout est bon. Mais je veux faire une modification avant de cliquer sur Publier et c'est aux options sur Publier. Donc, je vais appuyer sur Edit. Et puis il fait apparaître cette nouvelle boîte de dialogue que nous n'avons pas vu auparavant. Mais je vais descendre aux paramètres et puis il va découvrir les bases de données finies par des contextes. Qu' est-ce qui se passe est qu'à ce stade, il va créer les battements obèses, mais il n'y aura pas de tableaux et pas de données selon notre C, ces données et ainsi de suite, non ? Donc, je vais aller de l'avant et lui faire savoir que je veux qu'il applique cette migration sur public, sur publié, désolé. Et nous pouvons choisir d'utiliser cette chaîne de connexion au moment de l'exécution, n'est-ce pas ? Donc je vais juste les emmener dans les autres paramètres. Ne leur dois pas vraiment bricoler. Nous pouvons choisir d'installer cette extension. Je ne sais pas si c'est un service payant, pour être honnête. Et puis nous pouvons choisir que chaque fois que nous publions 12, nettoyez un dossier et republions. Je n'ai probablement pas besoin de le faire. Mais je vais laisser tous ces cochés et ensuite aller de l'avant et économiser. Et puis le moment où nous avons travaillé en étroite collaboration, frappons Publier. Et quand tout cela est fait, nous obtenons cette erreur de 500. Au moins, il y a des progrès. Ce que je vais faire, c'est me connecter au portail. Donc c'est mon portail. C' est à ça que ça ressemble. Bonjour, vous pouvez le personnaliser, alors ne vous dérange pas comment ennuyeux mon tableau de bord regarde sont soit avoir sans beaucoup de ressources de toute façon, mais je vais juste aller directement à l'App Service. Et à partir de là, je vais utiliser le menu latéral. Donc vous pouvez, je veux dire, si vous avez cette zone, mais pour la regarder, vous pouvez prendre un certain temps et apprécier que vous obtenez différentes mesures, les données d'atteinte. Souvent, vous rencontrez une erreur 500. Donc vous voyez qu'on vient d'en frapper un. C' est un tableau de bord très utile. Vous pouvez redémarrer, l'arrêter, et le supprimer un certain nombre de choses, n'est-ce pas ? Donc, ce que je veux faire, c'est d'obtenir un outil avancé. Donc, sous les outils de développement vont vers les outils avancés. On peut cliquer sur Aller. Et puis cela nous amènera à un tableau de bord qui nous permettra d' entrer dans le système de fichiers réel, n'est-ce pas ? Donc, je peux aller à une console de débogage, cmd. Et puis ici, je peux réellement voir les fichiers qui ont été téléchargés. Je peux aller sur les sites www root, et puis ce sont les fichiers qui ont été publiés. D' accord. Donc vous voyez que tout est juste là. D' accord. Donc je veux savoir pourquoi c'est ressentir. Je voulais voir en amour quelqu'un pour modifier la configuration des points Web, qui est au bas de cette liste. Et puis je vais lui dire que l'activation du logo STD est vrai. Sauver. Et puis je vais juste essayer de fouiller à nouveau les sites Web. Donc, disons que j'ai des recherches ouvertes à partir d'une autre activité. Donc SS Rafraîchir. Et quand cela rafraîchit fait, cela signifie qu'il aurait généré un nouveau journal, quelqu'un pour aller buck. Et la destination du journal est ce fichier journal et il y a notre logo, point stdio, point, point, point. Regardez-le. Il indique qu'il y a eu une erreur lors du chargement des certificats, le fichier. Voir Holmes dit WW racine, blazer, Watson cert n'était pas le téléphone. Donc c'est pourquoi si juste pour ramener le point à la maison que nous avons besoin d'avoir ce certificat à courir parce que vous auriez vu une autre flèche si les cercles et le président et savoir que nous avons dit que la recherche est présente, il ne peut pas le trouver, nous avons toujours une erreur, n'est-ce pas ? La recherche est donc absolument vitale. De quoi avons-nous besoin ? Ce que je dois faire, c'est regarder en arrière et voir pourquoi il ne peut pas trouver ce certificat. Donc c'est bon, donc je vais dire Copie toujours. D' accord, donc il semble que c'est une copie tout. Et puis je vais faire une nouvelle publication. Et quand il a fini que publié cette fois. Boom, on y va. Nous avons donc publié notre blazer WebAssembly jusqu'à Internet. Il y a notre URL actuelle sur la gestion n'était pas websites.net. Bien sûr, vous pouvez acheter votre domaine personnalisé et comment il est correctement configuré. Mais essayons d'aimer et où. Très bien, voici ce qu'il faut pour réparer ce style, mais à l'écart, tu pourras toujours le réparer plus tard. Mais nous sommes ici sur Internet, donc nous avons notre mix, nous avons nos modèles, tout ce que nous avions ensemencé dans la base de données quand nous avons commencé est là. Ensuite, nous pouvons aller de l'avant et faire notre travail comme nous le souhaitons. Très bien, donc nous avons réussi à déployer notre application sur Internet grâce à Microsoft comme 0 et vous voyez, il n'a pas pris à notre droite. C' est à quel point il est facile de déployer une application sur Internet à l'aide de Microsoft Azure. Donc c'est tout pour cette activité. Merci de me rejoindre.