1
00:00:00,790 --> 00:00:02,400
‫Instructor: Con la parte de carga

2
00:00:02,400 --> 00:00:03,960
‫de archivos de la

3
00:00:03,960 --> 00:00:07,300
‫sección terminada, ahora dirijamos nuestra atención al envío de correos electrónicos.

4
00:00:07,300 --> 00:00:09,610
‫Y en realidad ya enviamos un

5
00:00:09,610 --> 00:00:13,170
‫correo electrónico antes para restablecer la contraseña, pero en las próximas

6
00:00:13,170 --> 00:00:16,050
‫conferencias llevaremos eso a un nivel completamente nuevo.

7
00:00:16,050 --> 00:00:18,760
‫Y lo que vamos a hacer es crear plantillas

8
00:00:18,760 --> 00:00:21,350
‫de correo electrónico con pug y enviar correos electrónicos

9
00:00:21,350 --> 00:00:23,270
‫reales utilizando el servicio SendGrid.

10
00:00:23,270 --> 00:00:25,220
‫Y ahora, en esta primera conferencia,

11
00:00:25,220 --> 00:00:27,630
‫crearemos un controlador de correo electrónico más sólido

12
00:00:27,630 --> 00:00:29,313
‫que el que teníamos antes.

13
00:00:30,870 --> 00:00:34,030
‫Entonces, abramos nuestra carpeta de utilidades, y

14
00:00:34,030 --> 00:00:38,510
‫luego aquí, recuerde, ya tenemos un archivo de correo electrónico.

15
00:00:38,510 --> 00:00:40,100
‫Pero en este momento

16
00:00:40,100 --> 00:00:43,660
‫lo que tenemos aquí es solo un controlador de envío de

17
00:00:43,660 --> 00:00:46,810
‫correo electrónico muy simple, que no puede admitir muchas opciones.

18
00:00:46,810 --> 00:00:48,120
‫Y ahora vamos a

19
00:00:48,120 --> 00:00:50,190
‫construir aquí una solución mucho más robusta.

20
00:00:50,190 --> 00:00:51,450
‫¿Está bien?

21
00:00:51,450 --> 00:00:53,833
‫Entonces, lo que voy a hacer es crear una

22
00:00:55,360 --> 00:00:57,503
‫clase, y esa clase se llamará correo electrónico.

23
00:00:58,750 --> 00:01:01,690
‫Entonces módulo. exportaciones, por lo

24
00:01:01,690 --> 00:01:03,950
‫que también esta clase es

25
00:01:03,950 --> 00:01:07,103
‫lo que vamos a exportar desde este archivo.

26
00:01:09,580 --> 00:01:13,340
‫Y luego, como siempre, una clase necesita una función constructora, que es

27
00:01:13,340 --> 00:01:16,170
‫básicamente la función que se ejecutará cuando se

28
00:01:16,170 --> 00:01:19,300
‫cree un nuevo objeto a través de esta clase.

29
00:01:19,300 --> 00:01:20,910
‫Ahora echemos un vistazo

30
00:01:20,910 --> 00:01:23,393
‫a cómo usaríamos esta clase en la práctica.

31
00:01:24,960 --> 00:01:26,770
‫Entonces, la idea, básicamente, cada

32
00:01:26,770 --> 00:01:28,840
‫vez que queremos enviar un nuevo

33
00:01:28,840 --> 00:01:32,960
‫correo electrónico, es importar esta clase de correo electrónico y luego usarla así.

34
00:01:32,960 --> 00:01:34,713
‫Entonces, al crear un nuevo

35
00:01:35,970 --> 00:01:38,490
‫correo electrónico, y luego en él, queremos pegar un

36
00:01:38,490 --> 00:01:41,150
‫usuario, y ese usuario contendrá la dirección de correo electrónico

37
00:01:41,150 --> 00:01:44,563
‫y también el nombre en caso de que queramos personalizar el correo electrónico.

38
00:01:45,800 --> 00:01:47,580
‫Y también una URL.

39
00:01:47,580 --> 00:01:49,120
‫Y un buen ejemplo

40
00:01:49,120 --> 00:01:53,200
‫de este es, por ejemplo, la URL de restablecimiento para restablecer la contraseña.

41
00:01:53,200 --> 00:01:54,033
‫¿Okey?

42
00:01:54,033 --> 00:01:56,660
‫Entonces, un nuevo objeto de correo electrónico, y luego

43
00:01:56,660 --> 00:01:59,000
‫queremos llamar al método que realmente va a

44
00:01:59,000 --> 00:02:00,570
‫enviar el correo electrónico.

45
00:02:00,570 --> 00:02:02,843
‫Entonces, digamos sendWelcome.

46
00:02:04,180 --> 00:02:07,410
‫Y ese será enviado cada vez que

47
00:02:07,410 --> 00:02:10,910
‫un nuevo usuario se registre en nuestra aplicación.

48
00:02:10,910 --> 00:02:11,743
‫¿Está bien?

