React, Tailwind et Firebase : créer un site de blog moderne

1. Introduction au cours: Salut, les gars, je m' appelle Joel D Muller, et je serai au top pour ce cours, création d'un site de blocs simple qui réagit au CSS Steeling et à Fire Base Dans ce cours, nous allons suivre différents processus de création d'un site bloqué, de création de notre blog, de téléchargement dans notre base de données et de récupération de celui-ci dans notre base de Nous allons utiliser pour notre base de données, nous allons utiliser Pier base et pour notre style, au lieu du CSS normal ou du CSS classique que nous connaissions auparavant, nous allons utiliser les cas où vous avez besoin d'un peu d'idée pour le style de ce cours. De plus, nous connaissons tous l'efficacité de React que nous allons utiliser pour que ce coût soit précis. Et après le cours, s'il n'y a rien qui vous semble clair, après le téléchargement du cours Glow, nous avons ajouté le lien À dans la description ci-dessous. Vous pouvez le vérifier, cliquer et vérifier le code vous-même, et même le copier Si vous le souhaitez, croyez-moi, ce cours, vous allez me le faire remarquer et vous allez profiter du cours sans plus attendre, je fais comme ils ont commencé. 2. Mise en place d’un environnement: Donc, pour commencer, je vais devoir exécuter mon environnement, endommager pour démarrer mes Damages. Je vais créer un nouveau dossier foi et je vais l'appeler. Je peux l'appeler nom, mais je vais appeler ce bloc. Ensuite, je vais l'ouvrir dans mon code Visual Studio. Donc, après cela, je dois installer mon React et tout démarrer correctement. J'ai besoin d'installer mon react et mon t css. Nous installerons Firebase plus tard car ce sera vers la fin du didacticiel avant de pouvoir commencer à implémenter Firebase Donc, pour créer ma réaction, il existe cette méthode par défaut de créer des réacteurs MPM create create react, mais je ne vais pas l' utiliser car cela prend un peu de temps. evi utilise MPM Il existe donc une alternative. Cela rend les choses plus faciles. Vous faites en sorte que votre réaction soit plus légère et plus rapide. Je vais donc utiliser T. Heureusement, je peux également installer mon téléviseur avec mon capteur de résidus Voici donc la commande, vous pouvez accéder à votre guide tail.com Consultez donc ce guide-cadre. Alors allez-y parce que nous allons utiliser la télévision. Vous pouvez donc simplement copier ceci en particulier. Ne copiez pas tout. Je n'ai pas besoin de tout. Copiez simplement ce MPM create Tartest car nous avons besoin de la dernière version de React ou de la dernière version de t pour être installée Mets-le sur ton terminal, ton frère, pour qu'il serve de nom au projet Alors appelons-le blog ou je peux l'appeler par mon nom, J Blog. Vous pouvez utiliser le nom pour cela. Joel Blog, cliquez sur Entrée Donc, il en aura pour le blog sur le nom du package. Vous devez donc en prendre note lorsque vous sélectionnez la vue bananes ou lorsque nous utilisons React React. Nous n'utilisons pas de script de type. Nous n'utilisons aucun script jo pour cela. Alors pourquoi vous cliquez dessus, agissez sur le blog CD to J, puis installez MPM pour installer la dépendance nécessaire à cette application Ainsi, après l'installation, vous pouvez maintenant exécuter MPM pour exécuter l'application et S fonctionne correctement. Vous pouvez donc cliquer sur cette commande audio de contrôle et cliquer. Nous allons donc voir l'application apparaître. Nous avons donc pu configurer facilement notre application de réaction environnementale, mais nous devons tout de même installer notre package tailwind Copiez donc ceci et vous pourrez ouvrir un autre terminal pour cela. Vous devez donc le voir sur votre blog ou quel que soit le nom que vous lui donnez, et le contrôler. Cela installera donc le CSS pour t win. Ensuite, vous devez installer le P t winds it. Ensuite, vous le collez également. Ensuite, nous avons notre fichier de conflit CSS et nous avons notre si vous vérifiez cet endroit, votre mode source votre index CSS et d'autres éléments à l'intérieur Donc, après cela, dans notre fichier de configuration js, nous devons le copier et coller l'intérieur de notre contenu Nous devons le copier et coller d. Celui-ci symbolise simplement que n'importe quel aliment, n'importe quel fichier contenant cet index, index HTML, ou at ou do Tx, nous serons en mesure de travailler dessus Si ce n'est pas dans le TCS, nous ne pourrons pas travailler sur notre propriété Et également dans notre index CSS, nous devons le copier sur l'ancien CSS d'index. Vous pouvez donc simplement le dépasser et ensuite, je pense que nous sommes prêts à partir. En outre, pour ce tutoriel, je dois importer certaines polices que je vais utiliser pour ce didacticiel, il y a des polices spécifiques que je vais utiliser pour cette histoire Je vais donc importer cette police Google. Vous pouvez également le copier et faire de même. Ouvrez San Inter Barbers et Amar, c'est la police officielle que je vais utiliser Donc, pour implémenter ce frontal, je dois l'ajouter à mon fichier TV.cc. Alors ne t'inquiète pas. Dans la configuration. J'ai ajouté beaucoup de choses. Donc, au sein de l'équipe, je sais que votre équipe est un peu vide auparavant, mais j'ai ajouté la famille de polices étendue The Extenders Donc, pour chaque police, voici le fonds dont j'avais besoin. Je peux donc appeler cette police à tout moment dans ma réaction, dans ma page ou quoi que ce soit d'autre. Donc, cette couleur, je ne veux pas ajouter de couleur à chaque fois, peut-être à chaque fois que je veux utiliser de la couleur primaire. Il suffit de m'ajouter cet A 535 à chaque fois. Ils feront donc en sorte que si je l'ajoute ici, je puisse simplement appeler la couleur d'arrière-plan la couleur principale. Donc si je change de couleur ici, cela va changer pour toutes les autres pages dont j'ai besoin, soit j'utilise cette couleur primaire au lieu de passer d'une page à l' autre pour changer de couleur. Donc, après cela, j'ai besoin de Chrism Folder. Tout d'abord, mon dossier de pages , puis mon dossier de composants. Donc, dans le dossier de pages, c'est là que se trouvent toutes les pages nécessaires à cette application ou peut-être la page politique, peut-être la page politique la page football ou toute autre page. Et component, vous savez, component react est comme un code réutilisable au lieu que je le réécrive pour chaque page, je peux simplement le compiler et l'utiliser dans cette page en particulier Il y en a donc d'autres à faire. Donc, dans mes applications. 6 Nous n'avons pas besoin de tout cela. OK, voyons si notre réaction fonctionne. Nos sens secondaires fonctionnent. Donc, à l'intérieur, s' il vous plaît. Laisse-moi voir. Donc, pour que vous puissiez utiliser votre vent arrière, vous devez dire le nom de la classe Oui, ce nom de classe. Je vais voir que le contexte doit être lu. G six. Laissez-moi voir, peut-être que cela va fonctionner ne fonctionne pas. Probablement, laisse-moi recommencer ce truc. Oh, tu peux voir maintenant. Donc, après avoir installé votre ten sass, vous devez fermer le serveur en cours d'exécution et le redémarrer à nouveau. Vous pouvez donc voir que notre t ss fonctionne bien maintenant. Mais nous n'en avons pas besoin sur notre serveur. Nous n'avons pas besoin de cette page. Nous avons donc besoin d'une page complètement différente. Donc, pour ce faire, j'ai déjà du code. Nous allons l'expliquer, je vais simplement le copier-coller, puis l'expliquer plus tard. Donc, ce que je fais maintenant, c' est d'installer ma route afin de pouvoir évaluer les différentes pages de mon distin, mais ça ne marchera pas maintenant car je n'ai pas installé mon routeur React Doom Donc, pour l'installer, vous pouvez simplement copier et le coller sur votre Dist Check PPG Sell pour l'installer sur votre navigateur dans votre application Il suffit donc de copier cette commande et de vous rendre ici dans votre. Après l'installation, vous pourrez revenir à votre plan. Donc, ce sera certainement prévu car je n'ai pas de page chargée dessus. C'est donc ce que nous allons utiliser plus tard. Voici les pages que nous allons créer. Nous avons besoin de la page d'accueil, de la page de contact, des différentes pages du blog. Ensuite, nous avons besoin des détails du blog et créons un blog. Donc, tout d'abord, nous avons besoin de notre navigation et de notre pied de page. Si vous cochez ici OK. Désolé. Donc, si nous vérifions ici, nous avons notre numéro recherche, le nom du logo et les autres éléments, et nous avons notre pied de page C'est celui que nous allons subir. Nous allons donc afficher toutes les autres pages à l'intérieur de ces deux composants. Il y a donc deux composants que nous devons créer maintenant, le d Nerva et le pied 3. Navbar et pied de page: Donc, après l'installation, vous pouvez revenir à votre . Donc, certainement, ce sera prévu car je n'ai chargé aucune page dessus. C'est donc ce que nous allons utiliser plus tard. Voici les pages que nous allons créer. Nous avons besoin de la page d'accueil, de la page de contact, des différentes pages du blog. Ensuite, nous avons besoin des détails du blog et créons un blog. Donc, tout d'abord, nous avons besoin de notre Nerva et de notre pied de page. Si on y vérifie. Donc, si nous cochons là, notre nœud contient la recherche, le nom du logo et les autres éléments, et nous avons notre pied C'est celui que nous allons subir. Nous allons donc afficher toutes les autres pages à l'intérieur de ces deux composants. Il y a donc deux composants que nous devons créer maintenant, les en-têtes Nerva et le Donc, pour commencer par ça. Je préfère donc que tout ce qui se trouve sur l'écran soit isolé et que lorsque l'écran est assez grand, le pic du barrage est horizontal verticalement, le rembourrage serait nul Si le dépistage est faible. Le rembourrage sera de huit tous les côtés et le fond doit être blanc, etc. J'affiche donc également Flex. Donc, flex moins un et d'autres choses. Ce ne sont que des outils de base pour passer à autre chose. Je dois donc créer mon dernier nom : nerve.sx, et ma Donc, je réagis, si vous utilisez React, vous devez tout importer pour pouvoir appeler ces fonctions en dehors de cette réserve particulière, vous avez votre point d'index. Cela vous permettra d' appeler ces deux composants ou tout autre composant qui se trouve à l'intérieur, s'il vous plaît, à tout moment. Donc, exportez tous les deux composants maintenant. Donc, dans mon numéro, vous pouvez taper cette commande. Si vous l'avez installée, vous devez restaurer une station ins pour que React soit dépensé. Je vais donc pouvoir faire ce que je vais faire maintenant. C'est désolé, RSC. Cela vous aidera donc à créer la page qui vous permettra de le faire. Vous pouvez également faire la même chose ici, dans vos potiers peut-être que vous pouvez travailler dans notre Voyons nos composants. Nous sommes en train d'interner ces deux composants, nerf et le routeur Désolée. OK. Alors Nava, disons que ces deux-là vont peut-être apparaître Pouvez-vous voir les deux composants qui apparaissent déjà sur notre page de réaction. Donc, dans notre ensemble, nous devons assembler ce principal dans un routeur afin pouvoir parcourir différentes pages. Je viens donc d'ajouter ce routeur de navigateur à partir de la réaction que nous installons et nous l' assemblé de telle sorte que chaque fois que nous parcourons des pages, nous puissions. Lorsque nous cliquons sur une page en particulier, nous pouvons nous précipiter sur cette page et y accéder sans aucune erreur. Maintenant, nous pouvons constater que notre bar fait un travail inutile. Nous avons donc juste besoin d'implémenter un design dessus. Donc, pour commencer, pour commencer. Je vais juste passer en revue quelques codes. Je crois que tu en as une idée. Je ne me contente pas de suivre le code très simple, je vais écrire du code complexe, utilisant un simple script gamma. Je vais apporter quelques explications si nécessaire. J'ai besoin de créer un objet contenant des liens pour appeler cation. Je déclare donc essentiellement le nom d' un lien particulier et le routage. C'est la page vers laquelle je voulais accéder. Par exemple, je voulais accéder à l'emplacement de la page. Je voulais me rendre sur le blog. C'est donc comme ça que ça va se passer là-bas. Donc je vais juste le copier. C'est donc pour cela que je vais juste faire. Ça l'est aussi. J'en ai donc juste ajouté d'autres comme spot this way she. J'ai maintenant créé le routage du terrain, mais c'est ainsi que je veux qu'il soit acheminé vers un autre terrain. Alors ne t'inquiète pas. Je vais vous montrer comment nous allons accéder à une autre page. Ensuite, je dois créer une fonction de design réactif afin que lorsqu'ils soient en pièces détachées. Par exemple, maintenant, vérifiez ceci. Lorsque la taille de l'application est plus petite, je veux que vous affichiez ce bouton et que vous puissiez parcourir ces pages Je dois donc créer une fonction pour cela afin que, lorsqu' il atteint cet état particulier, nous le montrions. Je dois donc ajouter le. Je dois le saisir pour pouvoir l'utiliser. Donc, à l'intérieur, j'ai besoin un d' un code du mauvais . Donc, ce lien doit être importé depuis le si vous avez des symptômes dessus, vous pouvez importer ce truc directement en utilisant l'onglet que vous devez importer pour mettre du laiton cyclique Depuis le grenier , celui-ci sera donc le logo, le logo de l'application, ce logo en particulier. La façon dont je l'enveloppe dans des liens de telle sorte que lorsque je clique sur le logo depuis n'importe quelle page, je peux également revenir à la page. Alors permettez-moi de mettre du style sur chacune d'elles. Je fais le correctif pour que le Na soit toujours au top, même quand je fais du scaling sur Naver, nous existons simplement sur la Donc, le fait que le lien signifie que lorsqu'ils cliquent dessus, où est-ce que je veux aller ? J'ai envie de sauter. Alors permettez-moi également de lui donner un peu de style. Et pour le nom de la classe d'image, le I devrait être le logo lui-même, le logo lui-même. J'ai besoin d'importer. C'est le logo que je souhaite utiliser et faire exporter ici afin que je puisse l'appeler de n'importe où. Il me suffit donc de l'exporter. Permettez-moi d'appeler cela un logo ici. Vous pouvez donc voir l'importation automatique Ce sont des importations visuelles de stud pour moi. Voyons donc si cela fonctionne réellement avec notre application. Vous voyez que nous avons le logo ici ? Il reste donc le n dans la barre de navigation et les autres liens. Donc, je dois également créer le bouton de telle sorte que lorsqu' ils utilisent un formulaire mobile, le bouton s'applique. C'est donc ce que je veux créer maintenant. J'ai donc besoin de l'icône, c'est l'icône à points, tu sais. Euh, cette icône en D. Donc, en gros, ça va être dedans, vous pouvez vérifier les icônes zéro. Il existe de nombreuses icônes que vous pouvez voir afin de pouvoir le copier et simplement l'importer dans votre application. Mais avant toute chose, avant de l'importer, vous devez l' installer dans votre projet. Cela signifie d'abord cette icône zéro, copiez-la et collez-la dessus. Tu vas voir celui-ci. Vous devez donc d'abord l'importer via votre terminal avant de pouvoir l'évaluer ou l'utiliser Je dois donc importer et le second est X M pour les conseils. Je peux donc aussi l'étudier. Cela signifie simplement que lorsqu'il est grand, l'écran est grand. Ces icônes devraient chauffer. Le chauffage devrait être particulièrement important. Mais quand l'écran est plus petit que grand, celui-ci Laisse-moi juste étudier le clic, je veux exécuter une fonction réglée sur mobile sur true. C'est donc aussi simple que cela, alors vérifions-le. Voyons pourquoi cela ne s'affiche pas. Désolée, il y a une erreur, donc c'est du passé. Oui, c'est le problème. Vous pouvez donc voir que le bouton apparaît. Ainsi, lorsque l'écran est petit, le bouton s'affiche lorsque l'écran est grand, le bouton ne s'affiche pas. C'est principalement ce que l'on veut atteindre avec ça. Alors, nichons, nous devons créer notre. Donc, au départ, je veux que la recherche soit moins que moyenne. Donc, à partir de la version moyenne, le problème d'écran est la chaussure de recherche. Je ne veux donc pas que cela s'affiche lorsque l'écran est petit. C'est donc principalement ce que je veux atteindre. Voyons donc quand nous affichons et c'est sur le plus grand écran que notre recherche n'est pas destinée à affichage, mais à l'affichage sur le plus grand écran. C'est principalement ce qui cause des dégâts. Nous devons donc maintenant créer nos liens. Nous avons donc pu réaliser ces jours-ci, ce que nous voulons dire, nos liens. C'est donc ce que nous allons réaliser maintenant avec cela. Donc, un autre d. Donc, à partir du d, nous allons cartographier l'objet de navigation que nous avons créé l'autre fois. Donc, pour chacun d'entre vous, vous voulez un lien. Donc, vous devez absolument mettre la clé, c' est-à-dire les objets. C'est alors qu'ils cliquent sur le point H Vous devez également le styliser. Le texte doit donc être en petite taille, en c doit être semi-gras, en tête. Donc, si vous ne comprenez pas une partie de ce truc, vous pouvez simplement le placer dessus, votre curseur dessus, montrer à quoi il correspond C. Donc, pour six en tête, cela signifie simplement une ligne verticale. C'est 1,5. C'est comme ça dans CS. Quand j'irai là-bas, je veux la couleur primaire. Je veux que la couleur soit primaire. Ce sont donc les noms que je veux porter. Peut-être que cela fonctionne bien Ils montrent déjà ce qui est empilé. Voyons ce que nous pouvons faire en définissant le style par défaut. Nom de la classe, les vols doivent être des catamarans. Je ne me souviens pas des vols qui sont saisis à temps. Suivi, large. Ce blanc de suivi signifie donc simplement un espacement entre les lettres. Donc, quand l'écran est grand, je voulais le montrer. Ainsi, lorsque l'écran est grand, l' affichage affiche cette couleur de lien. Voyons donc la couleur initiale du texte Mais n'oubliez pas pourquoi nous cliquons dessus. Celui-ci ne montre pas la liste de ce truc comme celui-ci. Pourquoi cliquons-nous dessus, en affichant la liste des fonctions, comme la liste des pages vers lesquelles nous pouvons être acheminés. Pour y parvenir après le nôtre, nous devons créer un dialogue. Donc, pour que nous puissions utiliser ce dialogue, nous devons le saisir. Nous pouvons donc accéder à ce dialogue depuis et également dans une réaction. Naissance de la ceinture, le monsieur avait le pain de la naissance de la fille. Nous avons donc réussi à créer nos numéros avec succès C'est ce que vous voyez en passant à un petit modèle. Il ne nous reste donc plus qu' à travailler sur le pied de page. Notre destin fonctionne donc. Donc, notre pied de page, nous devons travailler dessus. Donc, pour notre pied de page, nous avons juste besoin d'un processus très simple, nous n'avons pas besoin de l'importer en particulier Une section qui gère tout, cette div dont le nom est cette div dont le nom imputé à subscribe et à d'autres choses Donc, sans cela, commençons. Je vais utiliser vous pouvez le laisser D mais vous pouvez utiliser la section à la place. À l'intérieur de la section, nous avons D. Disons un bulletin d'information quotidien. Ensuite, nous avons un formulaire. Donnons-lui donc du style pour que tout ce que nous faisons ait du sens. Regardons-le. Voici donc le style et voyons à quoi nous allons ressembler. Voyons donc ce que nous voulons qu'il soit sur le W.S le W.S. Mais apporter un petit peu, ce n'est pas le cas. Il n'est pas complet comme les autres, nous avons donc juste besoin de travailler connectés une petite touche et ce sera exactement ce que nous voulons qu'il soit. Oui, donc vérifions à nouveau pourquoi cela apparaît comme un imbécile et vérifions que notre index ou CC est probablement celui-ci ou celui-ci que nous n'avons pas supprimé l'autre fois. Ce sont donc probablement eux qui croisent notre page. Laissons-les donc et étiquetons celui-ci qui fonctionne. Nous avons donc réussi à atteindre notre barre nerveuse et à atteindre notre objectif. Donc, la prochaine chose est juste notre page. C'est la page maintenant. Donc, le slider, nous pouvons imbriquer et voir différentes images, les icônes des réseaux sociaux et les différents articles de blog, le dernier article et engage le formulaire de contact et le Ce sera la réalisation de la prochaine vidéo, État. 4. Composant et page d’accueil (a): Alors on revient les gars. Donc, dans cette prochaine partie, nous allons travailler avec notre propre page et d' autres composants qui doivent être créés ou qui doivent fonctionner correctement. J'ai créé mes cinq propres fichiers, et j'ai exporté un sentinpting de votre composant, forme de pages, afin que je puisse l' appeler ici Je peux donc utiliser le fait que j'ai appelé chez moi depuis des pages et que je suis capable de les parcourir. Donc, si nous cochons le, vous voyez qu'il est déjà là. Il suffit donc d'y ajouter un petit code et de le faire fonctionner. Regardons donc les œuvres précédentes. Vous voyez ici, sur la page de celle que nous voulons suivre. Il possède un slider. Ce curseur est le composant à part entière, le composant autonome. Il a ce code, il a un blog différent. Il comporte une section de blog différente. Nous avons la politique, les affaires, la technologie, le sport, le divertissement, et chacun d'entre eux a ses propres cartes. Nous avons le bouton « et en savoir plus ». Cette carte est donc également un composant que l'on peut appeler de différentes manières. Nous n'avons pas besoin d'écrire du copier-coller dans tout. Il vous suffit de le créer en tant que composant et de le répéter pour les autres. Nous avons donc besoin de cette page de contact. Cette page de contact est également un composant. Je vais expliquer pourquoi il s'agit d'un composant. C'est un composant parce que je appelle dans sa page d'accueil, et j'ai aussi une section appelée contact, qui est la même chose. Je ne veux donc pas l'avoir peut-être après avoir écrit le code de contact. Je vais maintenant revenir à cette bière et écrire un autre code de contact Je vais donc simplement créer ce formulaire en tant que composant, et nous l'appellerons dans deux d'entre eux. Je pense que cela devrait bien fonctionner. Cela devrait donc être pour notre page de contact, notre propre page sur laquelle nous allons travailler. Donc, pour commencer, permettez-moi de commencer par créer notre composant slider Je vais vous donner le nom appelé my slider. C'est mon travail là-dedans. Pour cela, je dois installer le composant slider que nous allons utiliser dans React Il y a un slider particulier que nous allons utiliser dans React pour ne pas écrire nous-mêmes notre propre diapositive car il s' agit simplement d'un homme, pas comme une entreprise ou un blog solide veux connaître les bases du blog, donc soyez important, je dois également mettre le lien parce que nous allons y avoir ces icônes. Je veux donc cliquer dessus, il mène à une page de réseau social particulière du bloc. OK. Nous devons également importer un CSS particulier qui suit le curseur et les différentes icônes Il s'agit de notre icône Facebook, de notre icône Stagram, de notre icône, de notre icône d'entrée et de notre icône Twitter C'est donc l'ancienne icône de Twitter. Il y en a un nouveau X. Donc, vous allez juste utiliser l' ancien juste pour cela. Ce sont les CC dont nous avons besoin. Comme cela devait être utilisé avec ce composant de curseur. Ensuite, nous devons avoir un objet ou un tableau, un tableau contenant l'objet de chaque bouton que nous allons avoir, vous savez, comme un tableau est un bouton aria ou s'il a deux composants principaux à l'intérieur de l'objet. La zone comporte donc différents objets. Donc, chaque objet porte le nom et le HR. Le HF signifie le lien vers chacun d'entre eux. Donc, si je clique sur ce Facebook maintenant, cela devrait m'amener sur une page Facebook en particulier. Donc, après avoir cliqué dessus. Il doit donc avoir un nom. Le nom contiendra donc l'icône dont j' avais besoin et le lien se trouvera sous le H. Donc, je vais l'appeler cost OK. J'utilise donc l'icône. Je n'utilise pas d'icône d'erreur. Maintenant, j' utilise l'icône Vous pouvez utiliser une icône différente. Icone est également une très bonne bibliothèque que vous pouvez consulter. Et vous pouvez rechercher les différentes icônes dont vous avez besoin. Et après l' avoir recherché comme sur Facebook, vous pouvez simplement cliquer dessus et copier le code. Donc, après l'avoir copié après l'avoir placé dans cet espace. L'autre façon de l' appeler est de venir ici et de l'appeler. C' est la phase F. Donc, voici ce que je veux d' abord appeler avant de l'appeler dans le principal. Je ne vais donc mettre aucun lien. Mais juste pour s'entraîner. Laissez-moi juste dire, laissez-moi voir que la valeur par défaut est peut-être Google Dot Donc je veux chaque fois que je clique dessus. Je vais juste le copier-coller. Je vais juste copier-coller comme pour les autres et je vais juste changer la grammaire So I'm going for Twitter YouTube Insta et Linden Donc, au lieu de mettre WW dans u google.com, j'ai mis le point Web Facebook, twitter.com, tube.com Instagram.com et link in.com ne sont pas liés à un compte en particulier uniquement pour le compte Tuk in par défaut ne reste plus que les données que notre slider traitera. Vous voyez maintenant cette photo, la première photo montre dernières nouvelles, puis elle contient les détails. C'est comme par défaut et cela jusqu'à présent. Je n'ai pas de Beatle à mettre là. J'ai donc juste mis cette adresse IP là pour choquer quelque chose, quelque chose y sera bientôt Il en va de même pour le sport : une étoile se déplace d'un angle à l'autre pour chacune d'elles. Nous voulons donc placer ces détails à l'intérieur d'un objet, c'est-à-dire d'un tableau d'objets. Le nom sera donc appelons-le Slider Slider Data Je pense que c'est bon. Il contiendra donc l'URL de l'image en question ainsi que la description. La description, vous êtes simplement en train de montrer que, d'accord, cette image dont il parle peut être l' actualité sportive ou les dernières actualités sportives, peut-être Chelsea entre Mao et Chelsea, n' importe quel club de football préféré ou entre technologie, peut-être que c'est la dernière technologie disponible actuellement. C'est donc ce que celui-ci signifie simplement. Ce sera juste comme un pointeur vers So pour y mettre quelque chose. Je vais juste trouver un lien aléatoire sur Internet. Vous pouvez donc simplement vérifier celui qui correspond parfaitement à ce que vous voulez faire. Peut-être les dernières nouvelles, définir une image sur le sport, une bonne image sur les dernières nouvelles, une image sur la technologie , une image sur le divertissement, etc. Je vais donc simplement copier une partie de ce que j'ai déjà. Ensuite, je passe aux photos et aux détails qu'il contient. Donc, la prochaine étape consiste à utiliser ce composant de curseur maintenant. Je vais donc simplement supprimer les crochets de ce composant et appeler le composant slider le plus gros Donc, les composants du curseur à l'intérieur du composant du curseur, je vais avoir les données du curseur Je vais parcourir la carte des données du slider Je vais donc avoir un conseil selon lequel le développeur contiendra la clé. Je vais avoir une image. Donc, pour que l'image soit une image à points de la diapositive D. Pour commencer nous faut donc un nom de classe pour l'étoile. C'est maintenant. Nous devons être saturés. Cela signifie que nous modifions un peu la qualité pour faire ressortir un peu de beauté, pas simplement une importation normale directement depuis Internet. Je voulais être un peu saturé de 150, afin que nous puissions vérifier ce CSS normal. C'est ce qu'est le point de départ C. L'objet doit donc se couvrir. Nous avons donc un autre div à l'intérieur. Nous avons notre étiquette H one. Le H contiendra donc la description du point haut, c' est-à-dire la description des points de données de notre curseur Ensuite, ce sera notre autre application qui contiendra l'icône de chacune des applications pour chacune des sur les réseaux sociaux que nous voulons consulter. Nous devons donc marquer l'icône également les icônes, il y a une icône à l'intérieur. L'icône sera donc au format lien. Donc, si nous avons une cible vide, de sorte qu'en cliquant dessus, elle s'ouvrira sur une page complètement différente. Cela ne va pas s'ouvrir à la même distance. Et c'est là que nous voulons créer une icône. Il porte donc également le nom qui fait des points d'icône. C'est là que le logo va apparaître. Le logo va donc apparaître à l'intérieur de cet endroit. Nous devons donc styliser certains de nos travaux. Personnalisons ce modèle en H. Oh. Donc, probablement le problème est que nous ouvrons une autre définition avec un autre div. Vous êtes censé l' ouvrir dans ce de particulier que nous avons ouvert. C'est donc ce qui cause réellement le problème. Donc, la prochaine chose que nous devons commencer est ce style particulier. Style du lien. Nous devons donc commencer ce point en particulier. Donc, pour que nous puissions vérifier ce taux de participation, nous devons l'appeler sur notre propre page parce que si nous allons sur cette page maintenant, évidemment, rien ne s'affichera Nous devons donc l'appeler sur notre propre page pour que vous puissiez le montrer. Donc, avant de l'appeler, nous devons travailler là-dessus sur la page, donc, vous savez, ce texte se cache sous le nerf. Nous devons donc travailler dessus et l'agrandir un peu. Et l'écran doit être grand et couvrir l'écran. Ensuite, voyons si nous pouvons appeler le nerf directement le curseur de cet endroit Vous voyez donc comment nous l'appelons, cela s'affiche directement, mais il y a un problème, vous voyez notre terminus indiquer qu'il y a un problème Le problème se situera donc probablement à l'intérieur cet endroit, sans port de sortie. Je pense donc que cela devrait le résoudre et voyons voir. OK. OK. Nous devons donc l' installer, non ? N'oubliez pas que j'utilise le lien MPN pour le télécharger. Icône droite. L'autre icône que nous avons utilisée l' autre fois était une icône d'erreur. Je viens donc de vous présenter celui-ci également afin que vous puissiez voir comment vous pouvez utiliser différentes icônes. Tu peux l'utiliser. Je peux décider d'en utiliser un. Lorsque vous travaillez sur les projets principaux, décidez simplement d'en utiliser un pour l' histoire, considérez que vous pouvez utiliser l'icône Varios Il y a euh, il y a des polices que je Il y en a beaucoup que je peux utiliser. Cela dépend donc de celui que vous souhaitez utiliser exactement. Cela devrait donc certainement résoudre toutes les erreurs. Éblouissement. Le problème est que cela se trouve maintenant dans le bloc co, cela peut être ennuyeux à un moment ou à un Nous y avons maintenant notre icône. Remarquons quelque chose. Cela ne montre pas l'icône et le nom que nous y avons mis. Nos photos ne s'affichent pas. Vous ne pouvez pas voir l'image. Il ne se charge pas. Voyons ce qui se passe entre cela. Tout d'abord, c'est censé être un travail tout aussi génial. Ce qui retarde l' affichage de nos photos , nous l'appelons URL EMG Voyons voir si cela devrait fonctionner maintenant. 5. Composant et page d’accueil (b): Mais ce n'est pas le cas, nous sommes capables de le faire, nous ne voyons pas le bouton suivant. Ce sont les boutons qui s'y trouvent. Nous pouvons donc importer les paramètres particuliers que nous pouvons utiliser ici. Devoir introduire certains réglages. Nous l'appelons donc paramètres ou vous pouvez l'appeler réglage du curseur ou quoi que ce soit Il va donc s'agir d'un ensemble de paramètres. faut donc introduire les dizaines pour passer. Ensuite, il y a ceci et la carte. C'est certainement dans notre page d'accueil. Écrivons simplement un peu de code dans notre propre page , puis nous passons à autre chose. À l'intérieur de la section, nous en avons une Vérifions-le. Alors, quelle est la prochaine chose que nous devons faire ? Nous devons donc créer cette section différente du bloc. Donc, après la section, nous devons créer un autre di. Un séparé. Le premier est la politique, la politique en tant que premier. Nous devons donc créer un étui séparé pour tous ces dés, comme toutes les cartes qu' il contient, afin que même s'ils sont plus que cela, il le sache. Ce div fait toujours partie de V one. C'est de la politique, mais séparément des autres. est à cet endroit que nous allons avoir ce bloc dans lequel nous allons créer un composant plus tard. Permettez-moi d'en rester là maintenant. OK. Donc, après cela, nous avons un bot botin qui lit plus. Donc, il suffit de lire le bot qui se trouvera dans un lien qui. Donc, pour que nous puissions l'utiliser, je suppose que nous devons l'importer. Donc, permettez-moi de dire que ce sera certainement blog que nous allons travailler avec notre n. Pour la politique, voici le lien pour la politique. Nous avons créé ce qui sera certainement le cas plus tard. Donc, si nous remarquons que nous avons une flèche. La flèche doit être importée depuis une icône de flèche ou une icône. Vous pouvez donc choisir qui vous voulez. Nous devons également le styliser et nous allons également styliser notre bouton et vous en donner un peu Donc, l'icône que nous allons utiliser , nous allons utiliser Vous pouvez également démarrer l'icône, dites marge à gauche. Nous ne voulons pas que vous vous en teniez au nom, en partie. Donc des sommets émergents qui se rejoignent. Voir 0.5. Alors, vérifions-le. Tu peux voir ? Nous l'avons déjà. Mais à cause de cela, il n'y a pas de carte entre les deux, c' est là que tout est bloqué. Nous avons donc une carte en particulier, la carte que nous étions censés avoir et qui ne se ressemblera pas. Ce sera dans un endroit séparé. Je dois donc le répéter également pour. C'est pour les affaires, la technologie, le sport et le divertissement, ce que je vais faire maintenant. Je répète donc la même chose pour les autres. Ces idées signifient simplement de l'identifier dans un livre d' identité distinct. Tout carnet d'identité endommagé constitue une section distincte à part entière. Nous avons donc maintenant différentes sections. Nous devons créer la carte qui sera utilisée. C'est cette carte. Nous devons créer cette carte. La première chose à faire est créer un composant pour la carte que nous importons à cet endroit. Le composant de la carte utilisera donc des accessoires dans React. Il s'agit probablement simplement de transmettre certaines valeurs à l'intérieur d'un composant sur une page séparée C'est donc ce que nous allons simplement utiliser. J'ai besoin de créer un autre fichier appelé carte de blog. Donc, en tant que juge. Nous devons donc déclarer que le composant sera un certain accessoire. Alors, quels sont les accessoires dont nous avons besoin pour qu'il soit accepté ? Il nous faut le titre. Il est temps de savoir si nous vérifierons ici. Nous avons l'image, il s'agit de l'ajout du titre deux, de la description. L'ajout et les types qui sont différents. Le titre peut être le titre « technologie ». L'ajout est donc destiné à orienter le client pendant une activité assurez-vous que la description correspond aux données et à l'heure. C'est donc principalement ce dont nous avons besoin dans la description notre image, UR Auto. OK. Cliquez. Lorsqu'ils cliquent dessus, nous devons effectuer une action spécifique. Donc, sous cliquez également et heure. Voici les sept principaux accessoires que nous utiliserons. Vous pouvez donc ignorer le message d'erreur en manquant la validation de l'accessoire Nous n'avons donc pas vraiment besoin de dater , c'est un tout autre problème. Nous devons donc créer notre intérieur. Nous devons créer une balise d'image. Le C sera donc cette image UR. Après cela, nous avons besoin d'un autre dé. Nous avons besoin d'un autre agent pour parler du Tyson Okay. Ensuite, il nous en faut un autre il y a un paragraphe qui parle de la description. Après cette plongée dans le div, vous avez besoin d'un paragraphe deux. L'un d'eux parle de l'automobile. Et le second parle du temps. OK. Et on a noté ce format horaire. Vous devez travailler dessus pour que , lorsque vous aurez le temps, vous ne vous trompiez pas, il n' affichera pas de données invalides car vous devrez formater l'heure. Vous devez le formater comme il est censé s'afficher. Mais nous utilisons principalement des données par défaut. La base de données ne nous donne pas vraiment de temps pour le moment. Nous allons donc laisser les choses comme ça pour le moment. Donc, à l'intérieur de ce paragraphe, nous avons besoin de la durée. C'est donc au cours de cette période que nous avons le temps. Nous devons donc le styliser évidemment. Parce que si nous vérifions ne pouvons pas le voir maintenant parce que nous l'avons publié. Donc, planifiez, nous avons besoin qu'il soit flexible pour être précis. Quoi ? Donc, de ce côté, vous pouvez simplement l'importer avec celui-ci. Donc, à l'intérieur de l'un de nos t, vous pouvez le sortir. La première est que si la pièce peut se rétrécir, cela signifie que la carte montre la carte, mais elle ne s'affiche pas correctement car nous devons y transmettre certaines valeurs. Vous devez y mettre quelques accessoires. Et pour que nous puissions l'endommager, nous devons disposer de certaines données à tester C'est pourquoi j'ai déjà ces données sur GSX. Ce sont donc les données que nous utilisons simplement pour les tester. Un exemple de blog différent. C'est la même répétition, mais j'aime bien l'utiliser pour tester le retour en attente, que nous allons relier aux factures d'incendie et simplement tester de manière appropriée. Je dois donc importer ces données dans mon réacteur ici. J'importe donc tout du meilleur côté. Je dois donc le cartographier à l'intérieur de cet endroit. Je vais donc appeler le premier polwsp d'actualité politique dedans, je vais passer à autre chose Je vais donc passer par le cartographier et l' appeler post the index. Donc, à l'intérieur de cet endroit, la clé sera l'index. Ensuite, je vais transmettre les données. Ce sont toutes les informations nécessaires pour passer cet appel. Ouais. Ensuite, le clic sous cliquez pour le moment sera simplement vide. Disons de n' effectuer aucune action. Disons que cela fonctionne peut-être réellement dans notre P. Wow. Tu vois que je travaillais parfaitement. Nous testons donc avec nos données forcées. Nous devons tester les technologies commerciales. C'est donc essentiellement la même chose que vous allez faire pour copier ceci. Ce droit. Passez à la politique. Allez dans le monde des affaires et transformez la politique en affaires. OK. Tu peux voir. Nous avons maintenant un joli bloc pour une belle page de blog. Alors maintenant, nous remarquons que si vous consultez certains sites de blocage, vous n'affichez pas tous les blocs par tonnes. Vous n'affichez pas toutes les actualités en tonnes. Donc, après en avoir affiché quelques-uns, nous avons simplement placé ce bouton telle sorte que lorsque nous effaçons ce bouton , nous puissions accéder à la page appropriée que nous devions trouver. Pour ce faire, nous devons donc découper les données. Les javascripts contiennent une fonction qui permet de découper les données Ainsi, là où vous tranchez, vous pouvez le faire glisser de zéro à 30 à quatre, de zéro à cinq, c'est-à-dire les cinq données parlantes. C'est principalement ce que c'est. Alors voyons voir. Donc, en gros, nous allons simplement sélectionner trois ou quatre premières données Donc pour celui-ci, il suffit de dire slice. 04. Sta I put au lieu de st Vérifions-le maintenant au lieu des six données, le simple fait d'en montrer quatre peut les réduire au Yeah Passons donc à l'histoire. Vous pouvez donc le copier et le coller également. Alors, répétez-les toutes. La prochaine étape est donc la page de comptoir , que nous allons aborder avec une fonction maternelle dans la vidéo suivante. 6. Page de conception, détails du blog: Bienvenue par les gars. Dans cette section du cours, nous allons créer ce formulaire de contact qui sera un composant que nous appellerons dans cette partie de cette page d' accueil et également dans la page de contact. Ensuite, nous traiterons des détails de la vue. C'est alors que nous cliquons sur cet endroit, que nous voulons qu'il affiche les détails du blog et que nous pourrons appuyer sur la touche retour pour revenir en arrière. Nous y trouverons donc le sujet, les données publiées, ainsi que des informations à ce sujet et à propos la voiture par laquelle cette personne les a publiées. Ensuite, nous travaillerons avec des amis, pages très différentes de chaque section. Nous aurons donc la page spot, la page politique, la page commerciale, et la page sur la technologie et le divertissement. Donc, tout d'abord, travaillons avec notre quatrième contact. Pour commencer, vous devez créer un fichier de contact GSX dans votre dossier de composants Donc, après avoir tapé le RF CU. Sting, tu l'as sur ton système. Nous devons donc créer tout notre Dpcpris. Ce dont nous avons besoin maintenant, c'est cet en-tête et d'une zone de texte différente dans laquelle le bot est inséré avec d'autres informations consignant l' intérieur de la zone de texte Nous avons une autre profondeur à l'intérieur Nous avons une autre profondeur C'est donc en profondeur que nous avons créé cette boîte orange. Donc, à l'intérieur de notre H, il a un H qui dit « engager ». Ensuite, nous avons le formulaire. À l'intérieur du formulaire, nous avons un di di, un autre di. Ensuite, nous avons une étiquette qui sera le prénom. Prénom. Après l'étiquette, nous avons l'impute qui sera la zone de texte. À l'intérieur de l'entrée, nous avons le et placé dessus. Donc, cette imputation se trouvera également à l'intérieur du. Donc, après cela, j'ai juste besoin de tout styliser parce que vous allez juste copier et coller sur d'autres aspects. Je vais juste le copier-coller, copier et le coller dans les autres parce que nous avons une structure et un design similaires. OK. Donc, après l'avoir créé, l'essentiel est de le copier , de le coller et de le dupliquer. Comme essentiellement la même chose qui va s'y trouver. Enfin, il suffit de recréer ceci et nous allons mettre les deux pour que vous puissiez bientôt comme ça Nous avons donc cet e-mail et un message. Nous passons donc au nom de famille. Donc tu peux le dire. Ensuite, nous avons besoin de notre section de carte, de cette boîte de cartes. Mais par e-mail, nous pouvons copier et coller celui-ci et simplement modifier quelque chose sur notre design. Nous pouvons donc le copier et le coller, pour que ce ne soit pas dedans , moi, mais à l'extérieur. Il en faut un autre. Oui, monsieur, c'est censé être le cas. Oui. Nous changeons donc cela en courrier électronique. Oui. Nous devons donc modifier cet endroit et y mettre un peu de style. J'ai besoin d'étudier D donc juste pour suivre ce qui se passe ici. Nous pouvons l'importer notre page « comment », puis nous effectuerons peut-être un suivi et verrons ce que nous faisons. Donc, avant le dernier type, nous pouvons voir le contact. OK. Supposons que notre navigateur dépose des pots. Oui, navigateur. Vérifions-le peut-être. Oui. Tu peux voir. Nous avons donc déjà les enclenchements, la zone de texte , le tag et le m. La prochaine est donc juste la boîte de message. C'est le thé. Ensuite, nous allons aborder quelques détails à ce sujet. Donc, le texte du message est similaire à Ce message électronique le fait au lieu de saisir des modifications dans la zone de texte. Cela va donc être un peu important. Donc, lorsque l'identifiant et les autres éléments sont similaires. Nous avons juste le règlement, laissez-moi vous le montrer. Nous avons donc la règle selon laquelle cet endroit sera plus grand que les autres pour le message. C'est donc ça. Ensuite, nous avons besoin du bouton du bouton d'envoi et de ces deux informations. Donc pour le bas, nous avons besoin du DV après le pliage, nous avons besoin de la TVA, le côté filet se trouve, il nous faut un bouton et ça envoie Nous devons le styliser avec des substances. Vérifions-le. Nous avons donc un bouton ici. Non, vous avez juste besoin des deux cartes restantes en dessous. Ce sera après l'automne que nous ferons une autre plongée en dessous. Fais un autre d. Ce sont deux plongées différentes maintenant. À l'intérieur de cette trempette, nous avons deux trempettes différentes. Nous allons donc d'abord faire le premier. À l'intérieur du premier plongeon, nous avons besoin d'un SVG, d'un SVG. Je vais juste copier une partie SG à l'intérieur. Et après le SVG, nous avons besoin d'un autre de. Je vais vous donner quelques détails Un H six dit. Et nous avons le tag P qui est un chiffre en plus. Je vais juste le mettre parce que je ne veux pas y mettre un certain chiffre. Laisse-moi juste copier-coller le fond de cet endroit. C'est donc du SVG. Nous devons donc donner du style à cet endroit. Donc pour la deuxième plongée également. Ensuite, plongez avec le SVG Ce G est principalement un téléphone, laissez-moi juste vous montrer que nous l'avons déjà. La partie SVG que nous importons est cette icône de téléphone. Vous pouvez utiliser un certain nombre d'icônes. Je pense que c'est ce que j' ai déjà utilisé auparavant, mais... Continuons au lieu de G, vous pouvez simplement importer une icône de téléphone à partir d'une icône ou n'importe qui pour cela. La prochaine étape est donc de copier ceci et de le répliquer à nouveau, jusqu'à présent Il y aura donc un format SVG différent pour le courrier électronique. Encore une fois, au lieu d'utiliser ce SVG, nous pouvons utiliser une icône d' utilisation différente au lieu du SVG Le clip SVG, alors je ne sais même pas si je l'utilise. Mais je pense qu'une icône est préférable à G. Donc, lorsque vous regardez ceci, ne vous embêtez pas à le copier et allez directement à l'icône I et mettez-la à cet endroit. Donc pour celui-ci, je peux simplement utiliser le contact. Je pense que cela devrait faire tout ce que nous devons faire ici. Alors vérifions-le. Oui. C'est généralement ce que nous devons faire. Au lieu de visiter, mettez simplement un nombre aléatoire. Cela me ressemble d'une manière ou d'une autre. Nombre électriquement aléatoire. Je pense que nous en avons terminé avec la page de contact. Il nous suffit donc de le mentionner également sur notre page de contact. Nous en avons terminé avec le formulaire de contact, il faut donc le mettre sur notre page de contact. Même chose. Comme nous l'appelons dans nos propres pages nous allons l'appeler dans la page de contact. Nous arrivons donc sur nos pages et cliquons sur « Créer un nouveau fichier » et nous l'appelons «   contact page 6 ». Comme d'habitude, vous devez l'exporter dans l'index vers G à l'intérieur de celui-ci . Donc, à cet endroit, appelez simplement les contacts du composant. Ensuite, nous arrivons à notre x et l' exportons ici pour que le lien chaque fois que nous cliquons sur le lien du contact, ouvre cette page. C'est ça. Cette sortie. Donc ça devrait aller, voyons voir, peut-être que ça va marcher. Ce sont donc des pages. Cliquons sur contact. Nous avons déjà une page de contact. Nous n'avons donc pas besoin de créer à nouveau le formulaire sur notre page de contact, il suffit d'appeler le composant. La prochaine fois, il n'y aura plus que la fonction clic du z. Donc, souvenez-vous que dans notre carte, nous avons déjà une fonction appelée ouvrir au clic. Nous avons donc juste besoin de retourner chez nous partout où nous l'avons en cliquant sur « Non », nous devons y transmettre une fonction. La fonction qu'il nous suffit de passer là-bas est donc naviguer. Nous devons utiliser la navigation libre dans un composant de réaction ou une fonction de réaction, cela s'appelle « us navigate ». Faisons-le donc en une seconde. OK. Permettez-moi donc de vous expliquer à nouveau clairement ce que nous devons faire Donc, ce que nous voulons que vous fassiez, c'est cela lorsque nous voulons utiliser l'état comme coût de fonction. C'est pourquoi nous cliquons sur ce bouton So be using location, c' est-à-dire un composant de réaction, un emplacement d'utilisation et un navigateur d'utilisation. C'était donc simplement un hook qui renvoie les objets de localisation actuels. Cela peut être utilisé. Cela peut être utile si vous souhaitez créer un autre effet de diapositive chaque fois que la page en cours change d'emplacement. Cela signifie que nous pouvons transmettre les données d'une page en cours à une autre page. J'utilise cet emplacement. À partir de cette page, lorsque je clique sur un autre lien, je peux transmettre certaines données de cet endroit à une autre page Mes notes semblent donc claires maintenant, mais lorsque nous commencerons à écrire, les capsules seront plus claires. Tout d'abord, nous avons besoin de notre page qui s' appelle blog detail. Ce sera le détail du blog. Ce serait une page. Nous le créons afin de ne pas créer une nouvelle page pour chaque détail que nous voulons consulter. Il suffit d'en créer un seul, puis parcourir pour que d'autres puissent l'utiliser. Donc, dans ces détails de vue, pour les jardins, c'est dîner à mes côtés actuellement à ce stade, nous devons donc importer certaines choses. Donc, comme je l'ai dit plus tôt, nous allons utiliser use navigate, use location et state. Il s'agit donc simplement de transmettre des données d'une page à l'autre. Donc, tout d'abord, nous devons avoir à l'intérieur de cet endroit un coût d'utilisation égal à celui des entrées fonctionnelles dans s par rapport au soi là-bas. C'est donc le lieu dans lequel nous naviguons et nous avons également besoin du coût de cet emplacement utilisé. Ce sont donc les deux principaux que nous allons utiliser. Ils utilisent donc les navigateurs lorsque je clique sur le bouton de retour pour accéder à la page précédente et utiliser la localisation, c'est comme les données que j'ai transmises d' une autre page, afin que je puisse me débrouiller pour les utiliser à cet endroit Donc, à l'intérieur de cette page, je déciderais , je veux que cela apparaisse. Ainsi, chaque fois que je clique sur des données transmets simplement la valeur à l'intérieur, ce qui me simplifie. Donc, dans les détails du bloc, je vais concevoir les zones. Je vais dire l'image par le titre et l'autre t. Donc, tout d'abord, je dois créer cette astuce, sera toujours là. Ensuite, à l'intérieur, j'ai besoin d'une autre image , d'un tig d'image, puis un autre plongeon vers H  ; je vais inclure le titre Celui-ci, je dois juste passer le point d'état. Vous voyez ? Nous devons donc vérifier ces données et voir la variable que nous utilisons pour nous en convaincre. Nous utilisons donc l'image. Donc, lorsque nous revenons et que nous disons «  image » pour désigner l'art, vous pouvez mettre n'importe quoi, cette image ou quoi que ce soit d'autre. Ce sera l'égalité entre les États afin que nous puissions l'appliquer aux sites où nous pourrons suivre ce que nous faisons. Donc, la deuxième fois, nous avons besoin d'une balise p, d'une balise de paragraphe dont nous avons mentionné la date publication pour dire «   publié le », puis nous avons notre balise disons plus doucement que nous avons besoin d' une autre balise comme description de l'état. C'est un court paragraphe sur le blog. Nous avons à nouveau besoin du tag P pour afficher les détails. Voilà les détails sur le You remember, Mr. Is censé être entre parenthèses, le plaisir est comme une variable. Vous ne pouvez donc pas simplement p comme ça, 2000 pour être à l'intérieur du support en polyéthylène . Ensuite, il y aura des détails Je vais vous montrer tous les détails à ce sujet. Après cela, après ce pgm, nous avons besoin d'un intervalle. Nous avons besoin d'un bouton comme celui-ci pour dire « revenir arrière » afin de pouvoir accéder à la page précédente Regardez si je clique sur un blog, je clique sur Retourner, je reviens à la page, reviens à la page p d'où je viens. C'est donc ce que nous voulons atteindre. Nous pouvons donc fermer celui-ci maintenant et dire span, mettons-le dans un span. Donc, dans un laps de temps, nous devons revenir en arrière. Nous avons donc besoin d'un coup de pouce. C'est ce bout de chariot à disque. Nous pouvons donc simplement obtenir cela par le biais de notre action. Voyons donc à gauche. Il pointe vers la gauche, non ? Cherchons donc celui qui le voit l'utiliser. Donc, il suffit de le copier avec les noms. Nous devons mettre ici une fonction qui, en cliquant, cliquez. Donc, quand je clique simplement sur WhatsHpf maintenant, vous mettez une fonction qui ne devrait pas Ensuite, nous avons besoin d' un autre congé sur lequel nous indiquons le nom de la voiture. C'est la voiture. Pour nous, nous avons besoin de cette ligne. Ensuite, nous avons besoin du nom de la voiture. Donc pour la ligne, nous pouvons simplement dire HR, mettre au lieu de celui-ci, laissez-moi juste mettre une profondeur puis cette profondeur. Je vais maintenant dire der up, c'est border up, puis je vais mettre un test particulier dans le style. Donc, à l'intérieur, il en faut un autre. Donc, celui-ci n'a qu' à naviguer moins un. Donc, en tant que fonction, nous devons faire cette navigation moins un. Donc, pour l'utiliser maintenant, nous devons nous rendre partout où nous tirons ces cartes. Donc, en plus de cela, nous devons naviguer. Vous devez financer la navigation. Nous avons donc besoin d'une fonction, une fonction appelée navigate égale à post. Nous avons donc besoin d'un rappel , d'un argument à passer à l'intérieur de celui-ci. Ce n'est donc pas l'argument que nous avons décrit. Nous disons donc naviguer. Ce dépôt permet donc de manipuler l'URL. Si nous vérifions cela, si je reviens à une page maintenant, et que je clique dessus sur le point technique, je clique dessus, ce sont les détails du blog, alors, certaines valeurs en sont tirées : comment naviguer chez le client, donc comment naviguer chez le client afin que tirées : comment naviguer chez le client, vous puissiez le voir. Il n'est donc pas nécessaire de le mettre à l'intérieur. Nous disons donc slash blog. Donc, les détails du blog que j' écris doivent être en corrélation avec tout ce que je viens ici, ils doivent être corrélation avec tout ce que je mets dans cet endroit Donc, quand je publie celui-ci maintenant, les détails du blog, et je le dénonce. Ce que je veux dire, il veut simplement que je veux parcourir les détails du bloc. Cet identifiant, cet identifiant de colonne que j'ai mis, signifie qu'il ne s'agit pas d'une page statique, mais d'une page dynamique que toute valeur représentée par cet identifiant peut être détruite, puis nous pouvons utiliser la valeur C'est donc ce que nous utilisons ici. Donc, la valeur transmise par l'ID est celle que nous pouvons détruire par le biais de l'État et que nous pouvons utiliser à cet endroit Donc je continue et les détails coupent ça. Vous savez, si vous l'utilisez, vous devez l'utiliser pour déformer le titre du message. Et après cela, vous appelez maintenant l'État américain dans la même colonne de vente, vous dites virgule, j'ouvre le crochet froid et je dis C'est donc la principale chose dont nous avons besoin maintenant. État de la date de publication du calendrier. Cela signifie que la valeur qui a été transmise, vous la transmettez aux États-Unis. Chaque fois que nous appelons state, nous pouvons facilement vérifier toutes les valeurs contenues dans cet article. Je pense que c'est clair. Maintenant, il vous suffit d'appeler cette fonction dans tous les aspects que nous utilisons null. Alors montrez que nous disons non, nous devons le changer. Je sélectionne donc tout en même temps et je dis, supp est la fonction, nous devons la transmettre comme ça Donc, lorsque je sélectionne ceci et je vérifie qu'il s'agit bien des cinq anders, c'est correct. J'utilise le changement de contrôle L. Donc , lorsque nous sélectionnons quelque chose qui est nul dans ce code, je peux tout modifier en même temps. Donc, si je l'annule, je peux tout modifier en même temps. Cette fonction a en fait besoin d'un argument post. N'oubliez pas ce que nous faisons passer pour un message, vous pouvez donc simplement publier. Pour chacun d'entre eux, chacun d' entre eux a son propre poste. Vérifions-le maintenant et voyons peut-être que cela fonctionne. Oui, la flèche vient d'ici. Rien de tel que naviguer. Nous devons donc d'abord faire cela même manière que la navigation, l'aviation. Voyons voir. Disons que cela ne fournit pas de vous devez dire que c'est le problème. Désolé, j'utilise le navigateur. Exactement. C'est là le problème. Il n'y a rien de tel que d'utiliser la navigation. Voyons donc si je clique dessus, j'ai mon bouton d'affichage, vous remarquerez que l'URL change également. Et si je clique sur revenir en arrière pour revenir à la page précédente. Nous avons donc juste besoin de le styliser avec du CSS, comme notre vent. Alors vérifions-le maintenant. Nous devrions concevoir davantage de mode. Cherche à s'étendre comme celui-ci. Voyons donc d'autres choses que nous pouvons ajouter au. Oui, je pense que l'erreur est exactement que nous en avons une ou plusieurs fantaisistes parce que nous montrons notre description. Voyons voir. C'était bien. 7. Section blog et page de création de blog: Salut, bon retour, les gars. Donc, dans la prochaine partie de l'histoire, nous allons juste traiter de la page des différentes sections de blocs, et nous allons créer notre page de création de blocs. Celui-ci ne fait pas partie du bouton, nous expliquons qu'il est possible qu' aucun bouton ne soit mis à l'extérieur car lors de la création d'un blog, seul l'administrateur a le poison nécessaire pour créer un blog ou quelqu'un qui a donné accès à la création d'un blog n'est pas n' importe qui qui va simplement y aller et coller n' importe quoi en ligne C'est pourquoi ce lien se dirige. Uniquement pour ceux qui ont besoin de le voir. La prochaine partie que nous allons faire maintenant consiste à créer une section différente du blog et à créer une page de blog. Ce que nous allons principalement faire ici, c'est cet autre projet que nous avons fait pour lequel nous avons un code général. Que nous acheminons maintenant à travers différentes pages ou différentes données. Nous allons lui transmettre différentes données pour qu'il les affiche. Il s'agit donc d'un code simple qui fonctionne fois pour le sport, la politique et les affaires, que nous modifions est basé sur le fait que nous changeons l' image du nom et des données qui peuvent y être transmises en fonction de la catégorie à laquelle ils appartiennent Donc, sans plus attendre, Dugg a commencé et exécuté cette simple ligne de code , puis nous en avons fini avec cela J'ai donc créé ma page de section de blocage, est-ce une page de section de blocage, et aussi ma page de création de bloc, je l'ai portée ici et j'ai créé un lien pour elle ici. Donc, après avoir également créé la page de section, nous devons encore la lier à notre bouton en savoir plus. Donc, si nous vérifions maintenant, si je clique sur ce bouton politique en savoir plus. Il faut donc aller sur la page politique. Nous allons donc faire celui-ci également. Donc, après avoir créé la page et l'avoir liée, commençons à écrire notre code. La maintenance dont nous avons besoin est donc un de normal qui comprend tout, un plongeon comprenant l'image, le texte qu'elle contient et cette carte-bloc. Non, nous avons déjà une carte bloquée , nous allons juste l'appeler. Alors maintenant, sur notre page, vous trouverez le générateur dont nous avons besoin. Nous avons donc besoin d'un autre de ce div est celui dans lequel nous portons l'image. C'est celui dont nous transportons le texte. C'est la marque noire teinte noire ou la petite marque noire délavée qui porte le texte, ce texte, etc. Laisse-moi partir. Nous en revenons encore à cette question, pourquoi je dois commenter comme ça. Maintenant, dans cette catégorie, nous laissons apparaître une fonction ou une variable qui est un point de clic. C'est une actualité commerciale test, click on business est une actualité commerciale test. Donc pour l'instant, je n'ai pas de fonctions de grader, c'est pourquoi je les ai simplement mises dans une chaîne dont je n'ai pas besoin Nous avons donc plutôt besoin d'un six. Celui-ci est un Vous pouvez compter sur nos actualités manquantes, rester informé et rester inspiré. Vous allez à la source des dernières nouvelles sur les sites, c'est tout. Après cela, nous avons maintenant besoin de la profondeur qui comprendra les détails du blog. C'est une carte de blog. Donc, à l'intérieur, il en faut un autre également. Nous devons donc appeler la fonction blodard have some dont la clé est égale à index Je vais lui transmettre la publication et cliquer sur être égal. Ce sera donc la fonction que nous avons utilisée la dernière fois. Alors pourquoi ils cliquent sur une carte bloquée en particulier, si vous ouvrez les informations que nous lui envoyons en les publiant. Nous allons donc les publier parce que nous ne créons pas la fonction nécessaire. Tout tourne donc autour de ça. La prochaine chose à faire est donc de le styliser et de le rendre joli. D'accord. Donc pour celui-ci, je vais le mettre dans ce type de chaîne. Dan, je veux lui passer une variable à l'intérieur. Cette profondeur sera donc celle qui portera l'image. Je vais donc continuer à travailler sur la fonction image ci-dessous. Il va donc porter l'image que je peux transmettre à l'intérieur de cet endroit. Donc ça va être Donc c'est un peu transparent. Donc, si vous en prenez note , s'il vous plaît, je passe dans la catégorie. Comme celui sur lequel j'explique l' heure à propos des détails des blocs. Je lui transmets cet identifiant. C'est comme ça que je l'appelle. L'ID est la catégorie. Celui sur lequel je clique sera celui où les détails qui seront affichés lipo seront ceux que nous avons montrés Revenez donc à votre, je pense que nous n'avons pas mis cette barre oblique. J'ai mis ce dernier point là parce que ce n'est pas le cas. Je ne veux pas la jambe soit quelque chose que je devine visuellement. Vous n'y mettez peut-être pas cette barre oblique, mais je peux mettre une barre oblique cet endroit, il suffit de mettre une barre oblique pour Pourquoi cliquons-nous dessus ici. La catégorie que nous allons passer sera celle que nous affichons. Alors je parle, j'ai mentionné quelque chose à propos de l'image à l'époque. Donc oui, je veux connaître la technique de cet endroit, si nous voyons que la politique montre l'image de la politique, Click Sports montre une image sportive, Click Business montre une image liée aux affaires. Donc pareil pour répliquer en même temps pour répliquer. Je ne veux pas juste avoir la même image pour tout. Cela signifie donc que je vais créer, une fonction appelée ici GG BG signifie image de fond, n'est-ce pas ? Donc, il va recevoir un argument dans une catégorie. Il va donc y avoir une fonction de commutation, il devrait être familier avec switch en Java Script, switch si le cas est politique, si la catégorie est politique bclion politics Donc, une image particulière. Cela renvoie une image particulière. Je vais juste copier. Donc c'est du business, cliquez sur business, une image en particulier est renvoyée, cliconspot a déjà le lien Si vous revenez à notre page d'accueil, c'est le même lien que nous allons toujours utiliser pour accéder à notre slider, désolé C'est toujours la même image que nous avons utilisée ou cette image que nous avons utilisée et que nous allons toujours utiliser. Il suffit de copier celui pour la politique pour les politiques, celui pour les affaires pour les entreprises. Ensuite, vous renvoyez une valeur par défaut. 84 dégâts. Si cela ne fait pas partie de tout, nous devrions renvoyer une distance vide. Nous n'allons donc pas appeler cette image maintenant. Nous allons donc appeler cette image à cet endroit «  put », puis nous allons transmettre les données de catégorie. Nous ne pouvons donc pas passer la catégorie maintenant parce que nous n'avons aucune fonction créative. Allons-y et créons les fonctions nécessaires à cet endroit. Pour continuer, nous devons donc importer toutes nos données. C'est donc ici que nous allons obtenir les détails dont nous avons besoin. Nous devons également importer use per, nous devons importer use navigate. C'est ce que nous utilisons lorsque nous cliquons sur une carte de blocage particulière pour afficher les détails. Alors, de quoi avons-nous besoin maintenant pour ne pas simplement répéter ces choses Nous pouvons simplement copier celui-ci. Ensuite, nous avons besoin d' une autre variable appelée part. Égal à une utilisation par utilisation par dose Si vous cochez cet endroit, je passe la catégorie. Donc, pour cette utilisation, il suffit de vérifier les liens et de vérifier la valeur particulière que j'ai transmise en tant que catégorie, puis de saisir celle-ci et d'obtenir les données correspondantes. La prochaine étape est donc juste une fonction d'effet d'utilisation. Donc, dans celui-ci, nous avons une fonction de taille qui indique «   News sélectionnées » . Dans ce cas, nous stockons la valeur de la nouvelle autorité de certification sélectionnée dans un R. Nous avons donc un commutateur. Changez de catégorie de valeur. Donc, comme cet autre que nous avons ici, mes adjoints. Donc, à l'exception des liens, je vais vérifier et modifier les liens. Donc, si c'est de la politique, je veux sélectionner les actualités. Je suis sélectionné, des nouvelles équivalentes aux actualités politiques nuisent à ces actualités politiques. C'est donc un tableau, donc je peux y obtenir les valeurs. Puis fais une pause. Donc, la prochaine fois, contenez pour les affaires. Donc, s'il s'agit d'une valeur par défaut, dégâts s' il n'y a rien, vous passez un tableau vide. Ensuite, nous aurons affaire à Spot, donc je pense que nous avions S. Nous devons donc le supprimer. Après cela, après ce boîtier Switch, nous devons donc configurer notre blog. Dégâts, vous devez créer un bloc de co-set d'état. Donc, indiquez que celui-ci sera défini. Donc, définissez le blog, la valeur du blog défini sera simplement ce qui se trouve à l'intérieur du nous sélectionné. Si vous utilisez un vecteur, vous devez transmettre un signal particulier pour qu' il commence à se recharger en fonction du changement de catégorie Alors maintenant, après cela, nous pouvons maintenant utiliser notre catégorie Yeah. Vous pouvez maintenant supprimer la colonne et l'utiliser avec succès, puis à l'intérieur de celle-ci, s'il vous plaît. Donc, ce que nous devons faire ici, c'est marquer deux blogs différents qu'il propose. Donc ici, nous pouvons voir une marque de blog Donc je pense que notre bloc devrait fonctionner. Nous devons donc transmettre cette fonction également à cet endroit. Ce nom est donc également le second. Je pense que cela devrait faire fonctionner notre application et lorsque nous cliquons sur un blog en particulier, nous devrions avoir notre point de vue. Revenons donc à et voyons voir. Laisse-moi essayer Click Spot. Il diffuse des actualités ponctuelles et pouvez-vous voir le lien ici, cliquer sur politique, pour afficher celui consacré à la politique. Si je clique sur la technologie, et si je clique sur l'une d'entre elles, le d. Si je clique sur retour, pour montrer cela, mais que s'est-il passé, notre image ne s'affiche pas. Voyons donc pourquoi notre image ne s'affiche pas. Donc, pour l'image qui ne s'affiche pas, vous pouvez simplement revenir et modifier le CSS en cela. Alors, ouvrez le style, n'est-ce pas ? Je vais donc avoir une étoile égale à celle-ci. Nous pourrons donc écrire l'image par sol, par grand format et la distance. Donc, si nous revenons à votre page, vous pouvez voir pour les spots, les affaires, les despotes La prochaine chose est donc notre page de blocage, cette page que j'ai déjà créée. La page de blocage CS est similaire à notre page de contact, au formulaire et à tout le reste. Elles sont en fait différentes. Nous allons donc simplement suivre la phrase de notre page de contact comme celle-ci. Ils s'y rendent et copient d'ici, le rapport également. Prêtre. Ouais Donc, pour que nous puissions donner suite à cela, nous pouvons simplement aller sur notre lien et suivre le lien que nous utilisons pour bloguer. Vous pouvez copier voir si nous revenons à notre blog normal, nous voyons le blog res, bloquez I deux. Nous avons une liste des catégories, les détails de la description et le lien vers l'image. Ensuite, nous avons des robots qui installent toutes les choses que nous devons corriger . Donc, au lieu des deux, c'est censé être une et d'autres choses. Commençons donc par cela. Le premier concerne donc les détails d'un blog. Nous revenons donc à notre truc , où nous sommes : prénom et nom de famille, non ? C'est ainsi que nous avons le destin de notre blog. C'est ainsi que nous avons le destin de notre blog. Nous devons donc supprimer ce qui se trouve sous le téléphone et le remplacer par. Oui Nous devons donc travailler sur cette catégorie. Pour cela, pour la catégorie, nous avons besoin de notre liste de catégories, puis nous la transmettons dans nos fichiers. Donc, pour la catégorie au lieu de la première pour laquelle nous avons le temps, nous allons la modifier. Nous avons maintenant une fonction de sélection qui ne le fait pas et nous avons notre tuile CSS correspondante, similaire à celle que nous utilisions auparavant. Cela ne change donc pas la nouvelle catégorie en. Définissez les dégâts du corail, vous devez créer notre état pour les deux tuiles du début à la fin. Ensuite, nous avons nos différentes options. La prochaine étape est de créer notre État. J'ai juste besoin d'être installé. Alors venez à notre avis Alors maintenant, vous avez notre utilisation pour le titre deux pour toutes les catégories, blog complet. blog complet contient également les détails, les détails, l'image et aussi la description. Nous devons donc travailler sur notre propre changement. Donc, lorsque les valeurs changent. Notre changement est donc très simple. Venez ici, changement après changement. Donc, inverser un événement que nous avons créé pour la variable a pour effet de réduire la valeur cible du point d'événement Nous ciblons donc les valeurs qui, lorsque vous écrivez une donnée et que vous l'enbrivez, ne modifient pas le maître Copions donc simplement celui-ci pour le former et modifions-le nécessaire pour le modifier Donc, pour So you come here, vous pouvez changer toutes ces choses. La catégorie est là, vous pouvez cliquer sur la catégorie du plugin à soumettre ainsi que sur notre image. La prochaine étape est donc de travailler sur ce bouton de résolution. C'est à ce moment que l'on clique sur le bouton de service, que fait Dame pour transmettre la valeur à la base Cela nous mènera donc au suivant. Cela nous mènera probablement à la dernière ou à l' avant-dernière partie du projet qui consiste à créer notre compte Fire et à configurer notre base de données, puis à la lier à cette base, puis à remplacer ces données par celles de la base de données. Donc, déclarez 8. Implémentation de Firebase (a): Salut les gars, bon retour les gars. La prochaine chose importante après cela est censée fonctionner lors de notre soumission. Je vais essayer de cliquer sur le bouton Soumettre. Quelles sont ces données que nous envoyons à notre base de pompiers. Donc, comme maintenant, nous devons installer notre base de tir. Et récupérer des données de notre incendie, c'est lui envoyer des données et récupérer des données provenant des incendies. Pour ce faire, vous devez d'abord installer un feu. Il suffit donc d'aller chez Counsel Do Firebase Click. Je vais consulter cette page. Donc, après en avoir signé certains, j'ai déjà signé mon compte après avoir signé et d'autres choses encore. Vous avez donc cette page pour un projet. Donc, ces autres Firebase pour avant. Vous avez donc des options pour les projets artistiques. Vous voulez donc cliquer sur un projet artistique. Vous saisissez le nom du projet. Je dis donc que le nom du projet doit être log, log. Cliquez ensuite sur continuer. Je n'ai pas Google Analytics, mais il y en a dix autres que je ne veux pas lâcher, il suffit d'attendre la fin de sa que je ne veux pas lâcher, préparation. Quand c'est fait, vous avez quelque chose comme ça. Votre Firebase Pro est prêt. Vous cliquez sur continuer. Tu as ceci. C'est donc ici que le travail principal a commencé. L'application que nous proposons, préparez-vous en ajoutant Firebase à votre application L'application que nous développons n' est pas un robot, c'est une application Web. Vous cliquez sur le nom du site Web. Je vais mettre un blog. Je peux dire « bloquer » Configurez également l'hébergement Fire pour votre application. Je ne veux pas l'héberger sur Fire Bee, mais si vous voulez l' héberger sur Fire Bee, vous pouvez simplement sélectionner l'option et faire d'autres choses que vous devez y faire Alors enregistrez l'application, puis vous devez copier cette copie et accéder à votre terminal Depuis l'hébergement, vous utilisez l'application avec 11 terminaux, vous pouvez en ouvrir un autre N'oubliez pas que nous sommes maintenant dans le bon répertoire, vous devez aller dans le répertoire en cours puis vous le collez installer MPM Firebase, et vous cliquez sur Entrée Il va donc installer Firebase pour vous. Après l'installation, revenons à notre P. Ils ont donc dit initiationalz, firebase et commencez à utiliser le SDK pour le produit que vous Il suffit donc de copier ce disque et d' accéder à votre fader source. C'est votre fader source bader. Cliquez dessus et créez pour vous, appelez-le Firebase. Oui, la copie du code est basée à l'intérieur. Vous n'avez pas besoin de copier celui que j'ai, le PIK, qui condamne le domaine Cela sera propre à votre propre site personnellement. Si vous le copiez, il est plus probable que ce domaine ou APIC soit retiré de la liste ce domaine ou APIC après ce projet, car il s'agit de quelque chose de Ce n'est pas quelque chose que vous mettez à l'extérieur ou que tout le monde peut voir. La prochaine étape consiste donc à créer notre base de données. L'autre chose, vous pouvez utiliser la base de feu car elle est très large. Vous pouvez l'utiliser pour vérifier, en utilisant l'authentification, la connexion ou d'autres choses. Il existe des équipements que vous pouvez utiliser Firebase. Vous pouvez simplement consulter la documentation et regarder d'autres vidéos à ce sujet que nous vous aidions vraiment à en savoir plus sur Firebase Donc, ce que nous voulons faire maintenant, c'est pour notre base de données Fire Storage, base de données Fire St, et cliquer sur. Donc tu as ceci. Ainsi, lorsque vous l'avez, vous pouvez directement créer une base de données. Il y a certaines choses à faire avant de créer une base de données. Vous passez donc à How do I get started. Ça vient de la version normale. Lisez toutes ces choses. Lorsque vous y arrivez, vous pouvez voir configurer des environnements de documents. Nous l'utilisons maintenant. Je pense que nous utilisons certains côtés et que vous avez déjà installé Firebase dans notre application La prochaine chose que nous devons faire est de le copier. Revenons à notre application. Nous avons donc les initiales le jour précédent. Copions simplement ceci. Copions-le et plaçons-le médialement en dessous de celui-ci Donc, la prochaine chose à faire après cela est d'avoir ceci. Puisque vous pouvez également masquer toutes ces informations lorsque vous les publiez en ligne en utilisant le point EMV Où vous voulez le publier en ligne, git thing can see point EMV Vous pouvez donc dépasser PIK et l'appeler depuis cet endroit à l'intérieur de votre foyer. Cela le sécurisera et vous pourrez mettre Gitigno lorsqu'il pousse sur une pièce à feu, il suffit d'élaguer des points. Donc, l'EMV ne doit pas être poussé à partir. C'est donc une autre tentative pour le sécuriser. Je ne suis pas là pour raconter l'histoire, je ne fais pas ça. Ensuite, pour évaluer cela, nous devons d'abord exporter ce DP. Nous pouvons donc l'utiliser n'importe où. est donc ce DP que nous appellerons souvent lorsque nous travaillerons avec l'application. Tout d'abord, appelez-le, venez ici et exportez. Vous pouvez donc désormais l'évaluer de n'importe où. Nous pouvons donc toujours revenir à votre application. Si vous voyez ces données sortantes vers votre application. Ajoutez des données à votre Firebase, importez cet utilisateur et cet utilisateur de collection Nous examinerons cela plus tard. C'est donc le petit code que nous devons exécuter pour exporter afin de transférer des données vers cette base de feu Vous voulez lire des données, à partir de la base de données, vous voulez accéder aux données spécifiques que nous allons traiter. C'est le code que vous suivez pour lire les données de la base de données afin de sécuriser les données à supprimer, etc. Créons maintenant nos données, voir Revenons en arrière car cela crée une base de données, Slickness Donc, ne vous inquiétez pas, nous revenons à cette base. Maintenant, notre collecte de données est une collecte, nous avons mis une collection comme le sport, ensuite, les documents d'identification et d'autres choses encore. J'ai donc un lien. Ce supplément de la collection Connection ressemble une section particulière du blog que nous sommes en train de créer. Je peux le mettre dans une autre collection. Donc le sport est un sport, je peux faire de la politique, je peux m'amuser ici. Je peux avoir une seule section ici et avoir différents documents, mais ce ne sera pas une bonne chose si je veux coder des données et les filtrer. C'est donc une bonne chose pour moi d'avoir une collection différente ici. Chaque collection possède donc son propre dossier, son propre document. Il y a chaque donnée contenue dans la collection ici. Je peux donc avoir plusieurs données à l'intérieur de cet endroit. Il y a plusieurs blogs dans la division sportive, dans la collection sportive, alors je peux voir chaque bloc à cet endroit. Je le prends donc comme un fichier dans votre système. Vous avez un dossier différent dans trois dossiers ou trois éléments différents dans chaque dossier. Peut-être un pour le cinéma, vous avez toute votre journée au cinéma, un pour la musique et un pour les documents. Vous dites donc qu'ils font des choses différentes et qu' ils ont des choses différentes en eux. Donc, même chose acquise à ce T que le dossier. Ensuite, le fichier à l'intérieur est là, vous pouvez évaluer le fichier qu'il contient. Commençons donc et revenons à notre blog de création. Revenons ou créons un blog. Travaillons sur la façon de faire fonctionner cette boxe. Ce que nous voulons faire maintenant, c'est que lorsqu'ils cliquent sur cette case d'envoi, vous souhaitez ajouter un blog. Ajoutez des blogs et des plans pour ce faire. Cela signifie que nous voulons envoyer des données à notre base de données. C'est tout simplement ce que je fais. Ce que nous allons faire, c'est importer la collection et ajouter un blog. Après la collecte, souvenez-vous de l'heure à laquelle ce produit est exporté. Nous devons l'appeler parce que c'est très important lorsque nous voulons faire quoi que ce soit ici sur base de données, car nous avons besoin de toutes ces valeurs pour être rapides. Donc, importez ou je pense que c'est à rappeler ici. Donc, DB Firebase. Nous avons donc besoin de la fonction ici qui nous permet d'envoyer des données que nous rappelons chaque fois que nous voulons envoyer des données à la Firebase Donc ça coûte comme quelque chose que nous avons déjà ici, pas de c ou quoi que ce soit d'autre. Vous pouvez donc suivre cela et continuer à me suivre sur ce que je veux faire ici. Donc, coûte un blog. Donc, la première chose est que je veux éviter, je veux empêcher par défaut ce chargement par défaut et d'autres choses par défaut. Donc, la principale raison pour laquelle j' appelle cela empêche le défaut. Il existe un script d'action Java par défaut que je dois arrêter. Imaginons donc que je veuille envoyer le formulaire et que je veuille le valider avant de l'envoyer. Je veux donc empêcher l'action par défaut du Javascript de soumettre le formulaire avant de le valider pour l'utiliser empêcher la valeur par défaut, car la valeur par défaut des javascripts lorsque je suis par défaut de l' envoyer directement pour même la envoyer Après cela, je veux une condition « if ». Je veux donc vérifier chaque zone de texte, peut-être que vous avez quelque chose à l'intérieur Donc si ce titre est vide, il ne vous permettra pas d' envoyer si ce tuteur est vide, catégorie blog complet, toutes ces choses Même s'ils sont vides, cela ne leur permettra pas de partir. Donc, pour cette image, voyons voir, parce qu'il y a un nom en particulier que nous avons donné, donc image, c'est sympa. Ainsi, après avoir appelé depuis l'API, nous ne voulons pas que notre image ne s' affiche pas si le nom n'est pas différent. Après cela, après avoir vérifié cela, même si c'est vrai. Nous devrions donc appeler au. Je ne veux pas trop stresser. Je veux donc juste vous demander de l'utiliser lorsque l' un d'entre eux est vide. Après cela, le mal d'eux est devenu une réalité pour Lama. Je veux vérifier le lien de l'image. Non, certaines personnes si tu vas au. Certaines personnes veulent faire venir Jack ici. Je pense que l'application est mieux acceptée. Je veux donc vérifier que le lien est peut-être vrai. Peut-être que le lien fonctionne réellement ou qu'il s'agit d'un lien valide. Donc, pour ce faire, je dois venir à ma source et créer Fall UT. Donc à l'intérieur. À l'intérieur, il y aura un index. Dans l'indigo X, j'écrirai un code simple pour vérifier si le PR ou le lien sont vrais ou non. Export peut donc l'appeler n'importe où. Vérifiez si l'image est vraie ou non, valide ou non, l'UR et la fonction cob C'est donc tout ce que nous devons faire. Il nous suffit donc de revenir sur notre blog. Donc, en plus de l'image, nous devons passer à une importation importée Je peux donc utiliser toutes les fonctions ici et dire, et je vais passer l'image suivante, c'est l'image R. Donc, après vérification, il faut vérifier si l' image est vraie ou non Si ce n'est pas vrai, c'est une erreur. Il doit donc vérifier que cette URL est peut-être vraie. N'oubliez pas les deux choses que l'UR enregistre, l'UR save et la fonction cba Une fonction coa sera synchronisée et nous avons une fonction ici courante À l'intérieur, c'est maintenant, nous avons une autre fonction, une autre déclaration conditionnelle qui dit que j'existe si c' est vrai. Est vrai maintenant, le paramètre est d'abord désactivé sur vrai. Donc, lorsqu' ils cliquent sur le bouton, soumettez, souvenez-vous quand je le passe ici, quand ils cliquent dessus ici. Ainsi, lorsque le bouton désactivé est vrai, ils ne pourront pas cliquer à nouveau sur ce bouton. Certaines personnes peuvent simplement cliquer plusieurs fois sur le bouton. Donc, pour éviter l' action en cas de récidive ou de piqûre répétitive, vous devez la bloquer. Donc après cela, vous devez avoir un poids, non c'est un poids Scronos Techniquement Davi Donc, un poids, devons-nous passer temps à quai  ? C'est ce que nous avons ici. Collection Open Rockets, dites-vous où nous l'utilisons ? Si vous retournez voir notre service d'incendie verrez qu'ils ont également leur propre base de données. base de données n'est donc pas dans notre application, c'est pourquoi nous l'exportons base de données après DDB, puis nous avons besoin de la collection elle-même, là où nous voulons la bloquer Si nous vérifions cet endroit, cet utilisateur est maintenant un lieu de collecte ou laissez-moi revenir en arrière et vous montrer quelque chose. Si vous passez sur celui-ci, vous verrez un entrepôt Fire. Ce sont vos réserves de feu dans la partie où cette chaîne est la stressante. C'est maintenant là que vous voulez stocker, c'est le nom de votre collection Donc, je veux un nom de collection différent parce que j'en veux un pour le sport, , la politique, les affaires, etc. Donc, au lieu que je passe une seule corde ici, S sport. Donc, si je passe pour Dam, c'est tout ça, les données de l'histoire seront enregistrées au-delà de ce sport et je ne veux pas ça. Je dois donc y passer la catégorie. Donc, catégorie si la catégorie passe au sport pour enregistrer le point de données au sport. Est-ce que tu me comprends. Donc, si la catégorie parle de politique, la catégorie est la catégorie. Donc, si je sélectionne le sport, données que j'écris sous sport sont enregistrées. Je sélectionne la politique, sauvegarde les données sous politique lorsque je continue à me consacrer, etc. Qu'il y a une logique derrière tout cela. Ensuite, nous avons le support coli. D'accord. Dans ce cas, je ne transmettrai pas toutes les données. C'est le type 2. Si vous remarquez, c'est quand ils transmettent toutes les données à l'intérieur. J'ai donc mon type 2 à taper. Je suis donc donc donc la catégorie , le blog complet, l'URL et l'heure. Le temps n'est pas une option, vous n'avez pas besoin de consacrer du temps au vôtre. L'heure à laquelle vous cliquez sur le bouton de service sera enregistrée. Si vous remarquez que dans notre application ici, vous voyez quelque chose qui indique que quatre est avril 2000 2024 à cette époque, c'est l'heure à laquelle ce blog a été créé Il suffit donc d'enregistrer l'heure à laquelle vous cliquez sur le bouton. C'est donc pour cela que le moment commence. Donc, si cela réussit , une autre alerte indiquant : «   Nous voudrions peut-être recharger notre application ou tout Nous voudrions peut-être recharger notre application ou recharger Donc, après le blog, le blog a été créé avec succès. Je vais lire. Sinon signifie si celui-ci n'existe pas, si le lien vers l'image n'existe pas. Donc, que devrait dire l'analyse, j'utilise de l'oreille. Il existe une meilleure façon de le faire. Il y en a un autre où je peux créer un composant pour ma notification au lieu d'utiliser une alerte. Cela fera partie de l'évaluation. Vous souhaitez l'étendre, il vous suffit de l'appeler au lieu d'utiliser une alerte ou de concevoir votre propre modèle Aart Je peux dire URL de l'image. URL de l'image afin que nous puissions maintenant supprimer l'invalide. C'est tout ce que nous devons faire. Testez-le dès maintenant. Revenons ici et revenons à notre besoin de délimiter cette zone Ce sera une nouvelle liste. Alors imaginez maintenant que je souhaite créer un blog sur. Permettez-moi de poser une question sur un blog, la voiture, je m'appelle Joel, c'est un passionné de sport. Donc, la description, la fermeture de l'entreprise, suivent le géost. Donc, pour les détails. D'accord. Laisse-moi juste trouver un dx aléatoire Je vais retourner dans mon abdos et coller. Donc, le lien image, j'ai besoin d'un lien image, donc je le colle. Alors maintenant, je veux tester si cette URL d'image fonctionne réellement. Peut-être que si je mets une mauvaise URL, peut-être que ça marchera. Donc, au lieu de le coller, je vais le retirer et écrire des bêtises Alors prenons-en une perte maintenant. Cliquez sur Soumettre. Oui, il y a une erreur. Nous n'avons pas encore appelé cette fonction. Nous ne pouvons donc pas évaluer cette fonction. C'est une erreur. Vous voyez, c'est à ce moment-là que nous cliquons sur Soumettre, tout appelle simplement la fonction que je sors à l'heure L'appel de la fonction. Revenons-y et essayons de voir si nous allons peut-être récupérer le précédent. Je vais voir que cette URL n'est pas valide. Laisse-moi voir si ça va marcher ou pas. Pouvez-vous voir fournir un lien URL valide. Je clique. Je dois revenir en arrière et copier le lien URL correct maintenant. Et laissez-moi placer ce dernier tableau juste après , puis cliquez sur Soumettre. Cliquez donc déjà sur Soumettre. C'est censé être un bouton de chargement, prenons-en note. Nous recevons donc pour bloquer les fêtes, Hookie Blocked ou quelque chose comme ça, une autorisation manquante ou inst Nous n'avons donc pas encore l' autorisation de publier sur ce costume sur le site Sorry on the Fire Base 9. Implémentation de Firebase (b): Hokie sera bloqué ou quelque chose comme ça manquera ou accordera l'autorisation Nous n'avons donc pas encore l'autorisation de publier sur ce gb, désolé, sur le Fire Base pour le moment. Donc, vous savez, lorsque nous le créons, je vous montre quelque chose qui, si vous revenez aux règles, revenez aux vôtres. Il y a quelque chose que nous montrons, je pense que c'est pour une tierce personne, bla, bla, bla Je dis que je vais expliquer plus tard. Vous pouvez reculer légèrement la vidéo . C'est donc le bon endroit. Nous devons réécrire celui-ci afin que tout le monde puisse écrire un article puisse avoir accès à la rédaction d'articles Donc, ce que nous devons faire, c'est changer celui-ci en vrai. Celui-ci est trop vrai. Maintenant, nous avons déjà une collection différente pour chacun d'entre eux, et certains d'entre eux ont deux données, une donnée par donnée. Nous pouvons même en faire une technologie, tout comme les données T. Donc, la prochaine chose à faire , après avoir ajouté toutes ces choses, c'est de le rebaptiser « notre ». Vous avez remarqué que nous appelons les données de notre base de données depuis notre base de tir. La plupart sont donc capables de le faire. C'est très simple, peut-être que nous écrivons cette ligne de code, non, non, non, non, non. Ce que nous allons faire maintenant, c'est revenir à notre code. Donc, au lieu du même où nous avons l'avant au lieu de celui par défaut, nous l' avons déjà. Je reviens à notre code. Retournez à notre page d'accueil. Maintenant, au lieu d'utiliser tous ces outils, nous devons obtenir nos données, nous devons lire les données de la base de données. N'oubliez pas que l'option pour une donnée peut accéder aux données. Nous devons lire toutes les données de la base de données. Donc, ce que nous faisons, c'est obtenir des documents et nous souvenir que vous avez besoin de votre base de données qui est TV from Fire Base. avons donc besoin. Quelles sont donc ces fonctions que nous devons écrire ? Donc, tout d'abord, nous devons avoir un domaine pour chacun d'entre eux. Ce que fait l'État, c'est qu'après récupéré pour le récupérer en fonction de chaque collection, récupérons pour la collecte des politiques, la technologie des blogs politiques dT, le divertissement, les sports Donc, un port de la base de données en fonction de chaque collection. Donc, ce que nous allons faire maintenant, c'est avoir notre effet d'utilisation, car ce sera un effet d'utilisation constant. Donc, utilisez l'effet, nous avons une fonction c égale à un instantané de requête scronssd have Q. De la même manière que nous obtenons des documents que nous avons déjà dans la collection, nous mettons à notre base de données le nom de la collection que nous voulons obtenir elle-même et en tant que politique. Vous pouvez retourner à votre point de contact et vérifier le nom ici, politique, si nous vérifions ici, il fait ce qu'ils proposent également des instantanés, conformément aux normes Donc la politique aussi. Ensuite, vous avez un autre bloc de coûts , un R. Ainsi, lorsqu' une requête interroge des personnes pour chacun d'eux. Pour chacun d'entre eux, nous voulons le stocker dans des blocs d'alimentation point push. Nous voulons donc le mettre à l' intérieur du CR avec un identifiant. Ce point d'identification du document. Ensuite, nous diffusons les données du document. Ensuite, nous voulons trier les données. Cela signifie que le premier qui possède le dernier est le premier à arriver en premier avant l'autre. Nous disons donc que coût, trie un bloc trié égal à f nouveaux blocs A vient B, deux arguments font le temps. Donc, le temps qu'ils veulent trier est batte contre heure, moins une fois qu'ils définiront le set P B qui met la politique, bloque le blocage de l'État et de l'État Ensuite, sur ce que l' on appelle les fonctionnalités. Il s'agit d'un bloc de récupération ou disons de blocs d'extraction au lieu d'un bloc de récupération Allons chercher des blocs. Ouais Parce que maintenant je ne cherche qu'un seul bloc. Après cela, nous avons donc voulu exécuter une fois après le chargement. Voilà pour ce qui est de la politique. Alors maintenant, nous devons également le reproduire pour d'autres. Donc, si vous prenez l'heure est corrélée à l'heure, nous devons donc la formater de manière à ce que l'heure soit appropriée Donc, ce que nous devons faire, c' est revenir à notre carte bloquée car elle se trouve simplement dans notre carte bloquée, n'est-ce pas ? Accédez à nos cartes à blocs à l'intérieur de nos composants. Carte. Donc, lorsque nous avons le temps, nous devons le remplacer par celui-ci. Il existe une nouvelle chaîne de caractères d time sus. C'est donc un format électrique. Il indique l'heure à laquelle nous avons créé ce blog et les dates. Cliquons sur l'un d'entre eux. Cela montre donc, mais une chose est de ne pas montrer tous les détails. Voyons donc le nom que nous appelons tous les détails ici. Voyons voir, nous l'appelons blog complet, blog complet ici. Revenons donc à notre composant ici. C'est notre point de vue sur les détails. Vérifions-le. C' était donc aux États de faire les détails. C'est le blog complet de l'État. Alors vérifions-le maintenant. Nous l'avons Nos données ne sont donc pas publiées sur. Cela signifie donc que nous devons également le formater. Nous devons également formater cette date. Souvenez-vous de ce que nous avons fait ici. Tu peux juste venir ici et partir. Donc, celui-ci indiquera l'heure. Voyons donc ce qui s'y trouve déjà, et notre vote rétrospectif fonctionne. C'est donc principalement ça. Mais il reste encore une chose à faire pour cet endroit. L'autre a conservé l'ancien blog. Cela signifie donc que nous devons accéder à nos coordonnées, notre section blog, et modifier certaines choses. Ce que nous devons changer s'appelle l'API, elle permet également de lire tous les détails et de les coller à l'intérieur de chacun d'eux. Alors, que devons-nous faire ? Nous avons déjà notre bloc de vente. Donc, comme pour la page dont nous avons besoin pour tout appeler, tout ce qui se trouve ici, chaque fonction, nous n'avons pas besoin de le copier. Nous n'avons pas besoin de faire ça ici. Désolée. Oui, ce sont des sections en blocs. Alors permettez-moi de faire plaisir à celui que je n'utilise pas correctement. Je reviens à ma section. Nous n'avons donc pas besoin de tout appeler ici. Il suffit d'appeler celui-ci l'un d'entre eux, puis de passer la catégorie, non ? Donc, la catégorie sur laquelle nous cliquons ici, s'il s' agit de sport , générera le blog sportif. Je vais me procurer tout ce blog, la collection de blogs sur le sport. Si c'est de la politique, optez pour la politique et ainsi de suite. Donc, à l'intérieur de cet endroit, il y aura un blog défini au lieu d'un ensemble de blogs. C'est ça. Donc, ce qui manque ici, c'est que nous en avons besoin pour l'importer. Revenons donc à notre page d'accueil. Nous en avons besoin pour être là, non ? Et ici, nous devons passer notre catégorie dt. Nous devons donc changer quand la catégorie a changé. Donc, au lieu de cet état maintenant, nous pouvons supprimer cet état, ce qui devrait être le cas. Revenons à notre page. Pouvez-vous voir maintenant ? Pour être sûr, je pense avoir créé un article sur les politiques que j'appelle politique. Tu peux voir ? Cela change en fonction de la zone que je saisis, la technologie, le divertissement en tant que zone. Vous pouvez donc voir que l'image montre une magnifique image. Donc, si vous cliquez sur cette émission, cela a été un moment vraiment incroyable vous emmener dans la création de ce site incroyable. Il y a donc encore beaucoup de choses que vous pouvez faire avec ça. Cela fera donc partie de l'évaluation. Ce dont j'ai juste besoin pour vous, c'est de travailler sur le modèle. Ainsi, lorsque je clique sur Par exemple, lorsque je reviens à ce bloc de pli, si je reviens à ce bloc d'utilisation et que je clique dessus Au lieu d'utiliser Alt, vous pouvez créer un modèle, votre modèle sera celui qui fournira des notifications utiles. Et ce truc, tu peux lister tous tes blocs pour que je supprime le bouton afin que je puisse avoir le contrôle dessus. Vous pouvez le supprimer de cet endroit. Vous pouvez le voir depuis cet endroit si vous le souhaitez. Mais si vous ne voulez pas le faire, vous pouvez revenir ici et n'importe quel blog qui vous convient et qui ne vous sera pas utile. Il vous suffit de cliquer dessus pour supprimer des documents. Et supprimez des documents. Vous pouvez supprimer le document que vous supprimez tout ce blog de celui-ci. Donc c'est ça. Après cela, après avoir créé quelque chose comme ça, vous pouvez créer votre modèle et faire fonctionner ce bouton de recherche. Les contacts. C'est alors qu'ils cliquent sur Soumettre, vous leur envoyez un e-mail à n'importe quel e-mail vous pourriez envoyer à votre adresse e-mail personnelle lorsqu'ils vous contactent. Je pense que certains sites peuvent faire pour que je prenne des images, vérifie des images. Les images peuvent vous y aider. Ainsi, lorsqu'ils envoient un message, personnes trans seront envoyées directement à votre adresse e-mail et vous pourrez leur répondre à partir de cet endroit afin ne pas recevoir d' e-mail généré et d'y répondre. Donc d'autres choses. Les choses étonnantes que vous pouvez ajouter à cela ne s'arrêtent pas là. Le design ne s'arrête pas là. Il y en a certaines que vous pouvez masquer, comme le chargement, le chargement ou le chargement. Donc, quand je coche ce truc, il devrait y avoir comme une charge qui court, ronde , ronde. Il existe des CSS amusants, du load putting. Je charge l'icône de chargement de l'animation, vous pouvez vérifier cela. Divers, divers d'entre eux, vous pouvez vérifier cela et voir comment vous pouvez l' implémenter à cet effet. Alors merci les gars de m'avoir suivi jusqu'au bout de cette histoire. Euh, je vous vois dans le prochain tutoriel, tous ceux que je vais envoyer ensuite. Alors, s'il vous plaît, cliquez sur le bouton «   Suivre » pour que chaque fois que je publie un contenu incroyable , des tutoriels incroyables, vous me suiviez et vous en profitiez ensemble. Merci beaucoup, Segers Nia