Nous saluons le retour.
Dans cette vidéo, nous allons vous faire passer les étapes de création d'une application simple très très simple et le but ici est de vous montrer comment POST demandes de travail et d'exprimer comment nous créons des routes qui sont à l'écoute pour les demandes de poste, puis comment nous pouvons tester Les avec le facteur et puis voir comment nous pouvons écrire un formulaire sur un modèle express différent et ont ce formulaire faire une demande POST à ​​notre application express.
Donc, comme je l'ai mentionné, nous allons faire une application simple ensemble et je vais commencer à partir de zéro et installer et inclure Express.
Et puis nous allons aller sur la logique de l'application réelle.
Donc, je vais commencer maintenant et juste faire un nouveau répertoire que je vais appeler post demo de demande de CD dans ce domaine et nous allons exécuter NPM en elle et nous allons juste frapper entrer quelques fois changer point d'entrée.
D'ACCORD.
Voilà.
Nous avons notre paquet que Jason nous laisser maintenant installer tiret express tableau de bord sauver.
Et pendant que nous sommes ici, nous allons installer NPM E.J. S ainsi et sauf cela.
D'ACCORD.
Maintenant, créons notre application.
Oui.
Et puis nous allons ouvrir cela et ajouter dans notre code exprimé de base dont nous avons besoin.
Donc, nous allons l'importer avec require et ensuite créer une variable d'application où nous exécutons.
EXPRESS Et pendant que nous sommes ici, nous allons aussi faire l'application ne vous mettre le moteur d'être Ejay Oui et je vais enregistrer cela.
Et puis nous faisons aussi notre apt écouter en bas au lieu d'ici va vous faire traiter cela.
Et nous l'avons.
Et pour traiter l'IP ENFP et notre fonction de rappel.
Et enfin je vais juste faire un très simple venir au serveur de journal a commencé.
D'ACCORD.
Donc, nous avons cette mise en place.
Maintenant, nous allons créer notre itinéraire brut comme ça et nous allons simplement rendre un modèle pour le restaurant maintenant rendue appelée à la maison comme ça et sauver.
Maintenant, faisons ce modèle.
Donc, nous avons besoin d'un répertoire utilisé faire des vues répertoire et vous devez toucher vos vues de fichier slash home.
Oui.
Et puis ouvrir ce fichier et à l'intérieur de là, nous allons faire un H-1 simple qui dit page d'accueil comme ça et nous allons nous assurer que ça fonctionne.
Donc nous allons exécuter le noeud Apalachee nous revenons ici rafraîchir et nous obtenons la page d'accueil.
OK donc nous avons le squelette de base mis en place, nous avons express inclus, nous avons Ejaz inclus.
Nous avons défini le moteur de visualisation par défaut et nous avons notre itinéraire.
L'application que nous allons faire est essentiellement une liste d'amis ou liste d'amis que vous pouvez ensuite aller dans et à travers un formulaire, vous pouvez ajouter un nouvel ami à votre liste.
Et cela pourrait être quelque chose d'amis ou de faire ou de contacts ou de chiens juste quelque chose que nous allons avoir une liste de ce que nous pouvons ensuite créer un nouveau en utilisant un formulaire.
Donc nous allons faire des amis et nous allons ajouter dans l'application et obtenir des amis barre oblique et ce sera la page le modèle qui montre une liste d'amis.
Et au lieu d'ici vont faire un redstart rendre et nous allons juste appeler amis et maintenant nous devons créer ce modèle.
Donc, nous allons faire le point de vue vues ami que Ejay nous, puis ouvrez ce fichier juste comme ça.
Et à l'intérieur d'ici, nous ajouterons un autre H-1 juste la liste d'amis juste va ici et nous allons exécuter notre serveur assurez-vous qu'il fonctionne.
Si nous allons à des amis de barre oblique nous obtenons la liste d'amis va ici.
D'ACCORD.
Donc, ce que nous allons faire est d'afficher une liste d'amis.
Nous devons donc créer cette liste.
Nous avons besoin des données.
Donc, je vais créer un tableau de noms d'amis et ça va être très simple tout simplement amis loin égaux et nous allons simplement ajouter en quelques noms ici comme Tony et Justin Pierre et Lilly.
D'ACCORD.
Nous avons donc un groupe d'amis et nous allons passer cette liste d'amis par le biais de notre modèle d'amis où nous allons ensuite en boucle et afficher chaque ami comme un élément de liste.
Donc nous devons transmettre cela.
Rappelez-vous que c'est un objet et nous avons deux choses à faire.
Nous devons lui donner un nom ou une propriété que nous allons utiliser pour le regarder dans la vue que je voudrais appeler les amis et nos données que nous sommes en passant comme amis, ce qui est source de confusion lorsque vous venez de commencer .
Mais c'est ce que vous verrez le plus souvent où vous utilisez juste le même nom, mais rappelez-vous cela peut être n'importe quoi du tout.
Et cela se réfère à notre réseau d'amis ici.
OK, maintenant, allons-y au modèle d'étude ami ami et ajoutez dans notre boucle et je vais faire un pour chacun.
Alors je vais juste écrire le javascript régulier d'abord sans les parenthèses sans l'Ejay nous.
Ainsi nous avons des amis pour chaque fonction et notre fonction prendra paramètre d'ami là et puis nous avons notre ouverture fermant des accolades juste comme cela.
Et au lieu d'ici ce que nous allons faire est de faire un allié pour chacun qui dit que j'ai un ami juste comme ça.
Maintenant, revenons en arrière et ajoutez dans les phrases que nous n'avons pas besoin de signe égal ou rappelez-vous cela est juste pour la logique.
Nous ne voulons pas que quelque chose se présente sur ces deux lignes.
Donc, nous avons fait et si nous sauvegardons et rafraîchir, nous devrions voir un allié qui dit que j'ai un ami pour chaque ami dans cette liste et essayons de s'assurer que nous n'avons pas d'erreurs.
Actualisez la page et nous obtenons 5 éléments de liste qui disent que j'ai un ami.
Maintenant, nous allons revenir en arrière et plutôt que de simplement dire que j'ai un ami nous allons effectivement imprimer le nom de l'ami.
Donc, cette fois, nous avons besoin du signe égal car nous voulons que la valeur qui a été évaluée soit ajoutée à l'équipe elle-même ici.
Nous voulons qu'il soit remplacé par la valeur d'un ami qui vient de droite ici dans notre pour chacun.
Encore une fois ceci peut être n'importe quoi.
Nommez-nous ce que nous voulons x.
Et si elle met X ici, ça marchera.
Alors laissez-moi juste vous montrer que rafraîchir et nous avons nos cinq amis et parce que X est un nom de variable terrible beaucoup de revenir à un ami comme ça pour redémarrer le serveur.
Une fois de plus et vous pouvez voir rien ne change.
OK, nous avons cette liste d'amis.
Maintenant, ce que nous allons faire est de parler de la mise en place de la voie post.
Le but à la fin est d'avoir un formulaire au bas de cette page et nous pouvons taper un nom dans ce formulaire et cliquez sur le bouton de soumettre et il ajoutera alors un nouvel ami à notre liste.
Nous allons donc pousser un nouveau nom dans le tableau des amis et ensuite rendre ce modèle à nouveau qui va ensuite ajouter un nouveau point de balise et un nouvel élément de liste pour cet ami nouvellement ajouté.
Nous devons commencer par mettre en place un post-road et rappelez-vous que nous utilisons un poste Strout à chaque fois que nous ajoutons des données à quelque chose quand nous envoyons des données et nous voulons l'ajouter à la base de données si nous signons un Utilisateur ou nous créons un nouveau commentaire ou créez un nouveau message ou, dans ce cas, un nouvel ami un itinéraire post.
Est ce qui fait le plus de sens même si ce n'est pas la seule option.
Pour l'instant, nous allons le traiter comme si c'était la seule option.
Donc, il est juste pour récupérer des informations et un post est pour l'envoi de nouvelles données à ajouter ou à utiliser d'une manière ou d'une autre sur le côté serveur.
Et tout ce que nous avons besoin d'écrire est apt up post et le nom de l'itinéraire que nous appelons ajouter un ami comme ça et il ressemble le même avec la demande et la réponse et nous allons laisser comme cela pour l'instant.
Et à l'intérieur nous allons juste faire un repos jusqu'à envoyer Nous ne ferons pas un modèle juste point RES envoyer.
Vous avez atteint l'itinéraire de la poste comme ça.
Donc maintenant voyons voir si nous pouvons déclencher cela si nous pouvons le frapper ajouter un ami comme une demande de poste en utilisant le facteur.
Donc, je vais prendre cette URL et de copier ce plus de postman et où nous voulons faire une demande.
Nous pouvons commencer en faisant juste des amis de sosh comme une demande d'obtention et vous voyez que nous obtenons de nouveau chaque équipe lui avec les cinq amis.
Mais maintenant, nous allons faire une demande de post et nous le faisons à la barre oblique ajouter un ami.
Et maintenant, si nous envoyons une demande de poste, nous obtenons un message ne peut pas poster ajouter un ami et c'est pour une raison idiote.
Nous devons redémarrer le serveur chaque fois que nous ajoutons un nouvel itinéraire.
Et maintenant, si nous retournons et envoyons la demande à nouveau, nous obtenons un message.
Vous avez atteint la route post.
Nous envoyons donc une demande de poste et nous le faisons par le biais d'un facteur plutôt que d'utiliser un formulaire, mais c'est la même idée exacte.
Il fonctionne de la même manière.
Nous envoyons une demande de post et ce code est exécuté ici.
OK alors la prochaine chose que nous voulons faire est d'utiliser un formulaire pour envoyer cette demande de post.
Donc je vais aller à l'étude des amis chaque page et au fond beaucoup de formulaire et ce formulaire se soumettra à cette route.
Rappelez-vous donc qu'il ya deux attributs importants.
Il y a action et puis méthode.
Commençons donc par la méthode.
Nous voulons envoyer une demande de post et l'action est le vous êtes un tout qui est slash et ami.
Et encore une fois, cela doit correspondre à ce taux ici.
Slash ajouter un ami comme un post.
D'accord.
Et au lieu d'ici, nous allons avoir un seul type d'entrée est égal au texte et nous voulons aussi avoir un espace réservé qui dit le nom ou ce que nous voulons mettre là.
C'est juste le texte d'espace réservé et puis nous ajouterons également un bouton à la fin et ceci juste dira que j'ai fait un nouvel ami et économiser cela.
Et donc cela va créer une forme pour nous en ce moment.
Si je redémarre le serveur et je retourne et je rafraîchir la page, j'ai maintenant un formulaire ici et si nous l'inspecter, il a ces deux attributs où nous avons l'action c'est ADD ami méthode est post et il a une seule entrée.
Et si je tape quelque chose ici, j'ai fait un nouvel ami nommé aujourd'hui Bob et ils cliquent.
J'ai fait un nouvel ami.
Vous pouvez voir que nous obtenons cette réponse.
Vous avez atteint la route post, ce qui signifie que nous envoyons une demande de post et que nous l'envoyons au bon endroit.
Slash ajouter un ami mais nous ne faisons rien dans cette voie.
Mis à part répondre avec ce message et ce que nous voulons réellement faire est de prendre les données de la forme que vous souhaitez prendre Bob.