49
00:02:11,743 --> 00:02:14,630
‫Luego, también tendremos que enviar el restablecimiento de la contraseña.

50
00:02:14,630 --> 00:02:16,480
‫Y la forma en que

51
00:02:16,480 --> 00:02:18,950
‫configuraremos todo esto hará que sea realmente

52
00:02:18,950 --> 00:02:21,490
‫fácil seguir agregando nuevos y nuevos métodos similares

53
00:02:21,490 --> 00:02:24,450
‫a este para enviar diferentes correos electrónicos para diferentes escenarios.

54
00:02:24,450 --> 00:02:25,370
‫¿Está bien?

55
00:02:25,370 --> 00:02:28,400
‫De todos modos, dado que pegamos el usuario

56
00:02:28,400 --> 00:02:31,670
‫y la URL en un nuevo correo electrónico, nuestro

57
00:02:31,670 --> 00:02:33,633
‫constructor necesita tomarlos como argumentos.

58
00:02:34,720 --> 00:02:36,560
‫Entonces usuario y URL.

59
00:02:36,560 --> 00:02:40,340
‫Entonces, lo que sucede en este constructor es que this. a será

60
00:02:43,020 --> 00:02:47,130
‫igual al usuario. email Luego también

61
00:02:49,926 --> 00:02:53,210
‫queremos definir el nombre del usuario, nuevamente

62
00:02:53,210 --> 00:02:56,433
‫para personalizar básicamente el correo electrónico.

63
00:02:59,903 --> 00:03:03,170
‫Y ese es el usuario. name y vamos

64
00:03:03,170 --> 00:03:08,170
‫a dividirlo y tomar solo el primer elemento en la matriz resultante.

65
00:03:09,530 --> 00:03:11,210
‫Así que hicimos

66
00:03:11,210 --> 00:03:16,210
‫esto antes, pero también esto. url es igual a la URL entrante.

67
00:03:17,010 --> 00:03:22,010
‫Finalmente, configuremos también esto. desde aquí.

68
00:03:22,500 --> 00:03:24,450
‫así que básicamente a nivel de objeto.

69
00:03:24,450 --> 00:03:26,970
‫Y así, cada objeto creado a partir de

70
00:03:26,970 --> 00:03:28,830
‫esta clase obtendrá esta propiedad.

71
00:03:28,830 --> 00:03:32,720
‫Y entonces este será similar al que tenemos aquí.

72
00:03:32,720 --> 00:03:35,020
‫Básicamente es esto de, así que

73
00:03:35,020 --> 00:03:36,760
‫copiémoslo, pero es

74
00:03:36,760 --> 00:03:40,230
‫bueno tenerlo en un lugar central como este.

75
00:03:40,230 --> 00:03:42,200
‫Ahora, una cosa que realmente quiero hacer

76
00:03:42,200 --> 00:03:45,090
‫es básicamente definir esta dirección de correo electrónico aquí

77
00:03:45,090 --> 00:03:46,770
‫como una variable de

78
00:03:46,770 --> 00:03:48,740
‫configuración y, por lo tanto, una

79
00:03:48,740 --> 00:03:50,440
‫variable de entorno que podemos

80
00:03:50,440 --> 00:03:54,073
‫cambiar muy fácilmente manipulando la configuración. env archivo.

81
00:03:55,774 --> 00:03:56,607
‫¿Está bien?

82
00:03:57,940 --> 00:04:00,100
‫Así que llamemos a este EMAIL_FROM.

83
00:04:02,490 --> 00:04:06,530
‫Y luego solo queremos la dirección de correo electrónico en sí.

84
00:04:06,530 --> 00:04:07,363
‫¿Está bien?

85
00:04:08,560 --> 00:04:10,840
‫Entonces, otro caso en el que es muy

86
00:04:10,840 --> 00:04:12,353
‫útil usar variables de entorno.

87
00:04:13,260 --> 00:04:15,360
‫Y ahora hagamos de esto una cadena de plantilla.

88
00:04:18,400 --> 00:04:20,840
‫Y, por supuesto, conéctelo aquí.

89
00:04:20,840 --> 00:04:23,153
‫Así que ese es el proceso. env. EMAIL DE.

90
00:04:28,540 --> 00:04:30,930
‫A continuación, creemos un método aquí

91
00:04:30,930 --> 00:04:33,230
‫para crear el transporte.

92
00:04:33,230 --> 00:04:35,563
‫Muy similar a lo que tenemos aquí.

93
00:04:37,640 --> 00:04:39,347
‫Así que createTransport.

94
00:04:43,450 --> 00:04:46,280
‫Y ahora aquí realmente queremos tener diferentes transportes, ya

95
00:04:46,280 --> 00:04:48,890
‫sea que estemos en producción o no.

96
00:04:48,890 --> 00:04:50,170
‫Entonces, cuando estamos

97
00:04:50,170 --> 00:04:52,470
‫en producción, queremos enviar correos electrónicos

