‫Instructeur : La partie de la
‫section concernant le téléchargement
‫de fichiers étant terminée, tournons maintenant notre attention vers l'envoi d'e-mails.
‫Et en fait, nous avons déjà envoyé des
‫e-mails auparavant, pour la réinitialisation du mot de passe, mais dans les deux prochaines
‫conférences, nous allons amener cela à un tout autre niveau.
‫Et ce que nous allons faire, c'est créer des
‫modèles d'e-mails avec carlin et envoyer de vrais e-mails
‫à l'aide du service SendGrid.
‫Et maintenant, dans cette première conférence, nous
‫allons créer un gestionnaire de messagerie plus robuste que
‫celui que nous avions auparavant.
‫Alors, ouvrons notre dossier utilitaires, puis
‫ici, rappelez-vous, nous avons déjà un fichier de courrier électronique.
‫Mais pour le moment,
‫ce que nous avons ici n'est qu'un gestionnaire d'envoi d'e-mails
‫très simple, qui n'est pas capable d'accepter beaucoup d'options.
‫Et donc maintenant, nous
‫allons construire une solution beaucoup plus robuste ici.
‫Très bien?
‫Donc ce que je vais faire, c'est créer
‫une classe, et cette classe s'appellera email.
‫Donc module. exportations, et donc
‫aussi cette classe est ce que
‫nous allons exporter à partir de ce fichier.
‫Et puis, comme toujours, une classe a besoin d'une fonction constructeur,
‫qui est essentiellement la fonction qui va
‫s'exécuter lorsqu'un nouvel objet est créé via cette classe.
‫Voyons maintenant comment
‫nous utiliserions cette classe dans la pratique.
‫Et donc l'idée, en gros,
‫chaque fois que nous voulons envoyer un
‫nouvel e-mail, est d'importer cette classe d'e-mails et de l'utiliser ensuite comme ceci.
‫Donc, en créant un
‫nouvel e-mail, puis dans celui-ci, nous voulons coller
‫un utilisateur, et cet utilisateur contiendra alors l'adresse e-mail,
‫ainsi que le nom au cas où nous voudrions personnaliser l'e-mail.
‫Et aussi une URL.
‫Et un bon exemple
‫pour celui-ci est par exemple l'URL de réinitialisation pour réinitialiser le mot de passe.
‫D'accord?
‫Donc, un nouvel objet e-mail, puis là,
‫nous voulons appeler la méthode qui
‫va réellement envoyer l'e-mail.
‫Alors, disons sendWelcome.
‫Et pour que celui-ci soit envoyé chaque
‫fois qu'un nouvel utilisateur s'inscrit à notre application.
‫Très bien?
‫Nous aurons alors également envoyer la réinitialisation du mot de passe.
‫Et la façon dont
‫nous allons configurer tout cela rendra très
‫facile l'ajout de nouvelles méthodes similaires à
‫celle-ci pour envoyer différents e-mails pour différents scénarios.
‫Très bien?
‫Quoi qu'il en soit, puisque nous collons l'utilisateur et l'URL
‫dans un nouvel e-mail, eh bien, notre constructeur doit alors les
‫prendre en compte comme arguments.
‫Donc utilisateur et URL.
‫Et donc ce qui se passe dans ce constructeur est que this. à sera
‫égal à l'utilisateur. email Ensuite, nous voulons
‫également définir le prénom de l'utilisateur, encore
‫une fois afin de personnaliser essentiellement l'email.
‫Et c'est donc l'utilisateur. name et
‫divisons-le et prenons uniquement le premier élément du tableau résultant.
‫Nous avons donc
‫fait celui-ci avant, mais aussi celui-ci. url est égal à l'URL entrante.
‫Enfin, définissons également ceci. d'ici.
‫donc essentiellement au niveau de l'objet.
‫Et donc chaque objet créé à partir de cette
‫classe obtiendra alors cette propriété.
‫Et donc celui-ci sera similaire à ce que nous avons ici.
‫Donc, c'est fondamentalement cela à partir
‫de, alors copions-le, mais
‫c'est bien de l'avoir dans un endroit central comme celui-ci.
‫Maintenant, une chose que je veux
‫vraiment faire, c'est de définir cette adresse e-mail ici
‫comme une variable de
‫configuration, et donc une variable d'environnement
‫que nous pouvons très facilement
‫modifier en manipulant la configuration. env fichier.
‫Très bien?
‫Appelons donc celui-ci EMAIL_FROM.
‫Et puis nous ne voulons que l'adresse e-mail elle-même.
‫Très bien?
‫Donc un autre cas où il est très
‫utile d'utiliser des variables d'environnement.
‫Et maintenant, faisons-en une chaîne de modèle.
‫Et bien sûr, branchez-le ici.
‫C'est donc le processus. env. EMAIL DE.
‫Ensuite, créons une méthode ici afin
‫de créer le transport.
‫Tellement similaire à ce que nous avons ici.
‫Alors créez Transport.
‫Et maintenant, ici, nous voulons réellement avoir des transports
‫différents, que nous soyons en production ou non.
‫Ainsi, lorsque nous sommes
‫en production, nous voulons en fait envoyer de
‫vrais e-mails, et nous le ferons un peu plus tard en
‫utilisant SendGrid, mais si nous ne sommes pas
‫en production, nous voulons toujours utiliser notre application Mailtrap comme
‫nous le faisions avant quand nous envoyons des e-mails.
‫Ainsi, au lieu que l'e-mail soit envoyé à une véritable adresse e-mail,
‫il sera bloqué dans notre boîte de réception Mailtrap afin que
‫nous puissions réellement l'examiner
‫dans notre processus de développement.
‫Donc, ce transporteur sera exactement le même que celui-ci, alors copions-le simplement
‫mais disons d'abord si (process.
‫env. NODE_ENV).
‫Alors, rappelez-vous, c'est ainsi que nous vérifions si
‫nous sommes en production ou non.
‫Et donc si c'est en production,
‫et donc si
‫nous sommes en production, alors nous voulons créer un transporteur pour SendGrid.
‫Mettons donc cela ici, et encore une fois,
‫nous le ferons plus tard.
‫Pour l'instant, revenons juste quelque chose d'ici.
‫Peu importe, disons un.
‫Très bien?
‫Et puis en gros sinon nous
‫voulons retourner ce nodemailer. créerTransport.
‫D'accord?
‫Donc,
‫ce transport ici renverra essentiellement un nouveau transport nodemailer comme celui-ci.
‫Ou, au contraire quand on est
‫en production, alors celui qui va être là.
‫D'accord?
‫Alors supprimons-le d'ici.
‫Aussi, nous voulons supprimer celui-ci.
‫Et maintenant créons la méthode send.
‫Et donc ce sera
‫la méthode qui fera l'envoi réel.
‫D'accord?
‫Et celui-ci recevra un modèle et un sujet.
‫Et vous comprendrez un
‫peu mieux pourquoi c'est une fois tout ce cours terminé.
‫D'accord?
‫Donc modèle et sujet.
‫Mettons donc un commentaire ici sur ce que cela va faire.
‫Et maintenant, avant d'écrire cette fonction, laissez-moi vous
‫montrer comment nous allons l'utiliser, et
‫donc pourquoi nous avons besoin du modèle et du sujet ici.
‫Alors, rappelez-vous comment nous avons
‫dit ici que nous allons avoir une méthode appelée sendWelcome,
‫et aussi une méthode pour envoyer un e-mail de réinitialisation de mot de passe.
‫Et donc, ajoutons maintenant cela ici, alors envoyezBienvenue.
‫Et celui-ci ne reçoit aucun argument et tout ce
‫qu'il fait en réalité, c'est d'appeler send avec le modèle
‫et le sujet que
‫nous voulons pour cet e-mail.
‫D'accord?
‫Et encore une fois, cela rend très facile
‫la création de différents
‫e-mails pour toutes sortes de situations différentes.
‫D'accord?
‫Nous avons donc cette fonction d'envoi de route
‫ici, puis toutes ces fonctions plus spécifiques,
‫qui appelleront à leur tour la fonction d'envoi du routeur
‫qui effectue le travail réel.
‫D'accord?
‫Et en fait, c'est ici. envoyer car bien
‫sûr ces méthodes ici, elles
‫vont être définies sur l'objet courant.
‫Et c'est donc ça.
‫Ensuite, nous collons ici le nom du modèle.
‫Et donc ce nom de modèle que j'ai
‫mis ici, sera à l'avenir un modèle de carlin
‫que nous allons créer.
‫Donc, en fait, dans la prochaine conférence,
‫nous allons créer ce modèle de carlin afin
‫d'envoyer cet e-mail de bienvenue.
‫D'accord?
‫Et puis juste la ligne d'objet.
‫Disons 'Bienvenue dans la famille Natours ! ' Et donc, juste
‫comme ça, nous n'avons pas à nous soucier
‫des détails de mise en œuvre
‫lorsque nous envoyons réellement l'e-mail.
‫Ainsi, par exemple, au point de
‫notre code où nous voulons envoyer l'e-mail
‫de bienvenue, nous n'avons pas à nous soucier
‫des noms de modèles ou des lignes d'objet.
‫Tout ce que nous allons faire, c'est dire envoyer un e-mail de
‫bienvenue et c'est tout.
‫Et puis
‫notre classe s'occupera de l'implémentation.
‫Très bien?
‫Quoi qu'il en soit, construisons maintenant cette fonction d'envoi.
‫Et donc, ce que nous allons faire dans cette fonction,
‫c'est d'abord rendre le code HTML de l'e-mail basé sur un
‫modèle de carlin.
‫Donc, fondamentalement, celui que
‫nous collons ici avec le modèle.
‫Ensuite, définissez les options de courrier électronique, et
‫cela sera encore une fois très similaire à celui-ci, et en fait, laissez-moi
‫aller de l'avant et
‫le couper à partir d'ici et le coller ici.
‫D'accord?
‫Bien sûr, ce ne sera pas exactement la même chose, mais
‫nous laisserons cela un peu plus tard.
‫Très bien?
‫Et puis
‫enfin, créez un transport et envoyez un e-mail.
‫D'accord?
‫Et voilà, je vais laisser celui-là pour plus tard aussi.
‫Donc, en commençant par le point numéro un.
‫Et généralement jusqu'à ce point, nous n'utilisons que pug pour
‫créer un modèle, puis
‫nous passons le nom du modèle
‫dans la fonction de rendu sur la réponse.
‫À droite.
‫Donc, nous l'avons toujours utilisé comme
‫ceci res. render, puis
‫ici le nom du template.
‫À droite?
‫Et ce que cette fonction de rendu fait
‫dans les coulisses est de créer essentiellement le code HTML basé sur le
‫modèle carlin, puis de l'envoyer au client.
‫Maintenant, dans ce cas, nous ne voulons pas vraiment effectuer le
‫rendu, tout ce que nous voulons faire est de créer le HTML
‫à partir du modèle afin que nous puissions ensuite envoyer ce
‫HTML comme e-mail.
‫Donc, en gros, le définir ici comme une option HTML dans
‫ces options de messagerie.
‫D'accord?
‫Alors, rappelez-vous comment nous pouvons spécifier du texte et du HTML.
‫Et surtout, nous sommes intéressés par l'envoi d'un e-mail HTML.
‫Et c'est pourquoi nous allons avoir un modèle de carlin
‫à partir duquel nous allons générer ce code HTML.
‫D'accord?
‫Donc ça ne va pas fonctionner comme ça, mais à
‫la place nous devons en fait exiger
‫le paquet pug ici.
‫Alors,
‫carlin comme ça, et
‫ensuite nous devons utiliser carlin.
‫renderFile.
‫D'accord?
‫Et donc cela va prendre
‫le fichier et ensuite rendre le code carlin en vrai HTML.
‫D'accord?
‫Et pour que nous puissions ensuite enregistrer dans une variable HTML.
‫Très bien?
‫Alors, où est ce fichier ?
‫Eh bien, c'est à dirname, donc le nom
‫D-I-R, qui se souvient est
‫l'emplacement du script
‫en cours d'exécution, et c'est
‫donc, en ce moment, dans ce dossier utilitaires.
‫D'accord?
‫Et donc à partir de là, nous devons monter d'un cran,
‫puis aller dans les vues, et à partir de là, aller dans un dossier d'e-mails que
‫nous allons également créer dans une seconde.
‫Et puis
‫c'est là que nous allons avoir le fichier modèle.
‫Donc modèle}.
‫carlin.
‫Donc, pour l'e-mail de bienvenue, ce modèle
‫s'appellera bienvenue.
‫Et donc créons maintenant cela ici dans les vues, créons un
‫nouveau dossier, un
‫e-mail, puis dans ce nouveau fichier,
‫bienvenue. carlin.
‫D'accord?
‫Et nous n'allons pas vraiment créer ce
‫modèle dans cette vidéo, mais je voulais juste vous montrer
‫comment tout cela va fonctionner.
‫D'accord?
‫Donc, cet accueil sera collé ici dans
‫le modèle, puis il récupérera ce fichier dans le dossier des vues.
‫À droite?
‫Donc, c'est la première étape.
‫Ensuite, définissons les options de courrier électronique.
‫Donc, à partir de maintenant, c'est ça. à partir de.
‫Rappelles toi?
‫Alors juste ici.
‫Ensuite,
‫nous avons ceci. à, et nous avons aussi le
‫sujet qui est égal au sujet qui vient ici, et donc, ouais,
‫en fait, nous n'avons même pas besoin de définir celui-ci
‫et nous avons notre HTML.
‫Alors comme ça, ou bien sûr, ce
‫n'est même pas nécessaire car c'est le même nom.
‫Maintenant, nous souhaitons également inclure une version texte
‫de notre e-mail dans l'e-mail.
‫D'accord?
‫Et c'est en fait très important car c'est mieux pour
‫les taux de livraison des e-mails et aussi pour les dossiers de spam.
‫Très bien?
‫Et aussi, certaines personnes préfèrent simplement les e-mails en texte
‫simple plutôt que les e-mails HTML plus formatés.
‫Très bien?
‫Et donc fondamentalement, nous avons besoin d'un moyen de
‫convertir tout le HTML en texte simple.
‫Donc, en supprimant tout le HTML en ne laissant que le contenu.
‫Et pour ce faire,
‫nous allons
‫installer encore un autre paquet, et donc celui-ci s'appelle html-to-text.
‫Très bien?
‫Incluons cela ici,
‫ToText.
‫require('html-to-text'), comme ceci.
‫D'accord?
‫Maintenant, utilisons-le pour convertir notre HTML.
‫Nous utilisons donc htmlToText. fromString, puis cette
‫chaîne est stockée en HTML.
‫À droite?
‫Donc, ce sont nos options de messagerie, et en
‫fait j'ai oublié quelque chose de très, très important, ici
‫dans cette première étape, donc dans ce fichier de rendu, car
‫tout comme avec la réponse. render, nous pouvons également
‫coller des données dans le fichier de rendu.
‫Et bien sûr, cela est
‫très important si nous voulons réellement personnaliser ou envoyer
‫un e-mail avec le nom et également coller l'URL.
‫Et donc faisons-le comme nous le faisions normalement dans
‫la fonction de rendu.
‫C'est donc prénom, envoyez-le à ceci. firstName, et l'URL
‫est la suivante. url, et collons également le sujet et
‫vous verrez un peu plus tard pourquoi
‫nous avons besoin de cela.
‫D'accord?
‫Alors, créons enfin un transport à l'aide
‫de notre fonction de création de
‫transport, puis envoyons l'e-mail.
‫Donc, assez juste, c'est ça. créerTransport.
‫Alors, rappelez-vous qu'il ne s'agit que de cette méthode ici, celle-ci, et qu'elle
‫porte exactement le même
‫nom que cette fonction ici provenant de nodemailer.
‫C'est donc
‫un peu déroutant, alors appelons-le newTransport ici.
‫D'accord, et donc ici c'est aussi newTransport, donc c'est
‫un peu moins déroutant.
‫Très bien?
‫Maintenant, rappelons-nous comment nous l'avons fait ici auparavant.
‫Nous avons donc eu
‫notre transporteur, que nous avons créé
‫séparément dans ce cas, puis nous avons enchaîné sendMail avec les options.
‫Alors saisissons-le ici, supprimons tout le code restant.
‫Donc, en gros, mettez-le ici comme référence.
‫D'accord?
‫Donc ce transporteur est maintenant ça.
‫Très bien?
‫Et ainsi de suite, nous enchaînons l'envoi d'e-mails, puis avec les
‫options de messagerie que nous avons définies ici.
‫Ensuite, il faut attendre tout
‫ça, car, bien sûr, c'est une fonction asynchrone.
‫Et donc marquons maintenant celui-ci ici comme asynchrone.
‫D'accord?
‫Et maintenant, nous devons également attendre la fonction ici.
‫Très bien?
‫Car ce. send est maintenant en effet une fonction asynchrone.
‫Et donc ici on attend ça pour que cette fonction ne revienne que
‫dès que l'email a effectivement été envoyé.
‫Et donc, bien sûr, marquez celui-ci comme asynchrone également.
‫Impressionnant.
‫C'est en fait tout pour cette classe.
‫Nous n'avons donc plus besoin de cet exemple.
‫D'accord?
‫Et donc dans la prochaine vidéo, nous
‫allons ensuite utiliser cette nouvelle classe afin d'envoyer un e-mail de bienvenue.
‫Alors, récapitulez très rapidement ce que nous avons fait ici.
‫Nous avons donc créé une nouvelle classe de courrier
‫électronique à partir de laquelle nous pouvons créer des objets
‫de courrier électronique que nous pouvons ensuite utiliser pour envoyer des courriers électroniques réels.
‫Et pour créer un nouvel objet e-mail, nous collerons l'utilisateur ainsi qu'une
‫URL que nous souhaitons voir dans cet e-mail.
‫Donc, ici, nous attribuons tout cela à l'objet actuel, ainsi
‫qu'à d'autres paramètres que nous souhaitons
‫avoir disponibles, tels que le prénom et l'e-mail de l'expéditeur.
‫Donc, fondamentalement, extraire ces informations
‫de la fonction d'envoi
‫et les avoir toutes au même endroit.
‫Ensuite, nous avons ici une nouvelle fonction de
‫transport qui permet de créer très facilement différents
‫transports pour différents environnements.
‫Et donc encore une fois, en faisant abstraction
‫de cette logique de la fonction d'envoi
‫réelle qui ne devrait se préoccuper que de l'envoi de l'e-mail.
‫D'accord?
‫Alors voici cette fonction d'envoi qui prend un modèle et
‫un sujet, et sur cette base, elle crée le code HTML à partir d'un
‫modèle carlin qui sera ensuite défini dans les options
‫de courrier électronique, qui, à la
‫fin de la fonction, puis enfin être envoyé dans cette
‫ligne de code.
‫D'accord?
‫Mais ce ne sera pas cette fonction d'envoi
‫que nous utiliserons dans notre code.
‫Au lieu de cela, nous allons créer
‫une fonction différente pour chaque type d'e-mail que
‫nous souhaitons envoyer.
‫Et le premier que j'ai créé ici est le sendWelcome.
‫Très bien?
‫Et donc, pour sendWelcome, nous avons ensuite prédéfini
‫le nom du modèle
‫comme bienvenue et le sujet comme cette chaîne.
‫D'accord?
‫Donc, j'espère que cela avait du sens, et je vous vois dans une seconde.