Para esta clase les voy a pedir que se descarguen del material adjunto este archivo comprimido que dice
Rick Ross o les oprimimos borramos Esto es una aplicación del viaje que hicimos en mi curso de experto,
el cual tiene una parte de testing.
Tiene está construido con bits.
Ya vamos a hablar un poco más al respecto.
No hace falta que ustedes sepan React, pero si les voy a enseñar un par de funcionalidades que están
en esta aplicación, entonces vamos a tomar la carpeta y dejarla caer dentro de Docker.
Abra la carpeta de Docker y dentro de héroes esta carpeta también la vamos a dejar caer dentro de Visual
Studio Code.
Y no les voy a explicar el proyecto como tal, pero sí vamos a ver el funcionamiento del mismo, porque
es importante una nueva instancia de la terminal.
O la PowerShell de Windows o lo que ustedes quieran usar.
Hagan cd y naveguen a la carpeta de Read Heroes dentro de la carpeta URLs.
Si ustedes se han instalado ya pueden ser jan.
Si no pueden hacer un npm install cualquiera de los dos.
Yo les aconsejaría que lo hagamos con Jack.
Si quieren hacerlo exactamente igual, solo escriban Jan y esto va a descargar las dependencias.
No solo ya una vez, ya las tienen las dependencias.
Ustedes van a ver que ya aparecen los módulos de Node.
Si nosotros hacemos ahora el jan de npm run dev presiona enter.
Esto va a montar su localhost en el puerto 3000.
Y posiblemente ustedes se encuentren en una pantalla similar a esta.
No hay ningunas credenciales, solo es hacer clic en el login.
Una vez entramos en el login, noten el URL que cambia.
Puedo irme a los héroes de dice los héroes de Marvel hacer un search.
Puedo buscar todos los héroes que empiecen con la letra A o que tengan la letra A, Mejor dicho, aquí
están todos.
Puedo seleccionar Linterna Verde, regresar y esto es lo que nosotros creamos en el curso de expertos.
Una parte de uno de los ejercicios que se hacen ahí.
Ok.
Lo interesante de esta aplicación es que es un spa y también es algo similar a lo que nosotros vamos
a ocupar desplegar a cualquier web hosting con nosotros tenemos una aplicación de Angular View, SPL,
etcétera.
Nosotros creamos lo que son.
Básicamente un sitio que sólo tiene archivos de fotografía CSS.
HTML es lo que se conoce como un sitio estático.
A pesar de lo que lo que ustedes están viendo se crearán de manera dinámica, pero mediante JavaScript.
No hay nada del lado del servidor en este lado.
Y Nginx es súper útil y muy poderoso para este trabajo, para desplegar sitios estáticos o contenido
estático.
Si ustedes abren la hoja de tratados que yo les pasé.
Aquí hay una breve descripción de lo que es en Génesis.
En Génesis es un servidor que también se puede utilizar como proxy inverso, balanceador de carga,
proxy de correo, caché, etc.
Fue creado por Igor, lanzado al público en el 2004 en Génesis.
Es un software gratuito y de código abierto y es la imagen más descargada del mundo.
Pronto vamos a llegar a ver 2 billones de descargas en Génesis, pero es súper, súper popular.
Ustedes pueden investigar y ver cursos exclusivos solo de geeks, porque es bastante poderoso lo que
puede hacer.
Lo que nosotros vamos a ver aquí va a ser básicamente cómo utilizarlo y ustedes después van a poder
seguir su camino y expandir el conocimiento al respecto.
Entonces ya vamos a utilizar en Kinect para que me sirve y todo lo demás.
Pero por ahora, por ahora esto es la aplicación que yo quiero desplegar en un servidor de Nginx, a
diferencia de como lo hemos venido haciendo, que ejecutamos el comando de nuevo Start.
Este no es no es ningún bueno.
No vamos a tener algo que ejecutamos con Node.
A pesar de que van a ver los módulos de Node.
No es el objetivo final.
Cuando ustedes abren la terminal integrada de Visual Studio o simplemente ejecutan el comando de Nyan
Build en el mismo directorio.
Vamos a ver que se crea la carpeta de distribución y aquí nosotros no tenemos ese main.
JS o no tenemos un archivo que corra node.
Esto es básicamente un sitio web, este sitio web.
Ustedes van a ver, ahí tiene sus referencias y tiene los assets, que también incluye el index punto
y un JS, el cual tiene el código de React que hace que mi aplicación funcione.
Aparte de ese archivo de de JavaScript, también voy a ocupar las fotografías de los seres que están
en este directorio, pero ya vamos a ver que este ejercicio se presta mucho para aprender.
Bastante, pero por ahora nosotros lo único que ocuparíamos de desplegar en algún hosting es este index.
HTML.
Los y los assets.
Más estos otros.
Ok, pero no ocupamos nada en lo absoluto.
No lo usamos para crear la aplicación, pero una vez ya la creamos, no ocupamos para nada ni siquiera
los modulos de no lo voy a ocupar porque no son necesarios.
Ahora, antes de terminar la clase, recuerden, podemos borrar inclusive los modulo de No, no va a
ser necesario, pero dejémoslo ahí.
Yo borré la carpeta de distribución sólo para que ustedes puedan venir y volver a ejecutar el ya build
enter y que se vuelva a crear.
OK, no tiene ninguna razón por la cual yo la elimine, simplemente es para que ustedes miren que esa
carpeta se crea mediante un proceso de construcción.
Ok, eso es todo por este video, los veo en el que sigue.