98
00:04:52,470 --> 00:04:55,540
‫reales, y lo haremos un poco más tarde usando

99
00:04:55,540 --> 00:04:57,890
‫SendGrid, pero si no estamos en producción,

100
00:04:57,890 --> 00:05:00,730
‫aún queremos usar nuestra aplicación Mailtrap tal como

101
00:05:00,730 --> 00:05:03,270
‫lo hicimos antes cuando enviamos correos electrónicos.

102
00:05:03,270 --> 00:05:07,020
‫Entonces, en lugar de que el correo electrónico vaya a una dirección de

103
00:05:07,020 --> 00:05:10,730
‫correo electrónico real, quedará atrapado en nuestra bandeja de entrada de Mailtrap para

104
00:05:10,730 --> 00:05:12,260
‫que podamos echarle un

105
00:05:12,260 --> 00:05:13,843
‫vistazo en nuestro proceso de desarrollo.

106
00:05:14,950 --> 00:05:18,343
‫Entonces ese transportador será exactamente el mismo que este, así que copiémoslo,

107
00:05:19,870 --> 00:05:25,277
‫pero primero digamos if (process.

108
00:05:25,277 --> 00:05:25,277
‫env. NODE_ENV).

109
00:05:30,360 --> 00:05:32,360
‫Entonces, recuerde, así es como verificamos si

110
00:05:32,360 --> 00:05:34,110
‫estamos en producción o no.

111
00:05:36,390 --> 00:05:38,230
‫Entonces, si eso está

112
00:05:38,230 --> 00:05:39,620
‫en producción, y

113
00:05:39,620 --> 00:05:43,830
‫si estamos en producción, queremos crear un transportador para SendGrid.

114
00:05:43,830 --> 00:05:45,890
‫Así que pongamos eso aquí, y

115
00:05:45,890 --> 00:05:47,613
‫nuevamente lo haremos más tarde.

116
00:05:49,170 --> 00:05:51,410
‫Por ahora, devolvamos algo de aquí.

117
00:05:51,410 --> 00:05:53,133
‫No importa, digamos uno.

118
00:05:54,680 --> 00:05:55,513
‫¿Está bien?

119
00:05:56,750 --> 00:05:58,840
‫Y luego, básicamente, de lo contrario,

120
00:05:58,840 --> 00:06:02,493
‫queremos devolver este nodemailer. createTransport.

121
00:06:05,166 --> 00:06:05,999
‫¿Okey?

122
00:06:05,999 --> 00:06:06,840
‫Entonces, este

123
00:06:06,840 --> 00:06:11,293
‫Transporte aquí básicamente devolverá un nuevo transporte de nodemailer como este.

124
00:06:12,280 --> 00:06:14,660
‫O, por otro lado, cuando estemos

125
00:06:14,660 --> 00:06:17,333
‫en producción, entonces el que estará aquí.

126
00:06:18,500 --> 00:06:19,333
‫¿Okey?

127
00:06:19,333 --> 00:06:21,020
‫Así que eliminémoslo de aquí.

128
00:06:23,930 --> 00:06:26,773
‫Además, queremos eliminar este.

129
00:06:32,970 --> 00:06:35,480
‫Y ahora creemos el método de envío.

130
00:06:35,480 --> 00:06:37,520
‫Y este será el

131
00:06:37,520 --> 00:06:39,610
‫método que hará el envío real.

132
00:06:39,610 --> 00:06:40,443
‫¿Okey?

133
00:06:40,443 --> 00:06:43,650
‫Y este recibirá una plantilla y un tema.

134
00:06:43,650 --> 00:06:45,150
‫Y comprenderá un poco mejor

135
00:06:45,150 --> 00:06:48,003
‫por qué es así una vez que se complete toda la clase.

136
00:06:49,270 --> 00:06:50,103
‫¿Okey?

137
00:06:51,550 --> 00:06:53,513
‫Entonces plantilla y tema.

138
00:06:56,050 --> 00:06:58,553
‫Así que pongamos un comentario aquí de lo que hará esto.

139
00:07:01,170 --> 00:07:03,600
‫Y ahora, antes de escribir esta función,

140
00:07:03,600 --> 00:07:05,690
‫permítanme mostrarles cómo la usaremos y

141
00:07:05,690 --> 00:07:08,753
‫por qué necesitamos la plantilla y el tema aquí.

142
00:07:10,890 --> 00:07:12,893
‫Entonces, recuerde cómo dijimos

143
00:07:12,893 --> 00:07:16,890
‫aquí arriba que tendremos un método llamado sendWelcome, y también

144
00:07:16,890 --> 00:07:21,890
‫como un método para enviar un correo electrónico de restablecimiento de contraseña.

145
00:07:21,900 --> 00:07:26,353
‫Y ahora agreguemos eso aquí, así que envíenWelcome.

146
00:07:28,460 --> 00:07:31,430
‫Y este no recibe ningún argumento y todo lo

