‫Jonas: Bienvenido de nuevo.
‫Ahora finalmente configuremos Express, creemos un
‫servidor simple y hagamos un enrutamiento básico solo
‫para tener una
‫idea inicial de cómo trabajamos realmente en Express.
‫En este video, vamos a empezar a trabajar
‫en el proyecto natours, el gran proyecto principal que forma
‫parte de este curso.
‫Así que, al igual que antes,
‫continúe y obtenga el proyecto inicial de los archivos del curso.
‫Ya lo tengo aqui.
‫Lo tengo abierto en mi código VS.
‫Echemos un vistazo rápido a lo que tenemos aquí.
‫Tenemos el archivo de configuración
‫más bonito tal como lo configuramos antes.
‫También tengo un archivo de configuración para ESLint, y ESLint
‫no lo hemos configurado en este momento, pero
‫también lo haremos
‫más adelante en esta sección.
‫Por ahora, solo quiero
‫comenzar a codificar y no preocuparme por pegar nuestro código.
‫Linting es solo para corregir algunos errores.
‫Pero de nuevo, lo haremos más tarde.
‫Aquí solo tenemos algunos archivos para más
‫adelante, como css, imágenes, de acuerdo, y ahora también, por ejemplo,
‫algunos datos que necesitamos para construir nuestra aplicación.
‫Nuevamente, comenzaremos a usar estos datos aquí a lo largo
‫de esta sección.
‫De todos modos, ahora tenemos un proyecto nuevo.
‫Lo primero que solemos hacer con un nuevo proyecto
‫es crear el paquete. json,
‫como mencioné antes.
‫Hicimos eso en el
‫proyecto nodefarm, y ahora también lo haremos aquí.
‫Abro el terminal integrado.
‫Puede hacerlo presionando este atajo aquí o simplemente venga aquí a
‫Ver y luego a Terminal.
‫Déjame ponerlo un poco para que puedas verlo.
‫Recuerde que el comando es npm init.
‫Le dimos un nombre al proyecto.
‫Se llama natours.
‫Está bien, no puede tener letras mayúsculas.
‫Hagámoslo de nuevo.
‫La versión es una, descripción,
‫digamos aprendizaje de nodo, express y mongoDB, mongoDB.
‫Punto de entrada, índice. js, bueno,
‫en realidad, usaremos app. js ahora.
‫Llamémoslo aplicación. js.
‫No tenemos comando de prueba, ni git, ni
‫palabras clave, el autor soy yo, y eso es todo, está bien.
‫Aquí tenemos el paquete. json.
‫Como antes, nada nuevo aquí.
‫Ahora es el momento de instalar Express.
‫Npm expreso.
‫Voy a usar Express para aquí,
‫que está a punto
‫de grabar, la última versión, pero durante algún tiempo,
‫el equipo de Express ha estado trabajando en la versión 5.
‫Esa es una versión principal
‫que podría introducir cambios importantes si la instala.
‫Ahora, en realidad, no hay
‫muchas cosas que cambien en la versión 5, pero
‫para asegurarse, instale Express en la versión 4 tal como lo estoy haciendo yo.
‫Para hacer eso, simplemente presione 4.
‫Eso luego instalará la última versión dentro de 4 con las últimas versiones menores y
‫de parche, por lo que 4. dieciséis. 4.
‫Esa es la versión que estoy usando
‫ahora en este curso, y la suya probablemente
‫sea una versión posterior, pero siempre que tenga la 4
‫aquí al principio, debería estar bien.
‫Verá que en realidad
‫creó nuestra carpeta de módulos de nodo aquí.
‫Ahora estamos listos para empezar.
‫Estoy creando un nuevo archivo y se llama aplicación. js.
‫Es una especie de convención tener toda la configuración
‫Express en la aplicación. js.
‫Eso es lo que estoy usando aquí ahora.
‫Ahora tenemos la advertencia de que
‫no puede cargar ESLint.
‫Nuevamente, lo configuraremos más adelante
‫en esta sección.
‫Entonces, usemos ahora Express.
‫Por supuesto, voy a requerir el paquete Express.
‫Nada nuevo en este momento.
‫Dale una caja fuerte.
‫Verá que la vista previa ya hizo su magia
‫aquí agregando este punto y coma y también agregando
‫esta nueva línea aquí.
‫Hemos importado Express, y ahora lo que hacemos
‫es crear una variable llamada aplicación.
‫Una vez más, eso es una especie de estándar.
‫Así que la aplicación y el resultado asignado de llamar a Express.
‫Eso es realmente.
‫Esta es una función que al llamar
‫agregará un montón de métodos a nuestra variable de aplicación aquí.
‫El primero que vamos a
‫utilizar es la aplicación. escuchar
‫básicamente iniciar un servidor.
‫Eso es un poco similar a lo
‫que hicimos antes con el paquete http en las secciones anteriores, ¿verdad?
‫Entonces, nuevamente, tenga en cuenta que
‫Express es 100% sin js debajo del capó, y algunas
‫de las cosas funcionan
‫de una manera muy similar aquí en Express.
‫De acuerdo, de nuevo, simplemente nos hace
‫la vida un poco más
‫fácil al quitarnos parte de la complejidad.
‫Como antes, en la aplicación. escucha, pegamos
‫en el puerto.
‫De hecho, creemos una variable para eso aquí antes.
‫Port y digamos 3000 por ahora.
‫Vamos a cambiar eso un poco más tarde.
‫Pegamos en el puerto y una función de devolución de llamada.
‫Nuevamente, esta es la función
‫de devolución de llamada que se llamará tan pronto
‫como el servidor comience a escuchar.
‫Simplemente hagamos una consola. inicie sesión aquí,
‫la aplicación se ejecuta en el puerto.
‫Muy bien, nuestro servidor
‫ya está escuchando.
‫Ahora lo que tenemos que hacer a continuación es definir la ruta.
‫Y una vez más,
‫en realidad ya definimos rutas
‫antes en el proyecto nodefarm, recuerda eso,
‫pero funciona de manera muy diferente con Express.
‫Recuerde que el enrutamiento significa
‫básicamente determinar cómo responde una aplicación a una
‫determinada solicitud de un cliente, es decir, a una determinada URL.
‫Y en realidad, no es solo
‫una URL, sino también
‫el método http que se usa para esa solicitud.
‫Recuerda eso de la conferencia http que tuvimos antes.
‫¿Como hacemos eso?
‫Bueno, es muy simple en Express.
‫Todo lo que hacemos es la aplicación, luego el
‫método http al que queremos responder, y comencemos
‫con el más simple
‫que es get, y luego la URL.
‫Solo estamos especificando el tipo de URL raíz aquí.
‫Nuevamente, la ruta es básicamente la URL,
‫que en este caso, es solo esta URL
‫raíz y también el método http, que es get en este caso.
‫Ahora bien, ¿qué queremos que suceda
‫realmente cuando alguien acceda a esa URL con una solicitud de obtención?
‫Bueno, sea lo que sea
‫lo que queramos hacer, debemos especificarlo en una
‫función de devolución de llamada, que especificamos como segundo argumento.
‫Tenemos una función de
‫devolución de llamada como esta, y esta función
‫de devolución de llamada puede aceptar un par de argumentos.
‫La más básica, y
‫las que normalmente siempre necesitamos, es obtener solicitud, respuesta de entidad.
‫En ese sentido, vuelve a ser muy similar a lo
‫que hicimos antes en el proyecto nodefarm.
‫En aquel entonces, cuando iniciamos nuestro
‫servidor, también teníamos acceso a la solicitud
‫y al objeto de respuesta.
‫Ahora, son un poco diferentes aquí en Express.
‫Tienen muchos más datos y métodos, pero
‫la idea es exactamente la misma.
‫Entonces, puede ver que las aplicaciones
‫Express y también las aplicaciones de nodo
‫para el caso, tienen que ver con solicitudes y
‫respuestas, simplemente porque así es como funciona la web,
‫tal como aprendió en las secciones anteriores.
‫¿Qué queremos hacer ahora?
‫Bueno, todo lo que queremos hacer es
‫enviar algunos datos muy rápidamente.
‫Podemos usar el objeto de respuesta
‫y desde allí, podemos usar el método de envío y
‫especificar algo que queremos enviar de vuelta.
‫Hola desde el lado del servidor.
‫Solo una cuerda de nuevo que queremos enviar de vuelta.
‫También podemos especificar el código de estado y
‫eso es muy fácil.
‫Todo lo que tenemos que hacer es antes de enviar
‫la cadena al cliente,
‫simplemente agregamos el estado antes de eso.
‫El método de estado, y aquí
‫especificamos nuestro código.
‫Y de nuevo, usaremos 200 para aceptar.
‫En realidad, eso es todo lo que tenemos que hacer.
‫Probemos esto rápidamente
‫y luego agreguemos más cosas.
‫Usemos la aplicación nodemon. js.
‫Veamos qué sucede
‫y nuestra aplicación se ejecuta en el puerto 3000.
‫Excelente.
‫¿Y cómo probamos ahora esta API?
‫Bueno, por eso instalamos Postman.
‫Abramos Postman.
‫De hecho, todavía está aquí desde la última conferencia.
‫Sigamos adelante, eliminemos esto
‫y escribamos la URL, o en realidad, la
‫IP del host local y luego nuestro puerto.
‫Eso es exactamente lo mismo que hicimos
‫en el proyecto nodefarm.
‫Estamos llegando a la raíz.
‫Podemos escribir la barra o
‫funciona igual sin nada.
‫Enviemos esto y de hecho, aquí vamos.
‫Hola desde el lado del servidor.
‫Eso es asombroso, ya funciona.
‫Solo para asegurarnos, obviamente
‫obtendríamos exactamente el mismo resultado en un navegador.
‫Si copio esto aquí, verá el mismo resultado.
‫Pero de nuevo, usaremos
‫Postman porque nos facilita mucho todas estas pruebas de API.
‫Verá, una vez que realmente comencemos a
‫usar más y más funciones de esta gran aplicación.
‫Ahora, volviendo aquí, agreguemos algunas cosas más
‫porque send simplemente envía esta cadena
‫aquí al cliente, pero también es muy
‫fácil enviar json al cliente.
‫En lugar de usar enviar, usemos json.
‫El método json, y luego aquí,
‫podemos pegar un objeto.
‫Hagámoslo así.
‫Digamos que este es el mensaje.
‫Y luego solo otro campo aquí, natours.
‫Bien, y ahora ves, esa
‫vista previa aquí auto-formateó esto para nosotros y
‫ellos también quieren esto en otra línea.
‫Ah, está bien, aquí nos falta una coma, por supuesto.
‫Pero la extensión de vista previa aún
‫lo puso aquí por alguna razón.
‫Pero, por supuesto, eso realmente no importa.
‫Es solo una cuestión de formato.
‫Echemos un vistazo a lo que sucede ahora.
‫Ahora tenemos nuestro json muy bien formateado aquí.
‫Nos da todos estos colores diferentes
‫aquí para las claves y para los valores.
‫Aquí tenemos los códigos de estado.
‫Aquí tenemos el tiempo que tomó hacer esta solicitud.
‫También tenemos el tamaño de la respuesta.
‫Podríamos, por ejemplo, cambiar el código aquí muy fácilmente.
‫404 no se encuentra, recuerde.
‫Hágalo de nuevo, y luego verá, 404, no encontrado.
‫Ese es el tipo
‫de cosas para las que Postman es realmente genial.
‫De hecho, aumentemos el tamaño de todo esto.
‫Continuemos ahora, solo agregue algo más aquí.
‫Simplemente algo muy fácil.
‫Recuerde, todo esto es solo para probarlo,
‫para mojarnos los pies y comenzar a
‫adquirir un poco de experiencia.
‫Recuerde que este es el método http para la solicitud.
‫Esta respuesta que estamos enviando aquí, por lo
‫que esta aquí, solo se
‫envía cuando este método de obtención se envía a nuestro servidor en esta URL.
‫Déjame mostrártelo.
‫Si hacemos, por ejemplo, un post.
‫Eso es muy fácil de nuevo con Postman.
‫Si hacemos una publicación, no obtendremos nada.
‫En cambio, lo que Express envía automáticamente es este
‫html aquí que dice no se puede publicar y luego con
‫un 404, no encontrado.
‫Eso es porque no tenemos ninguna
‫ruta definida para esta URL y para este método http.
‫Hagámoslo ahora muy rápidamente.
‫Publicar, queremos la misma URL, la solicitud y
‫el objeto de respuesta.
‫Digamos simplemente res. enviar, puede
‫publicar en este punto final.
‫Solo para que vea
‫que así es como enviamos diferentes
‫respuestas para diferentes métodos http en la solicitud.
‫Ejecutemos eso de nuevo y, de hecho,
‫puede publicar en este punto final con un código de estado 200.
‫Este es en realidad el
‫predeterminado cuando no especificamos ninguno en nuestros códigos.
‫Aquí tenemos 404 que no es correcto.
‫Pero nuevamente, 200 es en realidad el valor predeterminado.
‫Otra cosa rápida que
‫quiero mostrarles es que al usar este método json
‫aquí, por ejemplo, esto configurará automáticamente nuestro
‫tipo de contenido en la aplicación json,
‫así que recuerde que lo hicimos manualmente en
‫la aplicación nodefarm cuando creamos nuestra API muy simple.
‫En ese entonces, también enviamos algo de json,
‫pero luego tuvimos que definir manualmente que
‫el contenido era json para que el navegador supiera
‫lo que esperaba.
‫Pero Express nos quita ese trabajo.
‫De hecho, comprobemos eso.
‫Volviendo a conseguir.
‫Aquí tenemos nuestros encabezados de resultados.
‫Aquí puede ver que
‫el tipo de contenido está configurado en la aplicación json.
‫Express luego también envía automáticamente un
‫montón de otros encabezados,
‫por ejemplo, este impulsado por Express o la fecha o la conexión.
‫Pero nuevamente, nos ocuparemos más
‫de los encabezados un poco más adelante en el curso.
‫Este fue solo un ejemplo muy pequeño y simple
‫aquí, pero ya puede comenzar
‫a apreciar lo fácil que es hacer este tipo de respuestas.
‫Crear esta ruta para responder a la solicitud del cliente, de una manera mucho
‫más fácil que en un simple nodo. js.
‫Habiendo dicho eso, en el
‫siguiente video, aprenderemos todo sobre la construcción de API
‫usando la arquitectura del resto, para que después de eso,
‫finalmente podamos comenzar a construir nuestra API.