13 Multi-container app - Aplicación de Nest

Esta es una vista previa del archivo. Inicie sesión para ver el archivo original

1
00:00:05,740 --> 00:00:11,200
El tercer contenedor que nosotros vamos a colocar en nuestro multi container App es esta aplicación
2
00:00:11,200 --> 00:00:15,030
de Pokemon que está construido a Inés y es básicamente un back in.
3
00:00:15,040 --> 00:00:20,050
También tiene su parte del frontend, que es para la gente, hace una petición a cierta carpeta pública,
4
00:00:20,050 --> 00:00:22,180
entonces nuestro mensaje ya lo vamos a ver.
5
00:00:22,420 --> 00:00:28,990
Pero técnicamente esto es puramente nuestro imagen que se conecta a la base de datos y hace el procesamiento
6
00:00:28,990 --> 00:00:29,740
de los mismos.
7
00:00:30,220 --> 00:00:34,390
Si ustedes estarán pensando que seguramente ya, ya sé que lo van a decir después.
8
00:00:34,390 --> 00:00:39,370
Ustedes pueden tener su aplicación del frontend también como una imagen y simplemente se monta esa imagen.
9
00:00:39,370 --> 00:00:43,810
Se le manda la variable de entorno, que sería en este caso cuál es la cadena de conexión a mi backend,
10
00:00:44,080 --> 00:00:45,490
y eso básicamente sería todo.
11
00:00:45,760 --> 00:00:52,090
Técnicamente podríamos montar nuestra aplicación del forum dentro de este backend, pero entre más tareas
12
00:00:52,090 --> 00:00:56,020
individuales haga, cada uno de estos contenedores es mejor, es mejor, Es mejor tener una aplicación
13
00:00:56,020 --> 00:01:00,940
que se encargue de hacer el backend y después nosotros simplemente actualizamos el front si es necesario
14
00:01:00,940 --> 00:01:04,450
o después solo actualizamos el backend si es necesario, pero no tendríamos que.
15
00:01:04,450 --> 00:01:09,010
No tendría mucho sentido hacer una modificación en ambos lugares de manera simultánea.
16
00:01:09,010 --> 00:01:13,300
Es decir, si algo pequeño cambian el en el backend porque el frontend tiene que verse afectado.
17
00:01:14,080 --> 00:01:16,750
En fin, son discusiones que se pueden tener después.
18
00:01:17,290 --> 00:01:20,770
En fin, en el material adjunto ustedes tienen un enlace que los lleva directamente a este repositorio
19
00:01:20,770 --> 00:01:21,490
que es mío.
20
00:01:21,490 --> 00:01:27,610
Yo lo subí a esta aplicación y si nos vamos a la parte de los tags van a ver algo interesante que vemos
21
00:01:27,610 --> 00:01:31,330
que hay diferentes arquitecturas de procesadores que están acá y de sistemas operativos que básicamente
22
00:01:31,330 --> 00:01:36,280
solo son Linux, pero son diferentes arquitecturas de Linux o de procesador, mejor dicho, procesadores
23
00:01:36,280 --> 00:01:37,260
que nosotros tenemos ahí.
24
00:01:37,720 --> 00:01:42,550
Esto es algo interesante, porque si nosotros buscamos Mongo, por ejemplo, y nos vamos a la imagen
25
00:01:42,550 --> 00:01:50,860
oficial de Mongo Tags van a ver que hay para diferentes arquitecturas de Windows, Linux o Mac.
26
00:01:50,860 --> 00:01:55,540
También es importante que nosotros hagamos nuestras imágenes, que esto también lo vamos a aprender
27
00:01:55,540 --> 00:01:59,830
muy pronto, hacerlas de múltiples arquitecturas, porque puede ser que ustedes se encuentren con una
28
00:01:59,830 --> 00:02:04,300
computadora que tiene cierto tipo de arquitectura de procesador, que cuando ustedes construyen la imagen,
29
00:02:04,300 --> 00:02:09,280
esa imagen está construida solo para esa arquitectura de procesador y su imagen intenta correrse en
30
00:02:09,280 --> 00:02:16,450
otro procesador puede ser, o en otra arquitectura procesador van a tener que o hacer o quedó que compus
31
00:02:16,450 --> 00:02:24,460
o o quedó que le haga el puente de compatibilidad, que eso reduce la eficiencia del contenedor o bien
32
00:02:24,460 --> 00:02:28,360
simplemente le va a decir no, yo no puedo correr eso y les lanza un error, especialmente si ustedes
33
00:02:28,360 --> 00:02:31,600
lo despliegan en HTML, Amazon, web service o cualquier lado.
34
00:02:31,600 --> 00:02:36,310
Si no está para arquitectura en la cual ustedes van a correr, su procesador ni siquiera les va a permitir
35
00:02:36,310 --> 00:02:37,030
una emulación.
36
00:02:37,470 --> 00:02:39,610
Y ya vamos a ver cómo hacer todo eso muy pronto.
37
00:02:39,610 --> 00:02:42,870
Y esto es parte de los ejercicios que nosotros vamos a hacer muy pronto, muy pronto.
38
00:02:42,880 --> 00:02:46,300
Ok, hagamos la tercera en nuestro tercer contenedor.
39
00:02:47,290 --> 00:02:51,220
Note que aquí dice que la aplicación está hecha a Good News, como se expone el puerto 3000.
40
00:02:51,250 --> 00:02:54,400
Estas son las variables de entorno necesaria que supongo debe indivi name.
41
00:02:54,790 --> 00:02:58,190
Estos son nombres de variables de entorno que yo definí en la aplicación intencionalmente.
42
00:02:58,210 --> 00:03:01,570
Les puse esos nombres una vez ya se tiene montada la aplicación.
43
00:03:01,600 --> 00:03:03,460
Note que está exponiendo el puerto 3000.
44
00:03:03,730 --> 00:03:10,000
Podemos mandar a llamar esto para cargar la e mandar a cargar nuestra semilla de la base de datos que
45
00:03:10,000 --> 00:03:11,680
está ahí y a la data inicial.
46
00:03:11,920 --> 00:03:13,630
Y también podemos probar un endpoint.
47
00:03:13,660 --> 00:03:17,950
Acá no tiene mucho sentido explicar todo el funcionamiento de la aplicación, pero con esto es más que
48
00:03:17,950 --> 00:03:18,520
suficiente.
49
00:03:18,550 --> 00:03:19,900
Echemos a andar esta aplicación.
50
00:03:20,320 --> 00:03:21,480
Vámonos a los tags.
51
00:03:21,520 --> 00:03:23,260
No usen el Layret.
52
00:03:23,260 --> 00:03:27,370
Recuerden, no usemos el vamos a usar en este caso la versión uno punto 0.0.
53
00:03:28,270 --> 00:03:31,820
Entonces pueden venir a copiarse todo este URL.
54
00:03:31,840 --> 00:03:33,030
Este es el usuario.
55
00:03:33,040 --> 00:03:36,610
Este es el La imagen propiamente está en este usuario.
56
00:03:37,330 --> 00:03:37,620
Copien.
57
00:03:37,630 --> 00:03:38,440
Piense todo esto.
58
00:03:39,040 --> 00:03:40,960
O mejor aún, podemos hacer clic aquí.
59
00:03:41,230 --> 00:03:43,750
Regresemos a Visual Studio Code.
60
00:03:44,500 --> 00:03:49,690
Voy a presionar Enter Enter un shift con tab para que esté al mismo nivel de manejo expreso y todo lo
61
00:03:49,690 --> 00:03:50,260
demás.
62
00:03:50,260 --> 00:03:55,200
Y este se va a llamar Poke menos app dos puntos tab enter de pens on.
63
00:03:55,330 --> 00:03:56,470
De qué va a depender esto?
64
00:03:56,470 --> 00:03:58,210
Va a depender de la base de datos.
65
00:03:58,270 --> 00:04:02,350
Enter menos espacio y va a depender también de Mongo Express.
66
00:04:02,380 --> 00:04:08,890
Técnicamente no ocuparía Mount o Express porque son independientes uno de uno del otro, pero voy a
67
00:04:08,890 --> 00:04:12,970
esperarme a que Mongo Express esté terminado y luego pues ir con el siguiente paso.
68
00:04:14,430 --> 00:04:16,950
Qué puertos o qué imagen es la que voy a ocupar.
69
00:04:17,190 --> 00:04:22,230
Yo le recomendaría que así como esté esa estructura, es decir, de Pence, Image, Environment, Sports,
70
00:04:22,230 --> 00:04:24,990
restart, se hagan todas para mantener el mismo estándar.
71
00:04:25,470 --> 00:04:32,010
Sólo es una recomendación, pero no es obligatorio y la imagen que vamos a utilizar es esta De aquí
72
00:04:32,310 --> 00:04:37,980
el nombre de usuario, el nombre de la imagen y el tag que es uno punto 0.0.
73
00:04:38,250 --> 00:04:41,700
Ahí se va a encargar de usarlo basado en la arquitectura correspondiente.
74
00:04:42,100 --> 00:04:45,180
Y probé esto en Windows y en Mac también.
75
00:04:45,450 --> 00:04:46,010
Ya lo hice.
76
00:04:46,020 --> 00:04:48,530
Estas pruebas para que funcione esa parte de las arquitecturas.
77
00:04:49,380 --> 00:04:51,000
En fin, voy a presionar un enter.
78
00:04:51,180 --> 00:04:53,850
Ahora viene una parte interesante que son los Ports.
79
00:04:54,030 --> 00:04:54,870
Qué puerto?
80
00:04:54,870 --> 00:04:55,890
Ese que necesito exponer.
81
00:04:55,940 --> 00:04:59,940
Bueno, yo quiero exponerlo en el puerto 3000 de mi equipo con el puerto 3000 del contenedor, porque
82
00:04:59,940 --> 00:05:03,600
yo sé que el contenedor lo expone porque así dice la documentación, así está el código.
83
00:05:03,840 --> 00:05:07,920
Y quien sea que creó el backend debería decir a mí en qué puerto está corriendo eso?
84
00:05:08,100 --> 00:05:12,060
O bien si es una variable de entorno que especifique la variable de entorno que también está configurada,
85
00:05:12,060 --> 00:05:13,180
pero eso es otra cosa.
86
00:05:13,200 --> 00:05:15,720
No quiero hablar mucho sobre cómo está construida esa aplicación.
87
00:05:16,420 --> 00:05:17,880
Ok, ya tenemos esa parte de los puertos.
88
00:05:17,880 --> 00:05:21,000
Vamos con los Environment Environment.
89
00:05:22,570 --> 00:05:24,550
Si se preguntan cómo hago para que aparezca la ayuda?
90
00:05:24,550 --> 00:05:25,840
Yo presiono control espaciadora.
91
00:05:26,260 --> 00:05:30,550
La variable de entorno me está pidiendo que sea el Overview.
92
00:05:30,620 --> 00:05:34,600
Está pidiendo que sea MongoDB, que básicamente es el servicio de Mongo con el puerto.
93
00:05:34,600 --> 00:05:35,800
27 cero 17.
94
00:05:37,000 --> 00:05:37,770
Los puntos.
95
00:05:37,780 --> 00:05:45,240
Y también me está pidiendo el Divine Time que este Divine debería de ser el mismo Divine que se conecta
96
00:05:45,280 --> 00:05:49,990
con Express porque es el mismo nombre del servidor donde está corriendo la base de datos para la parte
97
00:05:49,990 --> 00:05:51,490
de la cadena de conexión.
98
00:05:51,670 --> 00:05:52,700
Cómo lo pide?
99
00:05:52,840 --> 00:05:56,890
Está pidiéndolo de esta manera con el protocolo, con todo esto.
100
00:05:57,490 --> 00:06:03,040
Control C básicamente es el servicio de Mongo que nosotros ocupamos llamar, solo que aquí es un poquito
101
00:06:03,040 --> 00:06:03,610
diferente.
102
00:06:03,610 --> 00:06:06,010
Porque recuerden, si yo lo dejo así, funcionaría.
103
00:06:06,010 --> 00:06:09,490
Pero mi cadena de conexión de Mongo requiere autenticación.
104
00:06:09,490 --> 00:06:11,500
Entonces tengo que crear la autenticación aquí.
105
00:06:11,770 --> 00:06:13,660
Entonces el protocolo de Mongo DB Está bien.
106
00:06:14,020 --> 00:06:14,800
Luego viene.
107
00:06:15,190 --> 00:06:18,940
Si ustedes acuerdan, déjenme abrir para refrescarle la memoria.
108
00:06:19,150 --> 00:06:20,680
Hace clic derecho aquí Editar.
109
00:06:21,640 --> 00:06:24,280
Se acordarán que era Mongo de las islas.
110
00:06:24,310 --> 00:06:25,950
Nombre de usuario dos puntos.
111
00:06:25,960 --> 00:06:27,220
Password arroba.
112
00:06:27,490 --> 00:06:28,780
El host dos puntos.
113
00:06:28,780 --> 00:06:31,240
Puerto 27 27 cero 17.
114
00:06:31,240 --> 00:06:32,350
Pueden copiarse esto?
115
00:06:33,430 --> 00:06:34,090
Venir aquí.
116
00:06:34,270 --> 00:06:35,020
Ven, helo acá.
117
00:06:35,530 --> 00:06:40,870
Y ahora ocupamos hacer el reemplazo de cada una de estas variables por variables de entorno.
118
00:06:41,260 --> 00:06:43,960
Por ejemplo, empezaríamos con el username.
119
00:06:45,090 --> 00:06:47,130
Que yo sé que el username sería en este caso Strider.
120
00:06:47,130 --> 00:06:49,650
Voy a pegarlo pero tengo que tomarlo de la variable de entorno.
121
00:06:50,190 --> 00:06:51,900
Vamos a hacer lo mismo con el password.
122
00:06:53,450 --> 00:06:54,860
Ups con el password.
123
00:06:54,860 --> 00:06:56,020
Asegurense de dejarlo así.
124
00:06:56,030 --> 00:07:01,160
Mongo debe usar dos puntos, luego viene el password y el host.
125
00:07:01,280 --> 00:07:07,610
Voy a cerrar este aquí y el host no es localhost porque localhost significaría que en la aplicación
126
00:07:07,610 --> 00:07:11,450
que yo estoy montando busque ahí la base de datos y no está en la aplicación que estoy montando.
127
00:07:11,450 --> 00:07:14,420
Está en la red que está creando este Docker con post.
128
00:07:14,720 --> 00:07:17,300
Entonces, qué nombre es Debe o Mongo?
129
00:07:17,300 --> 00:07:18,860
Adivinan cuál de los dos es?
130
00:07:18,890 --> 00:07:25,130
Recuerden, este es el servicio y este es el nombre del contenedor, que a su vez es el nombre del servidor
131
00:07:25,130 --> 00:07:26,870
basado en el DNS que está asignado en la red.
132
00:07:27,420 --> 00:07:30,200
Ok, ese es el nombre de ese servidor.
133
00:07:30,500 --> 00:07:37,550
Entonces nuevamente arroba viene el nombre del servicio y el puerto es el 27 cero 17 que si ustedes
134
00:07:37,550 --> 00:07:41,750
lo lo pusieran corriendo en un puerto independiente, por ejemplo, que ustedes digan en la inicialización
135
00:07:41,750 --> 00:07:46,250
de Mongo voy a ponerlo en un puerto diferente para mayor seguridad o por cualquier otra razón.
136
00:07:46,430 --> 00:07:51,080
Entonces ese puerto sería conveniente ponerlo en una variable de entorno para que los demás contenedores
137
00:07:51,080 --> 00:07:53,390
que dependen de la base de datos también lo sepan.
138
00:07:54,230 --> 00:07:59,980
Y básicamente eso sería la parte Voy a colocar visitor always start always.
139
00:08:00,590 --> 00:08:03,470
Voy a grabar los cambios y esto es básicamente todo.
140
00:08:04,400 --> 00:08:09,740
Ok, voy a regresar la terminal, voy a asegurarme de que lo haya bajado, que no tenga nada y ahora
141
00:08:09,980 --> 00:08:16,550
tengo que con post hop menos de presionemos enter y dejen que esto nuevamente empiece a realizar La
142
00:08:16,550 --> 00:08:22,070
magia va a ser una descarga de 100 megas más o menos que eso es lo que termina creando la aplicación
143
00:08:22,070 --> 00:08:22,360
final.
144
00:08:22,370 --> 00:08:28,820
Pero recuerden que la aplicación final que nosotros tenemos aquí, esta aplicación ya tiene todas las
145
00:08:28,820 --> 00:08:29,510
conexiones.
146
00:08:29,510 --> 00:08:35,360
Ups, aquí escribí mal, algo me dice error, invalide restart, pal dice always, lo escribí mal,
147
00:08:35,750 --> 00:08:39,830
always always ok, vamos de nuevo flecha de arriba, lo vamos a hacer.
148
00:08:39,830 --> 00:08:45,020
Recuerden lean los errores y ya se levantó todo súper rápido porque ya había descargado la imagen y
149
00:08:45,020 --> 00:08:46,280
simplemente se ejecuta el proceso.
150
00:08:46,820 --> 00:08:49,010
Regresamos a la terminal del navegador web.
151
00:08:49,990 --> 00:08:50,900
Puedo recargar aquí?
152
00:08:50,920 --> 00:08:59,170
Van a ver que aquí aparece Pokemon Dive porque apareció Pokémon automáticamente, porque también la
153
00:08:59,170 --> 00:09:01,120
aplicación está conectándose ahí.
154
00:09:01,620 --> 00:09:02,950
Ok, ya vamos a ver cómo funciona.
155
00:09:03,160 --> 00:09:07,630
Y si regresamos a la documentación dice que puedo probar el localhost 3000 con el API Sid.
156
00:09:07,660 --> 00:09:10,300
Es decir, podemos abrir esto y vamos a ver qué dice.
157
00:09:10,300 --> 00:09:11,260
Si execute.
158
00:09:11,440 --> 00:09:12,790
Esto es mi aplicación.
159
00:09:12,790 --> 00:09:13,490
Es la aplicación.
160
00:09:13,510 --> 00:09:14,830
Es más, si ustedes borran todo esto.
161
00:09:15,980 --> 00:09:16,520
Presiona Enter.
162
00:09:16,610 --> 00:09:22,460
Van a ver que dice que no hay ningún directorio en user publica, es decir, no hay ningún archivo ahí.
163
00:09:22,460 --> 00:09:25,130
Si yo pusiera un index html, eso es
lo que se va a mostrar.
164
00:09:25,400 --> 00:09:29,450
Pero obviamente no quiero hablar de la aplicación de Inés que está creada.
165
00:09:30,050 --> 00:09:34,520
Cierro y si yo hago clic en el segundo enlace, siempre y cuando ustedes lo tengan en el mismo puerto
166
00:09:34,520 --> 00:09:43,400
3000 van a ver que aquí tenemos información de 20 pokémons basado en el offset quiero 20 y que me muestre
167
00:09:43,880 --> 00:09:46,130
los siguientes 40 después de los primeros 40.
168
00:09:46,970 --> 00:09:48,710
Básicamente ahí tenemos nuestros pokemones.
169
00:09:49,070 --> 00:09:53,150
También puedo venir aquí y decir que solo quiero el límite.
170
00:09:53,420 --> 00:09:59,860
Voy a poner que muestre 151 que no creo que haya metido 151 no me acuerdo y voy a irme al final y deberíamos
171
00:09:59,880 --> 00:10:02,540
detener todos esos pokémons porque hasta ahí está.
172
00:10:02,900 --> 00:10:09,680
No sé cuántos pokemon cargué en la aplicación, creo que fueron solo 150 o 151, y eso es todo.
173
00:10:09,680 --> 00:10:14,600
Pero en este momento quiero que ustedes analicen qué es lo que está pasando en nuestra computadora con
174
00:10:14,600 --> 00:10:15,800
un único comando.
175
00:10:16,730 --> 00:10:22,130
Con este único comando estamos configurando la base de datos, una manera de poder acceder a ella,
176
00:10:22,130 --> 00:10:26,540
y también estamos montando nuestra aplicación, que está basado en una imagen y una versión específica
177
00:10:26,540 --> 00:10:27,680
de nuestra aplicación.
178
00:10:27,890 --> 00:10:31,730
Si el buque sufriera algún cambio, por ejemplo, nuestra aplicación de Pokemon, ahora tenemos que
179
00:10:31,730 --> 00:10:35,060
montar la versión dos, tres o cuatro, o montar una nueva versión.
180
00:10:35,060 --> 00:10:39,860
Un parche, un parche, digamos el parche 123 o cuatro, un bug fix o lo que ustedes quieran.
181
00:10:40,160 --> 00:10:44,000
Rápidamente podemos hacer esto muy sencillo, muy rápido.
182
00:10:44,000 --> 00:10:48,470
Y si por alguna razón la siguiente versión de Yo problemas también es muy fácil regresarse y revertir
183
00:10:48,470 --> 00:10:53,030
los cambios porque ya tendríamos nuestra nuestra imagen implementada.
184
00:10:53,120 --> 00:10:55,130
Es decir, tenemos nuestro historial y todo lo demás.
185
00:10:55,340 --> 00:10:59,690
Recuerden que para que ustedes puedan acceder a mi repositorio, a este que ustedes están viendo, este
186
00:10:59,690 --> 00:11:03,020
repositorio es público, es decir, esta imagen que está aquí es pública.
187
00:11:03,290 --> 00:11:07,700
Si ustedes la hicieran privada, entonces tienen que tener otro tipo de credenciales para poder acceder
188
00:11:07,700 --> 00:11:10,100
a ella, y eso es algo que vamos a ver después.
189
00:11:10,220 --> 00:11:10,450
Ok?
190
00:11:11,210 --> 00:11:11,690
Por ahora.
191
00:11:11,690 --> 00:11:14,600
Por ahora, siéntanse orgullosos de todo lo que acabamos de hacer.
192
00:11:14,600 --> 00:11:19,430
Juntos montamos la aplicación, montamos bases de datos, montamos formas para revisar la base de datos,
193
00:11:19,430 --> 00:11:25,340
que por cierto podríamos analizarlo si ustedes se van a localhost en el 80 80.
194
00:11:27,600 --> 00:11:27,740
Qué?
195
00:11:27,750 --> 00:11:28,080
80?
196
00:11:28,080 --> 00:11:28,560
80?
197
00:11:29,040 --> 00:11:31,110
Van a ver que aquí tenemos la parte de Pokémon de B.
198
00:11:31,710 --> 00:11:36,330
Puedo ir a ver la información de esta de esta colección de Pokémon?
199
00:11:36,330 --> 00:11:36,840
Si, ahí están.
200
00:11:37,260 --> 00:11:42,810
Podemos ir analizando todos los pokemones, como están, sus ideas, etcétera, etcétera Hacer conteos,
201
00:11:43,290 --> 00:11:48,050
ver como está la base de datos y efectivamente ahí lo tenemos.
202
00:11:48,060 --> 00:11:50,040
Sus ideas de Mongo puedo borrar o puede editar.
203
00:11:50,100 --> 00:11:52,470
Recuerden, ahí están, son 650 documentos.
204
00:11:52,470 --> 00:11:53,940
Parece que eso es lo que tenemos ahí.
205
00:11:54,690 --> 00:11:55,440
Fenomenal.
206
00:11:55,470 --> 00:11:57,180
Dejemos esto hasta este punto.
207
00:11:57,360 --> 00:12:02,760
Les voy a dejar también en la siguiente clase el archivo terminado este Docker Compact Channel para
208
00:12:02,760 --> 00:12:04,770
que ustedes simplemente lo guarden y lo ejecuten.
209
00:12:05,100 --> 00:12:10,020
Y vamos a empezar a trabajar en las próximas clases creando nuestras imágenes, porque hay muchas consideraciones
210
00:12:10,020 --> 00:12:14,700
interesantes que hacer ahí y muchas personas también están esperando llegar a esa parte del perfil.
211
00:12:15,090 --> 00:12:18,510
Ok, espero les haya gustado esta sección y nos vemos en el siguiente video.