147
00:07:31,430 --> 00:07:34,410
‫que realmente hace es llamar a enviar con la plantilla

148
00:07:35,470 --> 00:07:37,030
‫y el asunto que

149
00:07:37,030 --> 00:07:38,690
‫queremos para este correo electrónico.

150
00:07:38,690 --> 00:07:39,523
‫¿Okey?

151
00:07:39,523 --> 00:07:41,800
‫Y nuevamente, esto hace que sea realmente

152
00:07:41,800 --> 00:07:43,370
‫fácil crear diferentes correos

153
00:07:43,370 --> 00:07:45,480
‫electrónicos para todo tipo de situaciones diferentes.

154
00:07:45,480 --> 00:07:46,550
‫¿Okey?

155
00:07:46,550 --> 00:07:49,297
‫Entonces tenemos esta función de envío de una ruta

156
00:07:49,297 --> 00:07:51,790
‫aquí y luego todas estas más específicas, que

157
00:07:51,790 --> 00:07:55,100
‫a su vez llamarán a la función de envío del enrutador

158
00:07:55,100 --> 00:07:57,150
‫que está haciendo el trabajo real.

159
00:07:57,150 --> 00:07:58,500
‫¿Okey?

160
00:07:58,500 --> 00:08:01,950
‫Y de hecho aquí está esto. enviar porque, por

161
00:08:01,950 --> 00:08:03,970
‫supuesto, estos métodos aquí,

162
00:08:03,970 --> 00:08:06,600
‫se definirán en el objeto actual.

163
00:08:06,600 --> 00:08:07,643
‫Y eso es esto.

164
00:08:09,530 --> 00:08:12,113
‫Luego aquí pegamos el nombre de la plantilla.

165
00:08:14,280 --> 00:08:16,630
‫Entonces, este nombre de plantilla que puse aquí,

166
00:08:16,630 --> 00:08:19,020
‫en el futuro será una plantilla pug que

167
00:08:19,020 --> 00:08:20,280
‫vamos a crear.

168
00:08:20,280 --> 00:08:22,320
‫Entonces, de hecho, en la próxima conferencia,

169
00:08:22,320 --> 00:08:24,600
‫crearemos esta plantilla de pug para enviar

170
00:08:24,600 --> 00:08:26,523
‫este correo electrónico de bienvenida.

171
00:08:27,710 --> 00:08:28,543
‫¿Okey?

172
00:08:28,543 --> 00:08:29,763
‫Y luego solo la línea de asunto.

173
00:08:31,250 --> 00:08:35,320
‫Digamos '¡Bienvenido a la familia Natours! 'Y así, de esta

174
00:08:37,550 --> 00:08:40,920
‫manera, no tenemos que preocuparnos por ninguno de los

175
00:08:40,920 --> 00:08:43,210
‫detalles de implementación cuando en realidad

176
00:08:43,210 --> 00:08:45,260
‫estamos enviando el correo electrónico.

177
00:08:45,260 --> 00:08:47,290
‫Entonces, por ejemplo, en el punto de

178
00:08:47,290 --> 00:08:49,510
‫nuestro código donde queremos enviar el correo electrónico

179
00:08:49,510 --> 00:08:51,900
‫de bienvenida, no tenemos que preocuparnos por los nombres

180
00:08:51,900 --> 00:08:54,130
‫de las plantillas ni por las líneas de asunto.

181
00:08:54,130 --> 00:08:57,130
‫Todo lo que vamos a hacer es enviar un correo electrónico

182
00:08:57,130 --> 00:08:58,260
‫de bienvenida y listo.

183
00:08:58,260 --> 00:09:00,380
‫Y luego nuestra clase

184
00:09:00,380 --> 00:09:03,563
‫se encargará de ocuparse de la implementación.

185
00:09:04,880 --> 00:09:05,780
‫¿Está bien?

186
00:09:05,780 --> 00:09:09,023
‫De todos modos, ahora construyamos esta función de envío.

187
00:09:10,180 --> 00:09:14,560
‫Entonces, lo que vamos a hacer en esta función,

188
00:09:14,560 --> 00:09:19,560
‫es primero renderizar el HTML para el correo electrónico basado en

189
00:09:20,820 --> 00:09:22,663
‫una plantilla pug.

190
00:09:25,650 --> 00:09:27,550
‫Básicamente, el que

191
00:09:27,550 --> 00:09:29,823
‫estamos pegando aquí con plantilla.

192
00:09:31,750 --> 00:09:34,533
‫Luego, defina las opciones de correo electrónico

193
00:09:36,570 --> 00:09:40,883
‫y, una vez más, será muy similar a este, y de

194
00:09:41,750 --> 00:09:43,530
‫hecho, déjeme seguir

195
00:09:43,530 --> 00:09:46,453
‫adelante, cortarlo de aquí y pegarlo aquí.

196
00:09:48,130 --> 00:09:49,000
‫¿Okey?

197
00:09:49,000 --> 00:09:51,600
‫Por supuesto que no va a ser exactamente lo mismo, pero

198
00:09:51,600 --> 00:09:53,573
‫lo dejaremos para un poco más adelante.

199
00:09:54,500 --> 00:09:55,333
‫¿Está bien?

200
00:09:55,333 --> 00:09:56,323
‫Y finalmente,

201
00:09:58,690 --> 00:10:01,423
‫cree un transporte y envíe un correo electrónico.

202
00:10:06,930 --> 00:10:07,880
‫¿Okey?

203
00:10:07,880 --> 00:10:10,530
‫Y eso es, lo dejo también para más tarde.

204
00:10:13,120 --> 00:10:15,440
‫Entonces, comenzando con el punto número uno.

205
00:10:15,440 --> 00:10:18,670
‫Y, por lo general, hasta este punto, solo usamos pug para

206
00:10:18,670 --> 00:10:20,160
‫crear una plantilla, y

207
00:10:20,160 --> 00:10:22,370
‫luego pasamos el nombre de la plantilla

208
00:10:22,370 --> 00:10:24,780
‫a la función de renderizado en la respuesta.

209
00:10:24,780 --> 00:10:25,870
‫Derecha.

210
00:10:25,870 --> 00:10:27,820
‫Así que siempre lo usamos

211
00:10:29,890 --> 00:10:31,723
‫así res. render, y

212
00:10:31,723 --> 00:10:33,630
‫luego aquí el nombre de la plantilla.

213
00:10:33,630 --> 00:10:34,810
‫¿Derecha?

214
00:10:34,810 --> 00:10:37,370
‫Y lo que hace esta función de renderizado

215
00:10:37,370 --> 00:10:41,200
‫detrás de escena es básicamente crear el HTML basado en la plantilla

216
00:10:41,200 --> 00:10:43,450
‫pug y luego enviarlo al cliente.

217
00:10:43,450 --> 00:10:46,840
‫Ahora, en este caso, realmente no queremos renderizar, todo

218
00:10:46,840 --> 00:10:50,400
‫lo que queremos hacer es básicamente crear el HTML a partir

219
00:10:50,400 --> 00:10:53,960
‫de la plantilla para que luego podamos enviar ese HTML como

220
00:10:53,960 --> 00:10:55,110
‫el correo electrónico.

221
00:10:55,110 --> 00:10:58,520
‫Básicamente, definirlo aquí como una opción HTML en estas

222
00:10:58,520 --> 00:11:00,070
‫opciones de correo.

223
00:11:00,070 --> 00:11:00,960
‫¿Okey?

224
00:11:00,960 --> 00:11:04,900
‫Entonces, recuerde cómo podemos especificar texto y HTML.

225
00:11:04,900 --> 00:11:08,790
‫Y principalmente nos interesa enviar un correo electrónico HTML.

226
00:11:08,790 --> 00:11:11,340
‫Y es por eso que vamos a tener una plantilla

227
00:11:11,340 --> 00:11:13,843
‫pug a partir de la cual generaremos este HTML.

228
00:11:15,130 --> 00:11:16,120
‫¿Okey?

229
00:11:16,120 --> 00:11:18,720
‫Entonces no va a funcionar así, sino

230
00:11:18,720 --> 00:11:20,770
‫que en realidad necesitamos requerir el

231
00:11:20,770 --> 00:11:22,173
‫paquete pug aquí.

232
00:11:24,560 --> 00:11:25,443
‫Entonces,

233
00:11:27,200 --> 00:11:28,780
‫pug así, y

234
00:11:28,780 --> 00:11:32,600
‫luego necesitamos usar pug.

235
00:11:32,600 --> 00:11:32,600
‫renderFile.

236
00:11:36,890 --> 00:11:37,723
‫¿Okey?

237
00:11:37,723 --> 00:11:39,490
‫Y entonces esto tomará el

238
00:11:39,490 --> 00:11:42,450
‫archivo y luego convertirá el código pug en HTML real.

239
00:11:42,450 --> 00:11:43,283
‫¿Okey?

240
00:11:43,283 --> 00:11:48,120
‫Y para que luego podamos guardar en una variable HTML.

241
00:11:48,120 --> 00:11:48,953
‫¿Está bien?

242
00:11:49,870 --> 00:11:52,330
‫Entonces, ¿dónde está ese archivo?

243
00:11:52,330 --> 00:11:55,173
‫Bueno, está en dirname, entonces D-I-R name, que

244
00:11:56,460 --> 00:11:58,500
‫recuerda es la ubicación del

245
00:11:58,500 --> 00:12:00,120
‫script que se

246
00:12:00,120 --> 00:12:01,960
‫está ejecutando actualmente, y eso

247
00:12:01,960 --> 00:12:05,133
‫es, ahora mismo, en esta carpeta de utilidades.

248
00:12:06,570 --> 00:12:07,403
‫¿Okey?

249
00:12:07,403 --> 00:12:10,223
‫Entonces, a partir de ahí, debemos avanzar un paso, luego

250
00:12:12,010 --> 00:12:16,000
‫ir a las vistas, y desde allí ir a una carpeta de correos electrónicos

251
00:12:16,860 --> 00:12:18,950
‫que también crearemos en un segundo.

252
00:12:18,950 --> 00:12:19,783
‫Y luego ahí

253
00:12:19,783 --> 00:12:22,103
‫es donde vamos a tener el archivo de plantilla.

254
00:12:23,450 --> 00:12:28,650
‫Entonces plantilla}.

255
00:12:28,650 --> 00:12:28,650
‫doguillo.

256
00:12:28,650 --> 00:12:32,340
‫Entonces, para el correo electrónico de bienvenida, esta plantilla

257
00:12:32,340 --> 00:12:34,180
‫se llamará bienvenida.

258
00:12:34,180 --> 00:12:38,920
‫Y ahora creemos eso aquí en las vistas, creemos una nueva

259
00:12:38,920 --> 00:12:40,293
‫carpeta, un correo

260
00:12:42,910 --> 00:12:45,623
‫electrónico y luego un nuevo archivo,

261
00:12:47,730 --> 00:12:48,677
‫bienvenido. doguillo.

262
00:12:49,784 --> 00:12:50,660
‫¿Okey?

263
00:12:50,660 --> 00:12:52,860
‫Y no vamos a crear realmente esta

264
00:12:52,860 --> 00:12:56,130
‫plantilla en este video, pero solo quería mostrarles cómo

265
00:12:56,130 --> 00:12:58,320
‫va a funcionar todo esto.

266
00:12:58,320 --> 00:12:59,153
‫¿Okey?

267
00:12:59,153 --> 00:13:01,750
‫Entonces, esta bienvenida se pegará aquí en

268
00:13:01,750 --> 00:13:06,060
‫la plantilla y luego tomará ese archivo de la carpeta de vistas.

269
00:13:06,060 --> 00:13:06,893
‫¿Derecha?

270
00:13:06,893 --> 00:13:08,710
‫Entonces, ese es el primer paso.

271
00:13:08,710 --> 00:13:11,043
‫A continuación, definamos las opciones de correo electrónico.

272
00:13:11,980 --> 00:13:16,980
‫Entonces, de ahora es esto. de.

273
00:13:17,110 --> 00:13:17,943
‫¿Recordar?

274
00:13:19,060 --> 00:13:20,183
‫Así que aquí mismo.

275
00:13:21,820 --> 00:13:23,710
‫A

276
00:13:26,130 --> 00:13:30,200
‫continuación, tenemos esto. a, y también tenemos el

277
00:13:30,200 --> 00:13:34,230
‫tema que es igual al tema que viene aquí, y

278
00:13:34,230 --> 00:13:37,700
‫entonces, yah, en realidad ni siquiera necesitamos definir este

279
00:13:39,550 --> 00:13:41,383
‫y tenemos nuestro HTML.

280
00:13:42,590 --> 00:13:45,670
‫Así que, o por supuesto, eso

281
00:13:45,670 --> 00:13:49,213
‫ni siquiera es necesario porque es el mismo nombre.

282
00:13:51,760 --> 00:13:55,427
‫Ahora, a continuación, también queremos incluir una versión de texto de

283
00:13:55,427 --> 00:13:57,960
‫nuestro correo electrónico en el correo electrónico.

284
00:13:57,960 --> 00:13:58,793
‫¿Okey?

285
00:13:58,793 --> 00:14:01,750
‫Y eso es realmente importante porque es mejor para las

286
00:14:01,750 --> 00:14:05,560
‫tasas de entrega de correo electrónico y también para las carpetas de correo no deseado.

287
00:14:05,560 --> 00:14:06,670
‫¿Está bien?

288
00:14:06,670 --> 00:14:11,130
‫Y también algunas personas prefieren los correos electrónicos de texto simple en

289
00:14:11,130 --> 00:14:14,970
‫lugar de tener los correos electrónicos HTML con más formato.

290
00:14:14,970 --> 00:14:15,900
‫¿Está bien?

291
00:14:15,900 --> 00:14:18,830
‫Básicamente, necesitamos una forma de convertir todo

292
00:14:18,830 --> 00:14:21,560
‫el HTML en texto simple.

293
00:14:21,560 --> 00:14:25,760
‫Así que eliminando todo el HTML dejando solo el contenido.

294
00:14:25,760 --> 00:14:27,980
‫Y para hacer eso,

295
00:14:27,980 --> 00:14:29,193
‫vamos

296
00:14:31,640 --> 00:14:36,640
‫a instalar otro paquete, y este se llama html-to-text.

297
00:14:40,640 --> 00:14:41,810
‫¿Está bien?

298
00:14:41,810 --> 00:14:43,133
‫Incluyémoslo aquí,

299
00:14:46,161 --> 00:14:46,994
‫ToText.

300
00:14:50,520 --> 00:14:54,103
‫require ('html-to-text'), así.

301
00:14:56,150 --> 00:14:57,560
‫¿Okey?

302
00:14:57,560 --> 00:15:00,973
‫Ahora usemos eso para convertir nuestro HTML.

303
00:15:03,260 --> 00:15:07,080
‫Entonces usamos htmlToText. fromString y luego

304
00:15:09,877 --> 00:15:12,340
‫esa cadena se almacena en HTML.

305
00:15:13,300 --> 00:15:14,133
‫¿Derecha?

306
00:15:15,620 --> 00:15:18,230
‫Entonces, estas son nuestras opciones de correo, y

307
00:15:18,230 --> 00:15:21,160
‫de hecho, olvidé algo muy, muy importante, aquí en este

308
00:15:21,160 --> 00:15:24,130
‫primer paso, en este archivo de renderizado, porque al igual

309
00:15:24,130 --> 00:15:27,200
‫que con la respuesta. render, también podemos

310
00:15:27,200 --> 00:15:30,010
‫pegar datos en el archivo de render.

311
00:15:30,010 --> 00:15:32,160
‫Y, por supuesto, eso es

312
00:15:32,160 --> 00:15:35,390
‫muy importante si realmente queremos personalizar o enviar un correo

313
00:15:35,390 --> 00:15:38,283
‫electrónico con el nombre y también pegar la URL.

314
00:15:39,580 --> 00:15:42,590
‫Y hagámoslo como lo hacíamos normalmente en la

315
00:15:42,590 --> 00:15:44,053
‫función de renderizado.

316
00:15:46,290 --> 00:15:51,290
‫Así que ese es FirstName, envíalo a esto. firstName, y la

317
00:15:53,733 --> 00:15:58,733
‫URL es esta. url, y también peguemos el asunto

318
00:15:58,910 --> 00:16:01,300
‫y verá un poco más adelante

319
00:16:02,260 --> 00:16:04,623
‫por qué lo necesitamos.

320
00:16:06,690 --> 00:16:08,300
‫¿Okey?

321
00:16:08,300 --> 00:16:11,210
‫Entonces, ahora finalmente creemos un transporte usando

322
00:16:11,210 --> 00:16:13,680
‫nuestra función de crear transporte, y

323
00:16:13,680 --> 00:16:15,940
‫luego enviemos el correo electrónico.

324
00:16:15,940 --> 00:16:20,867
‫Entonces, bastante justo, eso es esto. createTransport.

325
00:16:23,670 --> 00:16:28,670
‫Entonces, recuerde que este es solo este método aquí, este, y tiene

326
00:16:29,200 --> 00:16:30,960
‫exactamente el mismo nombre

327
00:16:30,960 --> 00:16:33,980
‫que esta función aquí proveniente de nodemailer.

328
00:16:33,980 --> 00:16:35,450
‫Así que eso

329
00:16:35,450 --> 00:16:38,583
‫es un poco confuso, así que llamémoslo newTransport aquí.

330
00:16:40,380 --> 00:16:43,847
‫Bien, y aquí también es newTransport, para que sea

331
00:16:45,370 --> 00:16:47,520
‫un poco menos confuso.

332
00:16:47,520 --> 00:16:48,500
‫¿Está bien?

333
00:16:48,500 --> 00:16:50,783
‫Ahora recordemos cómo lo hicimos aquí antes.

334
00:16:51,620 --> 00:16:53,330
‫Así que teníamos

335
00:16:53,330 --> 00:16:55,700
‫nuestro transportador, que creamos por

336
00:16:55,700 --> 00:17:00,360
‫separado en este caso, y luego encadenamos sendMail con las opciones.

337
00:17:00,360 --> 00:17:04,373
‫Así que tomemos eso aquí, eliminemos todo el código restante.

338
00:17:07,220 --> 00:17:09,320
‫Así que básicamente pon eso aquí como referencia.

339
00:17:10,280 --> 00:17:11,130
‫¿Okey?

340
00:17:11,130 --> 00:17:13,123
‫Entonces este transportador es ahora esto.

341
00:17:16,470 --> 00:17:17,700
‫¿Está bien?

342
00:17:17,700 --> 00:17:21,170
‫Y luego a eso, enviamos en cadena el correo electrónico y luego

343
00:17:21,170 --> 00:17:23,993
‫con las opciones de correo que definimos aquí.

344
00:17:25,010 --> 00:17:27,040
‫Entonces, debemos esperar todo

345
00:17:27,040 --> 00:17:30,220
‫esto, porque, por supuesto, es una función asincrónica.

346
00:17:30,220 --> 00:17:33,043
‫Y ahora marquemos este aquí como asíncrono.

347
00:17:34,880 --> 00:17:35,730
‫¿Okey?

348
00:17:35,730 --> 00:17:40,083
‫Y ahora, también debemos esperar la función aquí.

349
00:17:41,490 --> 00:17:42,323
‫¿Está bien?

350
00:17:42,323 --> 00:17:46,120
‫Porque esto. enviar ahora es de hecho una función asíncrona.

351
00:17:46,120 --> 00:17:49,800
‫Y aquí esperamos eso para que esta función solo regrese tan pronto

352
00:17:49,800 --> 00:17:52,000
‫como se haya enviado el correo electrónico.

353
00:17:53,120 --> 00:17:56,533
‫Y así, por supuesto, marque este también como asíncrono.

354
00:17:58,130 --> 00:17:59,380
‫Impresionante.

355
00:17:59,380 --> 00:18:02,920
‫Eso es todo para esta clase.

356
00:18:02,920 --> 00:18:05,523
‫Entonces ya no necesitamos este ejemplo.

357
00:18:06,450 --> 00:18:07,283
‫¿Okey?

358
00:18:07,283 --> 00:18:09,740
‫Entonces, en el siguiente video, seguiremos adelante

359
00:18:09,740 --> 00:18:13,570
‫y usaremos esta nueva clase para enviar un correo electrónico de bienvenida.

360
00:18:13,570 --> 00:18:16,570
‫Entonces, recapitulemos muy rápidamente lo que hicimos aquí.

361
00:18:16,570 --> 00:18:18,600
‫Así que creamos una nueva clase de correo

362
00:18:18,600 --> 00:18:20,730
‫electrónico a partir de la cual podemos crear objetos

363
00:18:20,730 --> 00:18:23,610
‫de correo electrónico que luego podemos usar para enviar correos electrónicos reales.

364
00:18:23,610 --> 00:18:28,010
‫Y para crear un nuevo objeto de correo electrónico, pegaremos el usuario y también

365
00:18:28,010 --> 00:18:31,330
‫una URL que queremos que esté en ese correo electrónico.

366
00:18:31,330 --> 00:18:35,160
‫Entonces, aquí asignamos todas esas cosas al objeto actual, y

367
00:18:35,160 --> 00:18:37,940
‫también algunas otras configuraciones que queremos

368
00:18:37,940 --> 00:18:41,890
‫tener disponibles, como el nombre y el correo electrónico del remitente.

369
00:18:41,890 --> 00:18:44,000
‫Básicamente, abstraer esta información de

370
00:18:44,000 --> 00:18:45,990
‫la función de envío

371
00:18:45,990 --> 00:18:48,550
‫y tenerlo todo en un lugar central.

372
00:18:48,550 --> 00:18:51,360
‫Entonces tenemos aquí una nueva función de transporte

373
00:18:51,360 --> 00:18:54,290
‫que hace que sea realmente fácil crear diferentes

374
00:18:54,290 --> 00:18:55,940
‫transportes para diferentes entornos.

375
00:18:55,940 --> 00:18:58,500
‫Y así, una vez más, abstrayendo esa

376
00:18:58,500 --> 00:19:00,770
‫lógica de la función de envío

377
00:19:00,770 --> 00:19:04,093
‫real, que solo debería preocuparse por enviar el correo electrónico.

378
00:19:05,120 --> 00:19:05,953
‫¿Okey?

379
00:19:05,953 --> 00:19:09,500
‫Entonces aquí está esa función de envío que toma una

380
00:19:09,500 --> 00:19:14,240
‫plantilla y un asunto, y en base a eso crea el HTML a partir

381
00:19:14,240 --> 00:19:17,370
‫de una plantilla pug que luego se configurará en

382
00:19:17,370 --> 00:19:19,830
‫las opciones de correo electrónico, que,

383
00:19:19,830 --> 00:19:23,150
‫al final de la función, finalmente enviarse en esta

384
00:19:23,150 --> 00:19:24,470
‫línea de código.

385
00:19:24,470 --> 00:19:25,390
‫¿Okey?

386
00:19:25,390 --> 00:19:27,880
‫Pero no será esta función de envío la

387
00:19:27,880 --> 00:19:29,950
‫que usaremos en nuestro código.

388
00:19:29,950 --> 00:19:31,840
‫Entonces, en cambio, crearemos una función

389
00:19:31,840 --> 00:19:34,183
‫diferente para cada tipo de correo electrónico

390
00:19:34,183 --> 00:19:35,417
‫que queremos enviar.

391
00:19:35,417 --> 00:19:39,380
‫Y el primero que creé aquí es sendWelcome.

392
00:19:39,380 --> 00:19:40,213
‫¿Está bien?

393
00:19:40,213 --> 00:19:43,440
‫Entonces, para sendWelcome, básicamente preestablecemos el nombre de

394
00:19:43,440 --> 00:19:45,420
‫la plantilla como

395
00:19:45,420 --> 00:19:48,480
‫bienvenido y el asunto como esta cadena.

396
00:19:48,480 --> 00:19:49,313
‫¿Okey?

397
00:19:49,313 --> 00:19:52,723
‫Entonces, espero que tenga sentido, y los veo en un segundo.