Transcripciones
1. Introducción: Bienvenido al curso de API web NodeJS. En este curso, aprenderás haciendo. Pondremos frente a ti
la experiencia más práctica que necesitas para construir API web. Porque hoy en día, si quieres adquirir una experiencia, tienes que hacerlo no sólo leyendo una documentación o siguiendo algún curso teórico. Por eso construimos este curso, que será e-Sharp Web API. Cubriremos toda la información que se necesite para crear una API de tienda online. Api significa interfaz de programación de aplicaciones, o en otras palabras, la interfaz que traerá para mí eso,
uh, de la base de datos a la interfaz de usuario. Y se ubicará en un servidor web donde se alojará nuestra aplicación NodeJS. Toda API es segura. Por lo que aprenderemos en este curso cómo autenticarse a estas API y asegurarlas. Crearemos todas las API que se necesitan para la e-shop, como el producto y categorías y usuarios y
usuarios inicios de sesión y autenticación y registro de usuarios. Y por supuesto, los pedidos que harán los usuarios, no olvidaremos también la subida de archivos y las múltiples subidas de archivos. Porque necesitaremos eso para nuestras imágenes de producto y galería de productos, usaremos la mejor herramienta para construir nuestra API. Y como desarrollador back-end, verás cómo probar tus API porque algunas herramientas nos pueden proporcionar funcionalidad
completa sin depender del front-end y esperar a que se haga. Usaremos también a los editores adecuados y las mejores extensiones para acelerar nuestra productividad. Y no sólo eso, verás también cómo este curso es interactivo. Por lo que te pediremos que resuelvas una tarea y las revisaremos por ti. Espero que disfruten de este curso y estoy deseando trabajar todos juntos para construir la mejor API para una tienda electrónica.
2. Descripción a nuestra API RESTful: Echemos un vistazo a nuestra API RESTful para ver cómo intercambiar datos entre el cliente y el servidor. ¿ Cuál es la arquitectura de RESTful API? Tenemos el cliente y tenemos un servidor, y están intercambiando datos a través del protocolo HTTP. Este es el concepto básico de RESTful API. También hay operaciones de inclusión para crear datos, leer datos, actualizar datos, y eliminarlos. Sus operaciones se pueden realizar a través del protocolo HTTP. Existen métodos específicos de protocolo HTTP que hacen estas operaciones, que estamos llamando operaciones al principio, ¿cuál es la diferencia entre RESTful API y la ruta front end? El RESTful API está trayendo datos. El front end sequía está mostrando los datos o renderizando una página específica. Al abrir su navegador y poner enlace RESTful API, si tiene acceso para obtener estos datos, entonces obtendrá una cadena que consta de archivo JSON o XML. El protocolo Http es capaz de renderizar una página con HTML CSS y traer sus datos. Por lo que los métodos HTTP en general, son GET, post, PUT, y delete, que son las operaciones crudas. Pero en los métodos HTTP, se
les llama así. Por lo que estoy enviando una solicitud a la base de datos o
al back-end en general para obtener a través de rest API algunos datos. Por ejemplo, obtener una lista de productos a través de la API, me dará matriz de lista de productos. Obteniendo un solo producto, pasando por alto el ID de este producto, me
va a dar archivo JSON con todo detalle del producto. Cuando quiero actualizar un producto, envío una solicitud PUT con la idea del producto y ademas adjuntando los nuevos datos. Y la respuesta será el mismo producto, pero con un dato diferente. Y eliminar un producto es simplemente pasar el ID del producto con solicitud de eliminación. Creando un producto, necesidad de publicar un nuevo producto. Por lo que estoy usando la ruta principal de la API de los productos y luego estoy pasando cualquier dato nuevo, los datos que por ejemplo, nombre de su producto y la imagen, y eso es estanques, será un nuevo ID con el nuevo nombre del producto y por supuesto, la imagen. Esas son nuestras solicitudes API para obtener los datos o publicar o eliminar o actualizar datos en el servidor. Y estoy usando api slash v1, que significa la versión uno. Entonces cuando quieras actualizar tu API en el futuro, agregas una nueva versión. Por lo que los usuarios siguen siendo capaces de utilizar las versiones anteriores de su API. Lo mismo para los pedidos y los usuarios. Entonces en este caso, tienes toda la misma secuencia, pero solo necesitas planear tus datos, ¿verdad? Crear un servidor web con NodeJS es muy sencillo. Veamos eso en la próxima conferencia.
3. Instalación de nodejs: Para iniciar el desarrollo, siempre necesitamos la gestión de paquetes. El manejo de paquetes viene con la aplicación NodeJS. Por lo que para instalarlo solo juega en Google NodeJS y ve a Descargar. Y verás la descarga para todos los sistemas operativos. Por ejemplo, tengo aquí para Windows y también tengo para Mac OS. Existen dos tipos como LTS, que se recomienda para la mayoría de los usuarios, y el actual, que son las últimas características. Mejor conseguir siempre una versión estable, la cual se recomienda para la mayoría de los usuarios. Aquí, puede elegir su instalación en función de su sistema operativo. Y será simplemente una aplicación, como cualquier aplicación que puedas instalar. Entonces después de eso, puedes descargar esta aplicación y ejecutarla. Y será como cualquier instalación normal de aplicación. Entonces para estar seguro, después de eso terminas todos estos pasos. Necesitas ejecutar algunos comentarios de MPM. Por lo que para ejecutar comandos mpm, podemos usar Visual Studio Code. Después de abrir el código de Visual Studio, verás aquí los últimos proyectos que tienes. Pero por ejemplo, necesitamos abrir el terminal del código de Visual Studio. Entonces iré aquí a decir Control y J. Y entonces tendré abierta la terminal. Y en terminal, podemos, por ejemplo, colocar un comentario NodeJS. Por lo que podemos decir, por ejemplo, la versión del NPM. Y obtendríamos el detalle completo virgen sobre el Node.js instalado. Después de eso, podremos utilizar la administración de paquetes NodeJS, donde hay muchas bibliotecas que podemos utilizar en nuestra aplicación y desarrollos.
4. Instalación de postman: Cuando estamos creando API, necesitamos probarlas. Puedes probar tus API con una aplicación front-end como React o Angular o Vue js. Pero vamos en este curso a empezar primero con el backend. Por lo que la mejor manera de hacer eso y probar las API es instalar una herramienta llamada Cartero. Vayamos a Google. Vas a la descarga Cartero. Y aquí lo encontrarás en base a tu sistema operativo. Por lo que aquí elegirás descargar la aplicación. Y después de que se descargue, será una configuración normal como cualquier aplicación. Después de abrir el archivo descargado, recibirás una notificación si estás usando Mac OS. Y te pedirá que muevas esta aplicación a la carpeta de aplicaciones. Y después de eso, verás que esta aplicación se encuentra en tu carpeta de aplicaciones. Lo mismo para Windows. Es normal instalar como cualquier aplicación pequeña. Después de abrir la aplicación, podrás probar API. Vamos a probar uno. Cuando vayas a Google y tecleas JSON placeholder, verás que el primer enlace es algunas API falsas. Por lo que puedes probar un GET solicitudes o publicar solicitudes. Entonces probemos este. Aquí dice. A modo de solicitud GET, voy al Cartero y luego abro una nueva pestaña con la solicitud GET y coloco el enlace que copié del placeholder JSON y presiono Enviar, obtendré una respuesta. Esta respuesta viene como un JSON. Y de la misma manera, vamos a construir nuestras API.
5. Configure MongoDB Atlas: Para nuestra tienda electrónica, necesitamos tener una base de datos. Y la base de datos, no necesitamos instalar ningún software. Usaremos MongoDB, Atlas. Mongodb ofreciendo ahora un almacenamiento de base de datos en línea, lo que significa que la base de datos ya está en la Nube. Lo que necesitamos hacer sólo para ir a la URL que adjunté con esta conferencia y crear una cuenta aquí y registrarnos y luego buscar en tu cuenta. Después de iniciar sesión, verás esta pantalla que necesitas para crear un proyecto. Por lo que antes que nada, necesitas crear un proyecto para nuestra tienda electrónica. Entonces vas aquí y dices, quiero un proyecto que es, por ejemplo, cada hub. Y doy clic en Siguiente. Y luego creando el proyecto. Después de eso, el proyecto requiere un clúster. Por lo que necesitamos construir un cluster donde ofrecemos nuestra base de datos. Entonces aquí, hay clústeres compartidos, que es de forma gratuita. Puedes usarlo y elegir el servidor más cercano a tu país. Por ejemplo, usaré este, el predeterminado. Y luego después de crear el clúster, estamos listos para crear nuestra base de datos. El banco de datos en MongoDB llamado colección. Por lo que necesitas acudir a las colecciones y crear una nueva en base a tu necesidad. Ya tenemos uno que creamos para el curso en el proyecto 0. Aquí hay colecciones en creé múltiples bases de datos. Por lo que tu parte es solo crear una cuenta y crear cluster y crear tu propia colección, que usaremos en el curso. Veremos más adelante cómo hacer la conexión entre nuestro código back-end y el MongoDB en la Nube.
6. Preparación de la API Server: Ahora las cosas empiezan a ser difíciles. No, no sólo estoy dando. En este módulo, veremos cómo trabajar con el producto en sí y sus categorías, por
supuesto, en la parte back-end. Por lo que los principales pasos para crear nuestro producto ahora, para importar todos los datos del producto al front-end. Qué significa que queremos crear una API para recuperar todos los datos del producto a nuestro front end. Por lo que necesitábamos de alguna manera como JSON, esto también incluye crear el producto y actualizarlo y eliminarlo. Por lo que vamos primero a crear los esquemas de producto y categorías en la base de datos en el nivel de aplicación. Además, comenzaremos lo más sencillo posible. Por lo que las categorías es lo más fácil que podemos hacer ahora. Por lo que haremos el resto API para categorías. Y seguiremos publicando un nuevo producto en la base de datos a través de la API resto. Y luego obtendremos lista de los productos. Y después de eso obtendremos un detalle de producto por ID. Y luego veremos cómo conectar los productos con categoría. Por ejemplo, cuando esté recibiendo un producto, voy a ver cómo obtener los detalles de la categoría dentro del producto. Después de eso, necesitamos actualizar nuestro producto. Por lo que a veces necesitamos actualizar el precio, o queremos actualizar su imagen, o queremos actualizar el nombre del producto. Eliminación de un producto. En ocasiones cuando no tengo el producto lo eliminé de mi tienda. Y luego queremos hacer algunas estadísticas como conseguir conteos de productos, cuántos productos tengo en mi tienda. Por ejemplo, quiero ver sólo los productos destacados. Porque si recuerdas, tenemos es bandera destacada. Ya sabes, qué productos se presentan para que podamos llevarlos y mostrarlos solo en la página de inicio. Y entonces es muy importante que tengamos un filtrado. Por lo que necesitamos filtrar sus productos en función de categorías. Por lo que no sólo por ejemplo, algo para la salud. Por lo que consigo los productos que hay categorías es salud. Eso es todo por ahora. Espero que disfruten de este módulo. Será un poco detallado, pero después de eso, podrás crear los pedidos y los usuarios, como vemos en los siguientes módulos.
7. Crea el servidor de Backend con Express: Empecemos a crear nuestro servidor back-end, o digamos nuestro servidor web, donde llamaremos nuestras API al cliente. Después de haber abierto nuestro Visual Studio Code a la carpeta back end, como la estructuramos antes, ejecutamos un comando npm init en MPM en
ella, nos pedirá un nombre de paquete. Puse e-shop, una virgen. Presiono Entrar descripción, digamos algunos back-end para la e-shop por ejemplo. Y luego el punto de entrada como donde empezará la aplicación, pongo app.js y luego algunos, otro comentario. Seguimos presionando Enter y luego nos preguntará todo está bien. Presionamos Enter. Entonces veremos que se crea un paquete Jason. Entonces vamos a crear ahora nuestro archivo up js, donde vamos a iniciar nuestro punto de entrada de nuestra aplicación. Entonces pondré aquí, por ejemplo, console.log, Hola Mundo. Y luego imprimirá Hello World cuando esté ejecutando esta aplicación. Pero cómo vamos a ejecutar esta aplicación, aconsejo utilizar una biblioteca llamada NADH Monde, que es una utilidad que monitoreará cualquier cambio de nuestro código fuente cuando presionemos Control S o guardemos esta aplicación JS, lo hará reiniciar la aplicación de nuevo automáticamente. Entonces después de instalar esta biblioteca, vemos que está en independencia en un paquete JSON como script personalizado, podemos agregarlo aquí, como si fuera un comentario para iniciar la aplicación usando Node monitor. Por lo que puedo decir iniciar monitor de nodo o gemido de nodo. App dot JS. En este caso, tendré la aplicación iniciada con el archivo de punto de entrada app.js. Probémoslo ahora. Guardemos ab.js y luego escribamos npm start. Y después de que empecé la aplicación, voy a ver Hello World. Y la aplicación sigue en ejecución. Por lo que está detectando cualquier cambio que haga en la aplicación. Entonces digo helloworld con el cambio fue signo de exclamación, y veo que ha cambiado. Cambiemos el mundo E-sharp. Ya veremos hola e-shop. Eso es genial. Entonces hasta ahora sólo tenemos una aplicación en ejecución, pero aún no tenemos ningún servidor. Entonces para crear un servidor web, vamos a instalar Express, que es una famosa biblioteca de Node.JS para alojar un servidor. Por lo que después de hacer esta instalación, voy a ver también en dependencias. Pero eliminemos este registro de consola y cree una constante, llámenlo express y llame a la biblioteca express usando la palabra clave require express. Lo llamará automáticamente desde módulos de nodo. Y vamos a crear una constante que se llama app. Y esta app con call una función llamada Express, que mencionamos o definimos antes. Este servidor web requiere escuchar un puerto específico. Entonces digo que arriba escuche. Y especifico, por ejemplo, 3 mil como puerto. Y hay una devolución de llamada. Callback nos dará, todos
seremos ejecutados cuando haya una creación exitosa del servidor. Por lo que en la devolución de llamada, puedo imprimir cualquier mensaje en la consola. Por ejemplo, diré que el servidor se inicia ahora o que el servidor se está ejecutando ahora en el host local de enlace con puerto 3000. Entonces ahora vamos a ejecutar de nuevo la aplicación. Diré npm start. Y vamos a obtener algún error porque ya estoy ejecutando el servidor. Entonces empecemos y lo vuelvo a ejecutar. Veré host local o el servidor se está ejecutando en localhost 3000. Cuando abro el navegador y visito esta URL, localhost 3000, veamos qué tendremos. Lo pongo aquí y veo que subir, conseguir, no se puede conseguir porque no especificé ninguna ruta inicial para la aplicación. Creamos. Ahora la ruta inicial o la raíz, podemos decir app dot get. Veremos que Express nos está proporcionando todas las solicitudes HTTP. Por ejemplo, PUT, eliminar, y también publicar. Entonces olvídate. Aceptará dos parámetros. El primero es la ruta misma. Por ejemplo, diré la ruta inicial o la raíz. Por lo que en este caso, pediré una devolución de llamada. El callback tendrá la respuesta que
enviaré al cliente cuando llame a esta ruta. Entonces digo en la respuesta de devolución de llamada, dot sand, por ejemplo, digamos un mensaje, podemos llamarlo hola o API, no Hello World. Entonces ahora tenemos esta API. Guardemos, y ahora podemos volver a ejecutar la aplicación en el navegador. El aplicativo llamará a un getMethod y obtendremos como respuesta, este hola API. Entonces como recapitulación, vimos cómo creamos nuestro propio servidor o servidor web con express. Y estábamos viendo nuestros cambios con el nodo Monitor y cómo llamamos a esta aplicación llegar a inicializar una ruta. Y ejecutamos el servidor bajo un puerto específico que vimos antes. Necesitamos tener una API y una versión en la URL de ese fuera. Entonces veamos cómo podemos crear eso con variables de entorno en la próxima conferencia.
8. Variables de entorno de lectura: De acuerdo, así que empecemos con variables de entorno. Normalmente, las variables de entorno se utilizan como variable pública, las
cuales se utilizan entre la aplicación. Entonces, por ejemplo, quiero una variable pública para API URL. Por lo que esta URL API, cual será precedida por cada ruta que use para mi aplicación o para mi API. Entonces como vimos antes que cada API que teníamos,
tiene el prefijo de algo como slash, api slash versión uno. Y esto significa que cada API en mi aplicación tendrá esta URL. Y luego API versión uno. Y entonces digo, por ejemplo, productos. Y luego puedo publicar, eliminar o crear algunos datos a esta API. Entonces ahora veamos cómo podemos leer este prefijo. Entonces no quiero repetir en mi API siempre es la cadena. Por lo que puedo arreglarlo en alguna constante que es legible desde todas partes. Y entonces puedo pasárselo al micrófono, a mis rutas de cuerdas, y entonces sería legible en esa ruta. Entonces para hacer eso, primero, normalmente, en no el Node.JS, normalmente tenemos una variable de entorno llamada dot n o archivo de entorno. Y qué ejemplo paso un nombre de variable que lo quiero, cualquier nombre que pueda, por ejemplo, API URL. Y entonces puedo decir la cadena que quiero pasar, que es api slash v1. Y en este caso, tendré esta URL API está definida en todas partes de la aplicación. Pero primero, cómo podemos leer esta variable de este archivo en nuestra aplicación, hay una biblioteca, podemos instalarla desde paquetes MPM. Y se llama EMF punto-punto. Por lo que no podemos decir npm instalar dot EMF. Y esta biblioteca normalmente está disponible siempre. Y podemos usarlo en la aplicación JS en la ruta en la raíz, No hay problema. Por lo que podemos decir definir o podemos decir requerir esta biblioteca. Por lo tanto, EMF no recorta el conflicto. Y normalmente esto debería estar en una cuerda. Entonces cuando digo requerir esta biblioteca, entonces podré usar alguna constante específica para obtener estos valores del archivo M. Entonces iré aquí y definiré una constante. Vamos a llamarlo por ejemplo, API. Y entonces podemos decir punto de proceso, punto, luego el nombre de la variable que creé aquí. Por lo que puedo decir API en la URL de puntuación. Entonces vamos a guardar todo. Y ahora intentemos imprimir esta variable para ver si realmente está leyendo de este archivo o no. Entonces hagámoslo de inicio cuando iniciamos el servidor. Por lo que voy a decir console.log, la API para constante. Entonces arrancaré mi servidor, mpm start. Y aquí está, ya lo hemos definido. Entonces en cada ruta que tengo, puedo definir o pasar esta variable API más la ruta que quiero, por ejemplo, productos. Por lo que en este caso, tendré el prefijo API version one plus products. Veremos eso con más detalle en las próximas conferencias para ver cómo crear la ruta y cómo construirla y cómo llamarla. Lo más importante que debes saber ahora que podemos crear las variables públicas en este archivo y leerlas en cualquier parte de la aplicación. Entonces en este caso, quiero almacenar,
por ejemplo, la cadena de base de datos o cadena de conexión. Puedo guardarlo aquí en este archivo y también, por ejemplo, algún secreto para la autenticación, también lo
puedo almacenar aquí. Y cuando quiera desplegar la aplicación al servidor de producción, voy a cambiar estas variables. Entonces tendremos también otro archivo, por ejemplo dot EMF, pero para servidor de producción, veremos eso por supuesto en la conferencia donde desplegaremos la aplicación Node.JS. Entonces ahora pasemos a la siguiente conferencia donde crearemos la API real y cómo enviaremos datos JSON a través de ella porque necesitamos datos JSON para que nuestra e-shop intercambie con el front end la información sobre los productos y el pedido y etcétera.
9. Crea la primera llamada de API y anclado Json Data: Ahora vamos a ver cómo intercambiar datos entre front-end y back-end. Anteriormente vimos cómo intercambiar datos con el front-end con la solicitud GET. Por lo que enviamos Hola API. Pero lo que hicimos es sólo intercambiar una cadena, que es hola API. Por lo que necesitamos intercambiar datos JSON. Por ejemplo, el producto es un objeto, consta de ID, nombre, imagen, y el precio. Entonces ahora simulemos la API de productos. Entonces al principio, Vamos a tener el prefijo bonito como antes. Entonces voy a usar las garrapatas traseras, que son muy útiles para combinar entre constantes y cadenas sin usar este plus. Entonces ahora, vamos a quitar esta parte y crear un backticks. Y con un signo de dólar y corchetes curvos. Haré API. Y entonces digamos productos. Quitemos esta parte de aquí. Y también este. Y voy a crear una constante. Digamos producto. Y este producto es objeto, contiene ID, digamos uno, y nombre, digamos pelo, aparador. E imagen con, por ejemplo, alguna URL. Por lo que tienes opción aquí para seleccionar cotizaciones dobles o cotización simple. Pero con JavaScript, Es mejor usar siempre citas simples en esa respuesta. Enviemos este producto al front end. Y vamos a ejecutar la aplicación. Ahora tenemos la aplicación en ejecución. Vayamos a Cartero. Cartero es aplicación como hablamos antes y vimos cómo instalarlo. Entonces no puedo llamar a API como con los métodos GET, post, PUT, etc. Así que vamos a tener aquí nuestra API 3000 y luego api slash versión one slash productos. Y hago clic en Enviar. Entonces eso es pons es el objeto que ya creé. Por lo que suponemos que estamos construyendo este objeto obteniendo
los datos del producto en la base de datos o desde la base de datos, luego enviarlos al front end con un getMethod. Entonces, ¿qué pasa si el usuario o el administrador de la aplicación del tema arriba, enviaremos, o, por ejemplo, crearemos un nuevo producto. Por lo que el nuevo producto necesita un dato que será enviado desde el front end. Entonces ahora cambiemos este método muscular de llegar a post. Qué ejemplo lo copiaré y diré post. El puesto solicita también datos. Estos datos vendrán del front end. Entonces cómo obtengo estos datos desde el front end, es muy sencillo usando request dot body. Por lo que después de publicar los datos del cuerpo, los
voy a enviar de vuelta al frente. Entonces vamos a crear una constante, digamos nuevo producto. Y este nuevo producto se solicitará cuerpo de punto. Entonces hagámoslo así. Consola. Lograr el nuevo producto. Entonces vamos a Cartero. Cartero cambiamos este método de llegar a post. Y el cuerpo de la solicitud será,
por ejemplo, en la fila JSON, que es JSON. Y entonces puedo pasar, por ejemplo, este objeto. Y cuando hago clic en Enviar, vemos que regresamos uno. Y en el registro de la consola me quedé indefinido. Entonces el problema es que el cuerpo no está bien analizado. Entonces necesitamos algo llamado middleware. El middleware es una función que tiene control de solicitud y la respuesta de cualquier API. Entonces cuando el frente termina y el objeto JSON, necesitamos el back-end para entender que esto es adyacente. Por lo que por favor analízalo y úsalo en el back-end. Entonces para hacer eso, necesitamos solo usar una cosa de express JS. Por lo que necesitamos usar ese JSON. Por lo que el Express aceptará datos JSON. Y la cosa es muy sencilla. Como ya les dije anteriormente, necesitamos tener un middleware. Y este middleware se puede hacer mediante el uso de aplicaciones. Y luego decimos Express dot JSON. Y este método, haremos que nuestros datos sean comprensibles por Express, los
cuales se envían desde el front end. Y podemos teclear aquí como middleware. Y en el futuro, veremos que vamos a poner todo middleware. En este apartado. Anteriormente, se usaba algo llamado BodyParser, y este cuerpo-analizador se duplicó. Por lo que ahora en adelante estamos usando Express JSON. Entonces si ves en las próximas conferencias que estamos usando BodyParser, sólo tienes que reemplazarlo por expresado o JSON. Por lo que de esta manera, garantizas que tu aplicación se ejecutará de la manera correcta. Por lo que ahora somos capaces de hacer un get y también post de los datos. Yo, por ejemplo,
cambiaré aquí peluquero a y lo enviaré. Y voy a recuperar el peluquero dos. Por lo que ahora nuestra API está lista. Ahora estamos empezando a construir esta estructura API para pedidos de productos y 40 usuarios, como hablamos antes en la sección anterior. En la próxima conferencia, veremos cómo realizar el registro de estos eventos de API. Por ejemplo, cuando alguien publique datos o buenos datos, los
bloquearemos en la consola de nuestra aplicación.
10. Las solicitudes de la API de registro: Es culpa muy útil que el desarrollador sepa lo que está pasando en su servidor. Para que podamos conocer y anotar las solicitudes HTTP que vienen del front end, como posts, get o put o delete. Para ello, hay muy buena biblioteca llamada Morgan, por lo que podemos usarla para log nuestras solicitudes HTTP las cuales vienen desde el front end. Entonces vamos a instalar esta biblioteca. Paro el servidor, digamos m, Pm instalo Morgan. Y después de instalar esta biblioteca, podemos llamarla también con require. Entonces le costó a Morgan. Requerir. Morgan. Dijimos que esta biblioteca es una biblioteca de middleware, así que tenemos que ponerla en app dot use Morgan. Y hay algunas opciones por defecto, que se llama Tiny. Esto es bueno en caso de mostrar las solicitudes de registro en un formato específico. Por ejemplo, vamos a ejecutar el servidor de nuevo. Inicio Mpm. Entonces tenemos aquí que un servidor se está ejecutando con Cartero. Hagamos algunas peticiones. Por ejemplo, voy a enviar de nuevo el post. De acuerdo, de vuelta a la aplicación o al código. Veremos que obtuvimos una solicitud de post sobre la API y con su número de estado específico. Hagamos un GET. También. Aquí un get, Enviar y volver a la aplicación. Y veo que he iniciado sesión también, ellos GAN solicitudes. Existen muchas opciones para esta biblioteca, por lo que puedes dar formato a tus registros como quieras. Pero no vamos a hacer eso. Vamos a usar sólo diminuta. Y por supuesto se puede decir con este logs en algunos archivos, todo esto
es, se muestra aquí en la documentación de esta biblioteca. Ahora estábamos usando sólo un dato falso del producto. Empecemos a vincular estos datos a la base de datos. Entonces vamos en la próxima conferencia para hacer la conexión con el MongoDB usando Atlas.
11. Instalación de mongoose y conectarse a la base de datos MondoDB: Anteriormente vimos cómo falsificar un dato
del producto para almacenarlos y mostrarlos en nuestra aplicación. Ahora lo que necesitamos es almacenar los datos en la base de datos. Y en este curso estamos usando MongoDB. Y como vimos antes, no
necesitamos instalar ningún software especial para MongoDB. Solo necesitamos iniciar sesión en la nube de MongoDB. Y luego creamos nuestra base de datos y conectamos nuestra aplicación a esa base de datos en la Nube. Entonces, en primer lugar, cómo podemos conectar nuestra aplicación a la base de datos en la nube. Por lo que primero necesitamos instalar una biblioteca llamada Mangosta. Mangoose es responsable de todo el funcionamiento de la base de datos
MongoDB en la aplicación o una aplicación Node.js. Entonces vamos a instalar esta biblioteca que se llama Mangosta. Voy a escribir aquí npm instalar mangosta. Y como cada biblioteca necesitamos crear una constante. Llamémoslo mangosta. Y este Mongo, podemos decir que se requiere de mongoles. Podemos suponer que esta cosa de aquí es como la importación. Por lo que estamos importando cada biblioteca y la almacenamos en una constante. Normalmente, agregamos la conexión a la base de datos antes de iniciar el servidor. Por lo que aquí voy a decir Mangosta, punto conectar y desconectar. Es pedir URI. Uris o cadena de conexión. Puedo obtenerlo de MongoDB Cloud. Anteriormente vimos cómo conectarnos a la nube de MongoDB y crear nuestra aplicación y clústeres y nuestro proyecto. Y vimos que tenemos múltiples colecciones, o podemos decir bases de datos. Y esas bases de datos, tendremos acceso a ellas a través de nuestra aplicación. Entonces veamos cómo podemos conectarnos a esas bases de datos en clústeres. Si vuelvo a los clústeres, veo aquí un botón que dice Conectar. Cuando digo conectar, puedo usar múltiples opciones de MongoDB. Por ejemplo, lo que necesitamos es conectar su aplicación. Por lo que necesitamos usar una cadena de conexión para obtenerla desde aquí y pegarla en nuestro método de conexión con de Mangoose. Por lo que al hacer clic en esta opción, obtendremos una cadena de conexión. Vamos a copiarlo y tenerlo en nuestra aplicación. Por lo que traigo cotizaciones aquí y copio esta cadena de conexión. Pero no podemos ver que dice que estas cadenas de conexión deben contener un nombre de usuario y contraseña y nombre de base de datos. Pero de donde no puedo obtener esta información es simplemente en MongoDB Cloud. Podemos utilizar un usuario específico para conectarnos a estas bases de datos. Solo necesitamos ir al acceso a la base de datos y crear un nuevo usuario. Y este usuario podemos conectarnos A base de datos en la Nube. Así que vamos a dar clic aquí, añadir un nuevo usuario de base de datos. Y vamos a darle un nombre de usuario, E usuario agudo y la contraseña, tienes libertad para seleccionar cualquier contraseña. Por ejemplo, pongo de uno a siete. Dijo que se proporciona contraseña es muy débil. Entonces vamos a agregarle algunas letras. Y luego agregó con éxito al usuario. Volviendo a nuestra cadena de conexión, necesitamos reemplazar estos datos aquí. Entonces primero, pondré aquí el nombre de usuario, el usuario de e-Sharp, y la contraseña que tenía antes, y el nombre de la base de datos. De acuerdo, aún no tenemos esa base. Entonces vamos a sumar uno. Volvemos a los clústeres. Y entonces podemos ver aquí nuestras colecciones. Y en esta lista de colecciones que tengo anteriormente, puedo crear una nueva base de datos. Entonces le voy a dar un nombre E-sharp, que la base y el mismo nombre para la colección. Atrás tomó esa cadena de conexión. Podemos agregar ahora un nombre de base de datos. Entonces ahora tenemos la cadena de conexión completa. Hablamos antes de variables de entorno. Entonces vamos a almacenar esta cadena en las variables de entorno, así que la copio. Y luego creo, por ejemplo, una variable, lo
llamo cadena de conexión. Y luego le doy este valor, que es la cadena que obtuve de la nube de base de datos. Y aquí solo digo proceso punto variable de
entorno, punto, conexión, cadena. Entonces ahora cómo podemos comprobar que estamos conectados a la base de datos o no. Si comprobamos este método Connect, notaremos que está devolviendo una promesa. Normalmente se está ejecutando la promesa y está devolviendo dos métodos. Uno es entonces cuando sus éxitos y otro con el error cuando es fracaso. Entonces aquí voy a poner entonces. Y luego si la
función de flecha y la consola registro algún mensaje, esa conexión de base de datos está lista. Y cuando falla en catch. Y también es método de flecha. Podemos decir consola log el error. Intentemos iniciar nuestro servidor. Por lo que ahora npm inicio. Y vemos que hay algunas notificaciones diciendo esa advertencia de deprecación. Está diciendo que el analizador de cadenas URL actual está en desuso. Por lo que necesitamos usar alguna variable específica. Por lo que necesitamos usar una opción específica como verdadera para hacer desaparecer esta deprecación. Pero cómo podemos usarlo, vemos que este método de conexión tiene otro parámetro llamado opciones. Entonces con estas opciones es un objeto donde puedo pasar las opciones que quiero. Entonces vamos a copiar este. Agregado como opción. También nos dieron otra advertencia de deprecación que es usar topología unificada. Esto se utiliza también para buscar los servidores. Entonces, sumémoslo aquí. Y vamos a ahorrar. Seguimos recibiendo error. En realidad el error que necesitamos pasar también el nombre de la base de datos en las opciones. Entonces puedo decir que es alguna palabra reservada, se llama nombre DB. Y con este nombre TB, puedo pasar el nombre de la base de datos. Nombramos nuestra base de datos en la Nube como e-shop que la base. Y después de guardar y tratar de volver a conectar, vemos de nuevo que se ha fallado la autenticación. En MongoDB Atlas, es necesario dar un eje de red. Por lo que este acceso a la red, necesitas tener una lista blanca de IPs que puedan acceder a tu base de datos. Entonces ya tengo dos IPs. Puedo agregar otra IP yendo, por ejemplo, a Google y simplemente teclear cuál es mi IP. Y en el primer resultado de búsqueda, obtendré mi IP directamente. Entonces voy aquí, copio esta IP, y luego digo agregar la nueva IP. Por lo que se agrega esta IP, puedo decir mi oficina en casa. Y luego hago clic en Confirmar. Por lo que volver a la aplicación. Podemos ver si somos capaces de conectarnos o no. Por lo que solo podemos presionar Guardar de nuevo. Y vemos aquí el servidor se está ejecutando, pero aún no obtuvimos respuesta alguna del servidor de base de datos. Y vemos que la conexión de base de datos está lista. Entonces de esta manera, conectamos el tema de la aplicación back end a la base de datos en la Nube. En la siguiente parte, veremos cómo escribir datos esta base de datos utilizando nuestras API que creamos antes.
12. Uso de MongoDB Atlas: Por supuesto, también hay unas herramientas locales para navegar por la base de datos de MongoDB. No tienes que usar nuestra clase en línea. También puedes descargar alguna herramienta la cual tiene más, más funcionalidad como veremos más adelante, como exportar e importar datos. Porque quiero darles los archivos y los datos y la base de datos que
he creado para no ser molestado en llenar sus datos o base de datos por su cuenta. Tendrás los archivos listos. Por lo que puedes utilizar esta herramienta para importar como las bases de datos y las tablas y los documentos a tu base de datos también. Con esta conferencia, hay un enlace adjunto para y algo llamado MongoDB Compass. Y esta es una muy gran herramienta para navegar por la base de datos MongoDB. Y está disponible para todas las versiones de sistemas operativos. También, como para Windows, para un Ponto, y también para Mac OS. Por lo que después de descargar este enlace, te dará una aplicación que puedes usar. Y esta aplicación puedes instalarla en tus aplicaciones y luego la puedes abrir. De acuerdo, vamos a abrir la aplicación instalada. Como muestro aquí, lo tengo aquí en mi lista de aplicaciones, en mi sistema Mac. Y va a anexar para mí la Brújula MongoDB. Como ven aquí, lo estamos inicializando. Entonces se está inicializando. Y déjame acercar un poco como Dalo para que sea más grande. Entonces ahora me está pidiendo que agregue una cadena de conexión, que hemos creado en la conferencia anterior para que pueda ir y copiar mi cadena de conexión y luego pegarlo aquí y luego haga clic en Conectar. Ya expliqué cómo obtener el nombre de usuario,
contraseña, y también el nombre de la base de datos. Por lo que ya lo he hecho. Entonces es en reciente. Tengo aquí el usuario de e-shop y también MongoDB y toda esta información entre ella. Por lo que ahora tenemos que dar click en Conectar. Y luego se va a conectar a mi base de datos. Como ven, he enumerado todo mi clúster, que son los que tengo en el atlas. Por lo que tenemos todas las bases de datos que creé previamente. Y así la base de datos con la que vamos a trabajar. Por lo que tienes dos opciones. Tal vez puedas usar MongoDB Atlas o MongoDB Compass, compuestos MongoDB. No necesitabas buscar en el navegador y buscar en la página web de MongoDB Atlas. Pero se puede escuchar el uso localmente. Simplemente abre una aplicación, agrega tu cadena de conexión, y se guardará aquí siempre. En este curso voy a utilizar MongoDB Atlas. Y cuando vayamos por el despliegue, voy a usar MongoDB Compass porque necesitamos importar y exportar datos. Y también. En la próxima conferencia más adelante, te
mostraré cómo importar y sembrar tu base de datos. No tienes que llenar toda esta información manualmente, como la base de datos. Por lo que tendrás ya base de datos que puedes importar a tu colección y luego podrás usarla. Al igual que dar seguimiento con su curso.
13. Lee datos en la base de datos con la API: Perfecto, Así que estoy tan contenta ahora que tenemos una conexión exitosa con la base de datos, ahora
tratemos de publicar algunos datos en la base de datos para que podamos verlos en la Nube de MongoDB. En la base de datos relacional. Anteriormente, vimos que la relación entre las tablas, pero aquí en MongoDB está adquiriendo diferente. Podemos considerar que la tabla de nombres es una colección. Entonces como vemos aquí, ya
tenemos una base de datos. En el interior de esta base de datos, hay una colección. Por lo que podemos decir que la colección es una tabla en base de datos relacional. Borré la base de datos que creamos antes. Voy a crear uno nuevo con la mesa, llamémoslo productos. Entonces por ejemplo, dijimos que el nombre de nuestra base de datos es e-shop. Base de datos. Productos es el nombre de la colección. Entonces tengo la base de datos. Cada base de datos y dentro de eso hay una tabla o una colección. Podemos llamarlo un producto. Está bien, genial. Entonces ahora tenemos, digamos esta colección, vamos a publicar datos a esta colección. Entonces en Cartero, como vimos antes, tenemos aquí a este objeto, empujémoslo a esta base de datos. Pero primero, lo que necesitamos hacer en la aplicación Node.JS, necesitamos crear un modelo con Mangoose. El modelo es lo mismo que una colección. Entonces podemos decir en MongoDB, se llama colección y en Node.JS, se llama modelo. Por lo que necesitamos crear un modelo de producto. Este modelo contendrá las columnas que necesitábamos para el producto. Por ejemplo, el nombre o la imagen, o por ejemplo, la cantidad del producto en el almacenamiento en Mangosta. A esto se le llama esquema. Y si vamos allá a la documentación, vemos que Mangoose tiene mucha flexibilidad aquí. Para que podamos crear esquemas. Por ejemplo, esquema de bloque como vemos aquí. Y podemos poner el título del campo, autor, cuerpo, y hay tipo de éste, y cada campo tiene algunas opciones. Por lo que se puede especificar, por ejemplo, fecha punto. Ahora, por ejemplo, estamos en este registro o se crea este documento, entonces veremos que toma automáticamente la fecha de hora de la hora actual. Entonces empecemos de manera sencilla. Entonces, primero creemos el modelo de producto. Voy a la aplicación y después, digamos usar y antes de las API. Yo creo, por ejemplo, en constante, lo
llamo esquema de producto. Y este esquema de producto utilizará biblioteca y esquema de Mangoose. Y el esquema aceptando un objeto y este objeto tomará los campos como vimos aquí en la documentación. Por lo que tenemos un nuevo esquema y aquí podemos enumerar nuestros campos. Entonces vamos a sumar nuestros campos que teníamos antes. Entonces digo que necesito el nombre. Escribimos es cadena. Y por ejemplo, necesito también imagen. Qué tipo también cadena. Contendría la URL de la imagen. Y agreguemos también algo así como contar en stock. Contar en stock. Y este conteo en stock será un número. Hay muchos tipos. Podrás consultar la documentación de mangosta y veremos en el curso los diferentes tipos que utilizaremos para nuestra aplicación de tienda online. Después de tener este esquema, necesitamos crear el modelo. Entonces digo producto constante. Normalmente los modelos empiezan con mayúscula. Entonces podemos decir producto, que es modelo de punto de mangosta. Y el modelo llamado, o la colección se llama producto. Y usando el esquema de producto que teníamos antes aquí. Entonces digo esquema de producto, y presiono Guardar. Ahora tenemos el esquema de producto y el modelo de producto ya definido. Entonces ahora necesitamos,
por ejemplo, con las solicitudes de publicación, necesitamos recibir estos datos de post desde el front end, que es podemos decir cartero o cualquier otra aplicación como Angular o React. Y luego necesitamos recibir estos datos por el back-end,
analizarlos, y empujarlos a la base de datos. Para ello, necesitamos primero, necesitamos crear un nuevo producto, por ejemplo, de ese modelo. Entonces hagámoslo. Podemos decir producto const. Y este producto es nuevo producto que teníamos antes. Pero, ¿cuáles son los campos de este producto? Entonces el producto es este modelo que teníamos antes. Y vamos a sumar los campos de ese producto, como el nombre. Y la imagen y el conteo en stock. Por lo que iré aquí y recibiré esa solicitud, que me dieron. Con esta solicitud, consigo el cuerpo. Y con el cuerpo dentro del cuerpo, estoy enviando aquí id, nombre, imagen, y puedo mandar también contar en stock. Será exactamente el mismo nombre aquí, que viene del front end. Por lo que el front end y el back end deben ponerse de acuerdo en el mismo nombre para los campos y el objeto que se envían al backend. Entonces aquí digo el nombre es solicitar cuerpo de punto, nombre de punto. Imagen es solicitud cuerpo de punto, imagen de punto. recuento en stock también es de la solicitud dot body dot count en stock. Ahora tenemos listo el modelo, por lo que solo necesitamos guardarlo en la base de datos. Entonces para hacer eso, podemos decir punto de producto. Y tiene un método llamado Guardar. Guardar. Significa que lo guarden en la base de datos. Si comprobamos este método de guardar, es devolver una promesa, promesa con el documento. Entonces podemos decir, entonces está devolviendo una promesa. Por lo que podemos decir producto creado. Por lo que este es el producto después de que se creó en la base de datos. Entonces es nuestro propio método. Entonces podemos decir aquí, estado de punto de respuesta, que es conexión exitosa o creación exitosa de la base de datos del documento. Por lo que puedo decir aquí dot JSON. Por lo que quiero devolver de nuevo el producto creado para verlo en el front end. Y en caso de error o cualquier cosa puede suceder, podemos decir atrapar el error. Y este error, podemos decir estado de punto de respuesta. Por ejemplo, 500. Es el código de respuesta para errores en el http dot JSON. Yo creo, por ejemplo, mi propio objeto. Yo digo que el error es el error que obtuve. Y por ejemplo, digo si su éxito o no, tal vez pueda usar esta variable en el front end. Por ejemplo, para terminar alguna carga o volver a la página de inicio. Si hay algún fracaso. Ya enviamos ese producto. Entonces eliminemos esta parte aquí e iniciemos nuestro backend MPM, empecemos. Ya lo tenemos listo y la conexión está lista. Vamos a publicar aquí algunos datos. Agradable. Está presumida, tenemos identificación, nombre, imagen. Entonces si vamos a la nuestra colección en MongoDB, Vamos a presionar Refrescar aquí. Aquí tenemos los mismos datos. Vamos a intentarlo de nuevo agregando conteo en stock. Diga por ejemplo, 500 piezas en mi stock. Yo lo envío. Creé un nuevo producto con el mismo nombre, y está devolviendo el ID del producto creado. Volviendo a MongoDB, refresca de nuevo. Agradable. También tengo dos productos ya publicados a través de mi API en el back-end. Y aquí notamos que está bloqueado y exitoso. Hagamos un error. Por ejemplo, para hacer un error, hagamos este campo como sea necesario. Por lo que la base de datos reconocerá que este conteo en Stoke es campo requerido. Por lo que responderá con error que no enviaste, por ejemplo, el conteo en stock. Para ello, volvemos al esquema y cambiamos esto a un objeto. El tipo de este objeto es número y requerido es verdadero. Entonces vamos a guardarlo y ejecutar nuestro, nuevo nuestra API pero sin contar en stock. Y si validamos el JSON y
enviamos de nuevo, veremos que recibimos un error, error y exitoso, falso o fallido. Por lo que en este caso, diría que el error es validar o se requiere el conteo de ruta de error en stock. Por lo que la base de datos me respondió que se requiere este campo. Cuando lo vuelvo a hacer, su éxito. Por lo que ahora hemos publicado un dato al back-end. Vamos a crear una solicitud get. Por lo que quiero obtener estos datos, mostrar la información de su producto en el front end, por ejemplo. Entonces para hacer eso, necesitamos crear una solicitud get. Por lo que crear una solicitud GET simplemente cambiamos esto para obtener. Y necesitamos especificar la lista de productos. Entonces vamos, por ejemplo, a obtener la antigua lista de productos. Y si envío la solicitud, estoy recibiendo la antigua API que teníamos antes. Entonces cambiémoslo para tenerlo de la base de datos. Para ello, vamos a la solicitud get y luego sustituimos esta constante y la llamamos, por ejemplo, esa lista. Y llamo justo al modelo mismo que creamos antes y encontramos. Eso es todo. Por lo que digo const lista de productos y la respuesta va a conseguir nuestro, envíame la lista de productos. Probemos eso. Nosotros sí ascendemos. Nos damos cuenta de que aquí tenemos un error. El error es porque ese método de hallazgo está devolviendo una promesa. Y aquí, cuando estoy enviando la respuesta, tal vez esta lista de productos aún no esté lista y aún no lo conseguí. Por lo que necesito esperar hasta que esta lista de productos esté lista y luego puedo enviarlo con la respuesta. Hay otra manera que hacer, por ejemplo, punto entonces y no atrapar. Eso es algo que podemos hacer con la palabra clave await. Y en la palabra clave await requiere siempre método asíncrona. Entonces pongo este método aquí y es asíncrona, y tengo un peso aquí. Entonces en este caso, cuando llame a la lista de productos, entonces va a esperar, se llenará, y luego envío la respuesta al front end. Entonces hagámoslo otra vez. Ahora. Yo estoy ahorrando y luego enviando esa solicitud, vemos que aquí tenemos los datos. Ya no obtuvimos el error. Entonces esto es por eso que regresamos una promesa. Deberíamos esperar a que la base de datos nos envíe su respuesta, y entonces esperaremos en el frente. Entonces tal vez me pregunten cómo puedo detectar el problema o los problemas. Es muy sencillo. Puedo decir si una lista de productos o ninguna lista de productos, si no hay lista de productos, entonces puedo decir estado de punto de respuesta 500. Y por ejemplo, con JSON, puedo decir error o éxito falso. Entonces si hay algún error ocurrido, por ejemplo, conexión o algo así, simplemente
puedo devolver el error con un éxito si esta lista está vacía. Por lo que tenemos dos formas diferentes de expresar y atrapar errores de la base de datos. Entonces puedo decir aquí, encontrar, puedo poner un peso y
asíncrono, o puedo hacerlo con promesas normales. Al igual que por ejemplo, digo Guardar, puntar entonces y atrapar. Por supuesto que esto es más ahorro de código. Esto lo hicimos sólo en dos líneas, y eso es muy bueno. Por lo que a partir de ahora, usaremos siempre asíncrona y esperaremos. Eso es todo por ahora es mangosta. Hagamos un poco de refactorización. Es muy bonito tener las rutas en algunos archivos y los modelos en otro archivo. Por lo que podemos tener más organización de nuestro código, del backend.
14. Analiza la base de datos de datos de E Shop: Bienvenido de nuevo. He cambiado de opinión aquí, así que no vamos a hacer refactorización. Analicemos primero la base de datos de e-shop. Entonces de esta manera podemos saber qué rutas y qué esquemas podemos construir y crear los archivos en el back-end. Entonces aquí tenemos menos de las tablas o documentos o colecciones que necesitamos en nuestra base de datos. Toda tienda tiene productos, pedidos, categorías, usuarios, y artículos de pedido. Esta es la tienda electrónica más simple. Entonces cuando quieres crecer más, necesitas tener más tablas como unas reseñas o por ejemplo, algunas categorías nuevas son categorías más grandes. Por lo que empezamos simple y vamos a construir nuestra tienda electrónica para ser más grande lentamente. En primer lugar, los productos, por ejemplo, tiene ID, que es el ID del producto. Y este ID se genera cuando publicamos cualquier ID en la base de datos automáticamente por MongoDB. El nombre del producto, y también la descripción. Y la descripción llega scription se usa
para, por ejemplo, quiero almacenar algún código HTML. En ocasiones la gente está utilizando como descripción de los productos con imágenes y títulos y algunos textos de alcance complicado. Entonces veremos cómo tendremos editor en el front end. Para HTML. Necesitamos también la imagen principal del producto. Y es una cadena, cadena, que almacenará la URL a esa imagen. También, necesitamos una galería de, una galería tendrá algunas imágenes y array de cuerdas, de URLs donde tenemos una galería del producto, más detalle sobre el producto. Y entonces tendremos una marca y también precio,
precio de la categoría de producto. Será la categoría de tipo. En MongoDB. Aquí tendremos algo llamado referencias. No es como las bases de datos relacionales, pero aquí podemos definir el tipo de la tabla directamente. Por lo que como veremos en el futuro, veremos que esta categoría es un tipo de categoría o tiene una referencia a la tabla de categorías. Y cuente en stock cuántos artículos de este producto están en el almacén. También valoración basada en opiniones y si este producto se presenta o no. Por lo que para verlo en la página de inicio de inmediato como producto destacado. Y luego veremos que lo que ellos, este producto se crea cuatro categorías. Sólo necesitamos un nombre, tal vez algunos datos adicionales. Por ejemplo, lo que necesito en el front end, a veces color, por lo que puedo colorear cada categoría en base a algún color específico y también icono o imagen. Para los pedidos, necesitamos artículos de pedido, que es matriz de artículo de pedido. Y el artículo de pedido es una tabla donde está contiene el producto y la cantidad. Por lo que cada pedido tendrá un producto y la cantidad. Entonces tal vez tendré 10 productos. Yo los ordené en un solo pedido. Y entonces cada producto tendrá alguna cantidad. El envío dirección uno y dirección dos. Y ciudad, código postal, país, número
telefónico del estado del usuario para ver si esta orden de nacimiento es, por ejemplo, doblada, enviada o entregada. Y también el precio total. Veremos cómo calcular el precio total en base a artículos
del pedido y al usuario que encargó este pedido. Porque tendremos lookin para cada usuario que quiera pedir algo. Y luego la fecha de la orden. Para los usuarios. Necesitamos un nombre de identificación, correo electrónico, donde el usuario iniciará sesión con su correo electrónico y el hash de contraseña. La contraseña debe almacenarse hash en la base de datos. No puedo almacenarlo como texto plano. Calle, Departamento, ciudad y código postal. Y también país con número telefónico. Y también saber si este usuario es admin. Para que pueda iniciar sesión en el, por ejemplo, panel de administración o no. A lo mejor alguien pregunte por qué separé aquí la dirección del usuario. Al igual que por ejemplo, puedo tener mesa extra como dirección aquí. Entonces puedo poner este campo en esa mesa. Y puedo relacionar usuario y órdenes con esa tabla de direcciones. En realidad, la mayoría de Aesop tiene un problema que a veces usuario, después de
que pidió algo, cambió de dirección. Pero el pedido ya está enviado. Por lo que necesitamos almacenar el pedido como un avión con una dirección de envío, cómo lo colocó el usuario, no relacionado con la dirección de usuario. Usaremos esta dirección solo para rellenar automáticamente dirección
del pedido cuando el usuario esté ordenando algo después de que él bloquee. De esta manera, tomamos un resumen sobre nuestra base de datos en MongoDB. Ahora iremos al backend y crearemos los archivos y refactoraremos un poco nuestro código para basarnos en esta estructura de base de datos.
15. Crea rutas y Routes de las API en la API: Bienvenido de nuevo. Me estoy imaginando ahora que y si colocamos todos los esquemas aquí en este archivo App.js, sería muy grande. Y creo que aquí tendremos miles de líneas. Por lo que normalmente en Node.JS, las personas o los codificadores en general, están poniendo estas rutas, por ejemplo, las rutas API, y también los esquemas en archivos separados. A, hagámoslo ahora y veremos cómo organizar el proyecto de manera más mejor. Por lo que suceden esquemas. Vamos a crear una carpeta aquí. Nosotros lo llamamos modelos. Y dentro modal, crearemos un archivo para cada modelo que tengamos, por ejemplo, productos o producto dot js. En productos COMO colocaré este esquema. Entonces vamos a copiar esta parte y colocarla aquí. La mangosta no está definida en este archivo, por lo que también necesitamos copiar esta parte donde const mangosta requiere
mangosta porque este archivo no puede ver la Mangosta importada en el app.js. Por lo que tenemos aquí const Mangosta y esquema de mangosta. Y por cierto, consigamos también el mogul. A pesar de que lo cortamos y lo colocamos aquí. Ahora, cómo ArcJS usará este modelo en Node.JS. Si queremos exportar una constante o por ejemplo, una clase u objeto, sólo
decimos que tenemos que hacerlo de esta manera. Exporta producto de punto y luego el modelo. Por lo que aquí, en este caso, producto se verá en cualquier otro archivo. Y puedo importarlo con método requiero. Entonces yendo al archivo ab.js y digo const producto, que viene de requiriéndolo de este archivo donde tenemos el modelo, por ejemplo, modelos slash producto. En este caso, conseguimos el producto y podemos usarlo como modelo para nuestra API. Hagamos más refactorización. Vemos que tenemos todas las API, get post, GET post. Entonces si hacemos eso para todos los esquemas, sería archivo muy grande. Hay una forma en Node.JS que también se pueden almacenar las rutas o las API en archivo separado. Te mostraré cómo hacerlo. Entonces primero vamos a crear una carpeta Word, routers de sequía. Y dentro del router, creo también productos, los js. Entonces para cada modelo, tal vez haya routers. En Express. Hay algo llamado router, y este router sólo es responsable de crear API, estancar las API e importarlas y exportarlas entre los archivos. Entonces, ¿cómo hacer eso? En primer lugar, necesitamos importar el Express. Requerir Express. Y el router será parte de Express. Por lo que podemos decir Express dot router. Entonces este router, cuando lo importe en ArcJS, lo
puedo usar aquí. Y este router, se puede utilizar como middleware, por lo que puedo usarlo con uso de app. Entonces primero, vamos a movernos, a
ver cómo mover estos routers. Entonces primero, vamos a copiar todas las API que teníamos y colocarlas aquí. En lugar de app. Yo sólo digo router. Eso es muy sencillo. Y también los elimino desde aquí. Y como dijimos hasta el 2s
es, puede usar también ese exterior. Por lo que podemos tomar la ruta principal API de los productos y colocarlo aquí, por ejemplo, router de productos. Pero de donde vendrán estos productos router
, vendrá de aquí. Por lo que no puedo decir que quiero exportar también el router. Por lo que puedo ir aquí y decir modulo dot export es router. Por lo que tenemos aquí diferente manera de exportar. Aquí estamos exportando el producto en sí, y aquí estamos exportando un módulo. Entonces de esta manera, puedo decir productos router es una constante. Entonces podemos decir aquí, constante. Productos router que provienen de, requieren, de routers. Y luego productos. Por lo que veremos aquí que esta aplicación está utilizando estas rutas de rutas que vienen de productos router. Entonces aquí tenemos que hacer algo. No podemos usar la API así, porque de lo contrario lo será, podemos considerar esto como los niños. Entonces por ejemplo, aquí, necesito colocar solo el escondite poder considerarlo cuando digo localhost 3000 productos slash, entonces puedo llegar a este, obtener. Y lo mismo para el puesto. Si quiero algo en el futuro como contar, lo pongo así, entonces la API será http 3000 productos slash count. Entonces esta es la mejor manera en que podemos manejar eso outs en archivo separado. Pero primero tenemos aquí el producto modelo. Por lo que también necesitamos importar este modelo. Entonces digo const, producto se requiere de modelos el producto. Ahora tenemos las rutas terminadas. Por lo que tenemos todo get post y veremos cómo agregar el delete y update. Guardemos este archivo y también lo guardemos aquí. Haz un poco más de organización del código aquí para que ya no lo necesitemos. Para que podamos escuchar, digamos routers. Y aquí, el router de producto, podemos tenerlo aquí importado. Veamos ahora si todo funciona bien, podemos decir MPM, empezar. Todo está conectado y todo está funcionando como humo. Lo mismo irá también para las otras colecciones de bases de datos. Por ejemplo, tendré aquí pedidos GS y también usuario y también la categoría. También lo mismo para esos autores. Tendré los mismos expedientes. Entonces estoy seguro de que no te interesa ver todo el proceso porque es exactamente el mismo. Voy a agregarlas. Y luego veremos después de eso cómo se ven al final, nuestra aplicación se ve así. En app.js. Tenemos los middlewares,
rutas, y también la conexión de base de datos y el vendedor. En las rutas. Creé rutas para cada tipo o, o para cada colección que teníamos en nuestra aplicación. Entonces voy aquí y creé eso exactamente como los productos. Tenemos, los usuarios órdenes, categorías. Y lo mismo para los esquemas. Cada esquema tiene su propio ahora. Por lo que en este caso, ahora
tenemos todo listo para crear nuestras API. Actualmente, utilizo solo get en cada tipo. Yo sólo quiero mencionar una cosa. Cuando exportamos el modelo de las exportaciones punto-producto de esta manera, no de esta manera. Cuando lo
importamos, necesitamos importarlo como un objeto. Entonces aquí, cuando voy a los productos, lo importo así. En ES6, tenemos esta destrucción de objetos. Por lo que este modelo está devolviendo un objeto. Por lo que necesito crear un nuevo objeto y asignar todos los campos de ese objeto a éste. Por lo que en este caso, puedo usarlo en todas partes seguro que no hay ningún problema si se utiliza de esta manera. El modo de exportar el módulo directamente. Probemos nuestra API. Ahora. Yo voy aquí y digo get, tengo lista de productos. Eso es todo por ahora. Para las próximas conferencias, veremos cómo llenar estos esquemas y cómo conectarlo a las estructuras de nuestra base de datos. Y veremos cómo seguir construyendo nuestra tienda electrónica de una mejor manera.
16. Permitir CORS y por qué lo necesitamos: lo que lo necesitamos: Si estás haciendo un front end y el back-end en su mismo tiempo. Seguro que viste este error. Este error llamado Intercambio de recursos de origen cruzado, lo que significa en un lenguaje humano que aplicación
Node.JS no puede confiar en ninguna otra aplicación. Entonces cuando estoy enviando solicitudes desde mi front end hasta el back-end, entonces el back-end cuando Lot me responde lo mismo que quiero porque está prohibido. Está usando puerto diferente, que es totalmente un dominio diferente. Entonces en mi aplicación front-end, cuando crea un servicio para llamar a las API, entonces obtendré ese error. Y en Mozilla org, están explicando todos los datos o todos los detalles sobre este curso. Por lo que de alguna manera en la app NodeJS, necesitamos habilitar esos curso. Cómo podemos permitir que cualquier aplicación solicite API de mi servidor. Se cuenta con una biblioteca llamada curso. Podemos usarlo para permitir el curso para cualquier aplicación. Por lo que paro el servidor y digo npm instalar curso. Después de instalarlo, necesitamos requerirlo e importarlo. Entonces aquí estamos importando todo en ArcJS. Entonces digo const curso, requiero curso. Y para habilitar el curso, es muy sencillo antes de que todo, antes de que comience la aplicación, antes de usar cualquier servicio en la aplicación, necesitamos hacer arriba, no usar núcleos. Y opciones de app dot. Con estrella, como todo. Usando el curso. Esta app dot opciones. Significa que es algún tipo de solicitudes HTTP, como GET y publicar y poner y eliminar. Pero, ¿qué es? Cuando Google opciones http, vemos que la opción HTTP es un método solicita opciones de comunicación
permitidas para una URL determinada al servidor. Entonces cuando digo, quiero una estrella, así que estoy permitiendo todo con el uso de este curso. Por lo que en este caso, estoy permitiendo que todas las demás solicitudes HTTP sean pasadas desde cualquier otro origen. Por lo que es muy importante utilizar este curso y habilitarlos para evitar este error. Por último, después de terminar este módulo o esta sección, diría que este proyecto es la startup para nosotros por crear el tema del back-end. Por lo que lo pondré como archivo zip para que lo descargues y empieces desde aquí. Se puede ver este proyecto en recursos con esta conferencia. En los siguientes módulos, veremos cómo construir todos los esquemas y las API para cada parte de la aplicación.
17. Productos y categoría en la categoría: Ahora las cosas empiezan a ser difíciles. No, no sólo estoy dando. En este módulo, veremos cómo trabajar con el producto en sí y sus categorías, por
supuesto, en la parte back-end. Por lo que los principales pasos para crear nuestro producto ahora, para importar todos los datos del producto al front-end. Qué significa que queremos crear una API para recuperar todos los datos del producto a nuestro front end. Por lo que necesitábamos de alguna manera como JSON, esto también incluye crear el producto y actualizarlo y eliminarlo. Por lo que vamos primero a crear los esquemas de producto y categorías en la base de datos en el nivel de aplicación. Además, comenzaremos lo más sencillo posible. Por lo que las categorías es lo más fácil que podemos hacer ahora. Por lo que haremos el resto API para categorías. Y seguiremos publicando un nuevo producto en la base de datos a través de la API resto. Y luego obtendremos lista de los productos. Y después de eso obtendremos un detalle de producto por ID. Y luego veremos cómo conectar los productos con categoría. Por ejemplo, cuando esté recibiendo un producto, voy a ver cómo obtener los detalles de la categoría dentro del producto. Después de eso, necesitamos actualizar nuestro producto. Por lo que a veces necesitamos actualizar el precio, o queremos actualizar su imagen, o queremos actualizar el nombre del producto. Eliminación de un producto. En ocasiones cuando no tengo el producto lo eliminé de mi tienda. Y luego queremos hacer algunas estadísticas como conseguir conteos de productos, cuántos productos tengo en mi tienda. Por ejemplo, quiero ver sólo los productos destacados. Porque si recuerdas, tenemos es bandera destacada. Ya sabes, qué productos se presentan para que podamos llevarlos y mostrarlos solo en la página de inicio. Y entonces es muy importante que tengamos un filtrado. Por lo que necesitamos filtrar sus productos en función de categorías. Por lo que no sólo por ejemplo, algo para la salud. Por lo que consigo los productos que hay categorías es salud. Eso es todo por ahora. Espero que disfruten de este módulo. Será un poco detallado, pero después de eso, podrás crear los pedidos y los usuarios, como vemos en los siguientes módulos.
18. Esquema de los modelos de productos: Bienvenido de nuevo. En esta conferencia, veremos cómo construir el modelo de producto o el esquema de producto. Todo en Mangosta comienza con esquema. Cada esquema se asigna a una colección MongoDB y define la forma del documento dentro de esa colección. Entonces en base al modelo que se ve a la derecha de la pantalla, vamos a construir el mismo esquema que lo construimos antes en ese modelo. Por lo que los campos del producto pueden ser como empezar aquí, digo que el tipo de este campo es una cadena. Y hay opciones de esquema o Opciones de tipo de esquema. Este tipo de esquema opciones, las puedes ver en la documentación de Mangosta. Por lo que voy aquí a documentación de Mangosta. Voy a tipos de esquema. Y en los tipos de esquema, podemos ver que hay muchos tipos. Por ejemplo, string, number, date, y hay algo llamado opciones, como vemos aquí en este ejemplo. Entonces voy, por ejemplo, al Tipo de Esquema, y veo que hay ruta y opciones en la documentación de Opciones de Tipo de Esquema, puedo ver todas las opciones que necesito para construir mi esquema. Lo que necesitamos en realidad para nuestro curso, creo que necesitamos ese campo requerido y también algo llamado href para hacer referencia a otra tabla y default, que es un valor predeterminado cuando se crea el objeto del producto. Por lo que siempre se requiere el nombre del producto. Yo lo puse a la verdad. El siguiente campo es la descripción, que será una breve descripción del producto. Y también será una cuerda. ¿Se requiere? Yo diría que en nuestro caso se requerirá la breve descripción. Y luego vayamos a la rica descripción. En la descripción rica también se tiene una cadena de tipo. Pero yo diría que no se requiere. Y podemos ponerle un valor por defecto cuando se crea. Por ejemplo, digo cadena vacía. Lo mismo vale para la imagen. Entonces pongo decir aquí también, la imagen es una cadena y tiene un valor por defecto como vacío. Ahora vamos a las imágenes. Imágenes. Siempre son array de cuerdas. Por lo que podemos ponerlo simplemente como esta matriz. Y el tipo de cada elemento de esta matriz es una cadena. Tenemos también marca, que es va a ser lo mismo. Cadena y precio. Por lo que el precio será en la forma tipo es número. Y el valor por defecto. Podemos decir que es 0. El siguiente paso ahora necesitamos agregar la categoría. Entonces es simple. Decimos que la categoría es tipo de ID de categoría. Entonces aquí en el producto, cuando quiero agregar un producto, utilizo la ID de categoría, no toda la categoría. Por lo que digo que el vínculo entre la tabla y
del producto y la tabla de categoría es el ID de la categoría. Por lo que el tipo de este campo será esquema de punto de mangosta, tipos de
puntos, ID de objeto de punto. Entonces en este caso, necesito pasar siempre el id. Y cómo diría que este ID está conectado a la tabla de categorías o esquema de categorías. Yo sólo hago eso. Yo digo que una referencia es esquema de categoría. Por lo que en este caso, esta ID estará conectada al esquema de categoría. Entonces cuando agrego producto, es búsqueda en categorías y recojo ID específico. Y entonces digo que este producto tiene categoría, por ejemplo, belleza y salud. ¿ Se requiere eso? Sí, agregémoslo según sea necesario. El siguiente campo que hacemos Ya tenemos es contar en stock. Cuenta en stock, Normalmente es un número y requerido. Por lo que es necesario especificar cuánto de este producto tienes en tu almacén. También hay otra propiedad podemos poner max y Min. Por ejemplo, digo mínimo tiene 0 y máximo. Tiene 255, por ejemplo. Entonces digo aquí que cuando publique un producto con menos número de conteo en stock, entonces obtendré error porque mangosta, cuando se volvió hacia mí y me diga que, no, esto está mal. Es necesario poner el número entre 0 y 255. Lo mismo va, por ejemplo, para la calificación y también una serie de revisiones. Son números. Por lo que los agregué aquí. Y el campo se destaca es tipo booleano. Por lo que el valor predeterminado de la misma es falso. Por lo que esto es para mostrar el producto en la página de inicio como producto destacado. También, tengo la fecha de campo creada. Por lo que los datos creados es una fecha de tipo y el valor predeterminado de la misma es fecha punto ahora, por lo que es muy simple. Entonces cuando llegue el producto o esta solicitud, entonces tomará la hora actual. Ahora tenemos todo el esquema están listos para su producto y
veremos más adelante cómo agregar producto en las solicitudes de post y cómo obtenerlo.
19. Categorías Modelo y esquema: Anteriormente, creamos el esquema de categoría. Y como ven aquí en el modelo a la derecha de la pantalla, necesitamos crear esos campos. Entonces, empecemos con el nombre. Es exactamente lo mismo que hicimos para el producto. Por lo que digo tipo string requerido a través. Entonces para no tomar tanto tiempo en escribir, voy a agregar los otros campos porque también están teniendo el tipo de cadena. Por lo que aquí tenemos icono y color. El icono será el nombre del icono por ejemplo, estamos usando algunos iconos de fuentes o iconos de material de Google. Por lo que puedo decir sólo el nombre del icono. Y también digo aquí el color, ese color será un hash, cadena
hash, como algo así como puedo decir 000 000 000, que es negro. Por lo que de esta manera, puedo almacenar el color de la categoría que necesito mostrar en el front end. Entonces, empecemos ahora con la creación de la API de la categoría. En la próxima conferencia, veremos cómo agregar categoría y borrado.
20. Añadir y eliminar categorías: Genial. Por lo que de vuelta al mundo real. Ahora vamos a tener la categoría API. Por lo que en esta conferencia, sabremos agregar una categoría y quitar una categoría. Empecé simple aquí porque la categoría API es la más simple que veremos en el futuro. Cómo crear API más complicadas, como los productos y los pedidos. Entonces como recuerdas antes de crear las rutas y rutas, estamos agregando nuestras API. Tenemos aquí un GET, lo
editaremos para hacer mejor manera o podemos mantenerlo para obtener lista de productos. Ahora, vamos a añadir una categoría. Por lo que mediante la creación de router punto post. Entonces voy a agregar una categoría, así por slash y luego asíncrona, solicitud y respuesta. Entonces haré aquí la adición a la base de datos usando Mangoose y agregando una nueva categoría. Vimos antes que la solicitud siempre obteniendo la información desde el front end, cómo el usuario está enviando la información. Y luego los leeremos y los publicaremos en la base de datos. Vamos a crear, por ejemplo, una constante, podemos llamarla o dejar categoría. Y este será un nuevo modelo de categoría. Por lo que esta categoría, la hemos importado ya aquí. Y tendremos el objeto de esta categoría será nombre y también icono y color, exactamente igual que el esquema. Entonces, ¿cómo obtendría estos datos? Por lo que solicita punto, cuerpo, nombre de punto. Por lo que el front end me debe mandar exactamente este nombre. Entonces también va lo mismo para solicitar punto, icono, punto o perdón,
punto, cuerpo, icono de punto. También para el color. Agregamos aquí. El color. Si recuerdas, cuando publicamos un producto aquí, teníamos algo como guardar. Entonces digo el modelo dot save, y entonces este save me devolverá una promesa. Y luego vuelvo con el estado que creó los productos. Y hablamos antes también de esperar y asíncrona. Entonces hagámoslo ahora con un peso y asíncrona. Entonces usando un peso y un fregadero, digo categoría, que lo creé antes. Puedo decir que nuestro peso de categoría, que creé dot save. Entonces en este caso, estoy esperando hasta que esto se guarde. Y esta guardar me devolverá una promesa con documento o la categoría misma que se crea. Y luego reviso si no hay categoría, como ninguna categoría creada. Entonces digo error de retorno. Por lo que el estado de punto de respuesta dirá 400 cuatro, por ejemplo, puntos y que la respuesta por ejemplo, o la categoría no se puede crear. Por ejemplo. Y luego si hay categoría, entonces digo que los puntos de respuesta terminan la categoría. Eso es muy sencillo. A modo de recapitulación, creo un nuevo modelo de categoría y luego lo llené de datos. Lo guardé usando Mongos y luego estaba esperando aquí hasta que esta categoría esté lista. Y luego reviso si hay categoría, hay datos dentro de esta categoría, luego lo envío. Pero si no, estoy devolviendo un error. Empecemos nuestro servidor ahora. Mpm inicio conectado a base de datos. Todo está bien. Y uso Cartero. Cartero por ejemplo, creé esta categoría. Dije nombre es salud e ícono es salud icono y algún color. Yo lo envío y veo que está publicado con éxito. Y obtuve una nueva identificación de esta categoría para comprobar si realmente está funcionando. Volvemos a ir a Atlas y comprobarlo en la base de datos. Yo voy aquí y ya lo encontré. Entonces vamos a crear otra categoría. Por ejemplo, como las computadoras. Y esta computadora tiene computadora de
icono y algún color específico en front end puedes crear una camioneta de color. Pickup de color. Te asignaremos el código del color. Por ejemplo, digo 444, y lo envío y creé uno nuevo. Voy a Atlas. Y decir refrescar. Y veremos que esa categoría también se suma aquí. Por lo que tenemos computadoras y salud. Ahora eliminemos una categoría. Eliminar una categoría es lo mismo. Por lo que no podemos decir router dot, delete, no post. Y digo eso fuera lo que quiero asignar por borrar una categoría. Y luego digo solicitud y respuesta como devolución de llamada. Y usaría esta solicitud y respuesta. Hagámoslo aquí con manera promesa. Lo hicimos antes con un peso y asíncrona. Hagámoslo aquí con una manera promisoria. Entonces primero, llamo a la modelo, digo categoría punto. Hay método llamado find by ID and remove. Por lo que encontramos un ID por y lo eliminamos igual con find by ID y eliminamos. Entonces aquí necesito encontrar la categoría que quiero eliminar. Por lo que por DNI. Entonces de donde obtendré el ID, obtendré el ID del usuario o del cliente. Por lo que el cliente me enviará el ID alguna manera y luego lo encontraré en la base de datos y borrado. Entonces, ¿cómo puedo obtener el DNI del cliente? Hay una manera, Es muy buena manera. Es a través de la URL. Entonces no puedo decir aquí por dos puntos y luego puedo decir por DNI. Por lo que este ID, puedes ponerlo como quieras, como cualquier nombre que quieras. Entonces la URL se verá como api slash v1 slash el ID, que quiero eliminar de la categoría. Entonces aquí, cómo voy a obtener este ID de la URL. Es muy sencillo. Digo solicitar punto params dot ID. Entonces aquí este nombre es el mismo que, como asigné aquí. Entonces por ejemplo, digo categoría id. Yo, entonces debo poner aquí ID de categoría. Entonces antes de ver que pedimos el cuerpo. El cuerpo es cuando enviamos la solicitud dentro del cuerpo. Por lo que aquí tenemos cuerpo y estamos enviando en el cuerpo de la solicitud, los datos. Pero ahora los enviaremos o enviaremos el DNI por la URL. Entonces como vemos aquí, que este método nos devolverá una promesa. Entonces diré entonces y luego la promesa me devolverá un documento y el documento que es la categoría eliminada. Entonces digo aquí, si hay categoría, como si la encuentras,
entonces devuelve un punto de respuesta,
status dot o lo siento, 200 y dot JSON. Y puedo crear mi propio objeto. Puedo decir que el éxito es cierto y algún mensaje para el usuario. Por lo que no puedo decirle que se borra la categoría. Y luego si no hay categoría, cuando no encuentro esa categoría más,
digo regresar, estado de punto de respuesta. El código no encontrado es 404. Y ese JSON, digo éxito, falso. Por lo que no encontré esa categoría y no se elimina nada. Por lo que puedo decir en la categoría de mensaje no encontrado. Pero, ¿y si ocurre algún error en el servidor? Por ejemplo, no sobre no encontrar esa categoría, sino algún error, como error de conexión o si compro los datos equivocados, ID incorrecta. Por lo que no puedo decir eso con el error catch. Digo que por favor encuéntrame o envíame un mensaje de que hay error ocurrido en el servidor. En general, no se trata de categoría encontrada o categoría no encontrada. Entonces aquí digo respuesta de retorno, estado de punto. El error en general es de 400. Por lo que JSON. Y entonces digo que el éxito es falso. Y luego puedo enviar el error al front-end al usuario. Entonces ahora probemos esta API, la eliminación de la categoría. Creemos uno y eliminemos iniciando de nuevo el servidor. Inicio Mpm. Estamos conectados a esa base de datos. Entonces vamos a crear, por ejemplo, nueva computadora de categoría por ejemplo. Sí, este nombre, lo mantenemos igual. Y copio esta categoría. Y luego cambio este método para eliminar. Entonces aquí digo después de categorías, digo el ID de la categoría que quiero eliminar. Y luego presiono Enviar. Bonita categoría se borra. Si volvemos a obtener la lista de categorías, si quieres, puedes ver aquí la historia de lo que hiciste antes. Entonces vamos a conseguir una lista de categorías. Todavía tenemos la vieja categoría que mala salud que borró también. Por lo que puedo ir aquí y decir borrar este DNI. Y luego si vuelvo a conseguir, obtendría matriz vacía. Por lo que no tenemos ninguna categoría. Ahora, intentemos eliminar ID no encontrada. Por ejemplo, puedo decir 444 aquí. Por lo que cuando lo envío, obtengo éxito categoría falsa no encontrada. Eso es bueno. Es exactamente el mensaje que queríamos. Y además, cometamos un error. Normalmente, si quieres cometer error al eliminar el ID de categoría similar u objeto ID tiene este formato en MongoDB. Cambiemos estos formatos. Por ejemplo, lo hago corto así. Entonces cuando envío, me llega aquí el error. Entonces el error es 400 y luego digo que el éxito cae y ocurrió el error. Se trata de ID de objeto porque tiene un formato incorrecto. Tienes aquí esa elección que hacer entre asincrónico, esperar métodos o con entonces. Entonces las promesas, pueden ser en ambos sentidos. No tienes ninguna diferencia. Pero aquí también es más guiado y aquí hay código más corto. En la próxima conferencia, veremos cómo obtener lista de categorías y también una sola categoría.
21. Obtener categorías y detalles de la categoría: En esta conferencia, vamos a obtener lista de categorías y categorías detalle. Por lo que primero haremos la lista de categorías. Ya lo hicimos antes en las conferencias anteriores. Entonces aquí estoy usando getMethod y luego estoy usando find. Con el uso de este método, obtendré la lista Categorías. Y si hay lista de categorías, entonces voy a conseguir, lo
enviaré por respuesta. Y si no hay nada, entonces enviaré error. Vamos a editar, editar aquí. Y podemos decir estado 2s 200 que encontramos la lista de categorías. Ahora vamos a conseguir una categoría por ID. Entonces voy a decir aquí o alterar. También es solicitud GET. Por lo que este get aceptará la misma API pero con parámetro como vimos antes. Por lo que usaría aquí método asíncrona, solicitud, respuesta, función de rol. Y entonces voy a hacer una categoría constante. Y aquí usaría método await. Por lo que voy a hacer aquí llamado la categoría. Y hay método llamado find by ID. Por lo que usando este método, pediré el id de la solicitud params dot ID. Y voy a comprobar si no hay categoría, luego enviar la respuesta equivocada o error. Si hay categoría, Entonces la enviaré con esa respuesta. Entonces aquí lo hice rápidamente. Si no hay categoría, entonces enviar respuesta 500. El mensaje al usuario diciendo que no se encontró la categoría con el ID dado. Y si hay categoría, Entonces lo enviaré con esa respuesta. Vamos a probar esto con Cartero. Por lo que la lista de categorías es la versión de API una slash categorías y una solicitud de get que envío, pero no tengo ninguna categoría. Añadamos uno. Tengo aquí la solicitud de post, y tengo el cuerpo ya en esta. Y añadamos otro como la salud. Salud. Eso es fin. Por lo que tenemos que volver ahora a la solicitud GET. Llámalo de nuevo, tengo dos solicitudes o dos categorías. Vamos a obtener esta categoría sólo por ID. Por lo que pasaré sólo el ID después de la URL. Daré clic en enviar. Y obtuve la categoría detallada aquí en mi solicitud API.
22. Actualización de la categoría: Bienvenido de nuevo. Por lo que ahora actualicemos la categoría. Actualizar categoría significa que vamos a actualizar ya sea el nombre o el color o el icono. El HTTP solicita para hacer eso se llama Realtor dot put. Por lo que hemos puesto, puedo actualizar los datos en la base de datos. Pero aquí es mezcla entre conseguir los params y conseguir el cuerpo, los params. Lo utilizaremos para obtener el ID del producto o la categoría que queremos actualizar. Y luego en esa respuesta o en el órgano de solicitud, Haremos eso. Obtendremos los datos los cuales se actualicen. Entonces de la misma manera aquí, solicitud
asíncrona y la respuesta será un método ROM. Y entonces voy a constante la categoría en alguna variable. Y entonces voy a decir esperar por categoría y encontrar por identificación y actualización. Para que pueda encontrar el producto y luego nuestra categoría, y luego lo actualizo. Por lo que el primer parámetro de este método es solicitar dot powerapps dot ID. Entonces tengo que pasar el ID, que obtuve del usuario. Y el segundo parámetro es el objeto donde contiene los datos actualizados. Por lo que la categoría tiene un nombre e icono y color. Por lo que obtenerlos de petición cuerpo de punto, nombre de punto. Lo mismo, exactamente como publicamos una nueva categoría. Entonces lo haré aquí. Entonces si consigo categoría, entonces todo está bien y todo se actualizó. Si no, entonces hay error. Entonces voy a implementar esta lógica. Es exactamente lo mismo como lo tenemos en el post. Por lo que copiaré lo mismo y lo pondré aquí. Entonces guardaría conectado a la base de datos, y ese es el estado con Cartero. Por lo que aquí tenemos la lista de categorías que creamos antes. Ahora tomemos este ID y cambiemos este método a un puesto. Y luego paso el DNI que me dieron. Y el cuerpo será diferente. Por ejemplo, aquí lo tenemos computadora elefante computadoras 11. Cambiémoslo, por ejemplo, para elegir
a través de la fonética. Y el ícono será el mismo electrónico, y el color es 55 cuando envíe. Entonces lo que tengo aquí son los datos antiguos en Node.JS. Existe opción si quieres recuperar los datos antiguos que envías, o por ejemplo, que era la categoría original o los datos actuales que lo actualizas. Porque si vamos aquí y presionamos en get, veremos en nuestra lista los datos actualizados. Tendremos aquí, la electrónica. Pero aquí en la solicitud PUT, devolvimos los datos antiguos. Entonces en este caso, en Node.JS, necesario pasar un parámetro al hallazgo por ID y actualización, que se llama es objeto por supuesto, y se puede decir un nuevo a través. Entonces aquí significa que quiero devolver los nuevos datos actualizados. Guardémoslo e intentémoslo de nuevo. Entonces vamos al puerto. Vamos, por ejemplo, a cambiarlo por otra cosa, por ejemplo, belleza. Y aquí dije Belleza. Y hago click, luego obtuve los datos actualizados. Si vuelvo a decir aquí con la lista, me dieron los todos los datos actualizados.
23. Post un nuevo producto REST API: Por lo que en esta conferencia veremos cómo publicar un nuevo producto. Al igual que trabajar con categorías. También vamos a publicar un nuevo producto. Por lo que sólo necesitamos recoger los campos, los mismos campos que se envían desde el front end. Y luego agréguelos como modelo de producto y luego guárdalos en la base de datos. Anteriormente, hicimos esta parte. Entonces vamos a refactorizarlo y hacerlo con nuestro modelo y con nuestra base de datos. Entonces vamos a crear nuestra copia los campos que teníamos en el modelo. Entonces aquí ya siento los campos para no tomar tanto tiempo en llenarlos. Todos son iguales. Todos vienen del cuerpo. Vamos a reducir también aquí el código para que podamos usar asíncrono y esperar. Por lo que aquí voy a añadir asíncrono. Y luego vayamos hacia abajo. Y decimos, tenemos, por ejemplo, producto es igual a esperar y el producto que creamos el modelo de producto dot save. Por lo que tenemos aquí ahora se crea el nuevo producto después de guardarlo. Entonces, eliminemos esta parte. Y aquí decimos, si no hay producto, luego devuelto como respuesta, elcódigo de
estado es 400 o 500,
que es como un código de
estado es 400 o 500, error interno del servidor. Y luego enviar un mensaje de que el producto no se puede crear. Y si todo va bien, entonces devuelve el producto. Entonces, ¿qué es especial aquí? El especial aquí que puedes publicar el producto fácilmente, pero ¿qué pasa si el usuario o el frente y el centro en la categoría equivocada? Entonces por ejemplo, si tengo algún ID de categoría y el usuario creó ID de él mismo, y este id de la categoría no existe en ninguna parte de la base de datos. Entonces vamos primero a validar si hay categoría existe o saber. Para hacer eso. Podemos lo mismo, podemos hacer, const categoría. Y en esta categoría decimos esperar un nuevo modelo de categoría. Y encontrar por DNI. Ya vimos esto antes. Por lo que digo solicito cuerpo de punto, categoría de puntos. Por lo que el front end en
la categoría enviará el ID de la categoría que quiero agregar al producto. Entonces aquí, si no hay categoría, entonces devuelve estado de punto de respuesta, por ejemplo,
400, que el usuario cometió un error y está enviando categoría inválida. Por lo que en general, tenemos todos los campos y el usuario debe enviar la categoría. Si todo es válido, continuará y agregando su producto con normalidad. Probemos eso con Cartero. Entonces voy a Cartero y creo una nueva API. Y el enlace será el mismo. Http y categorías, no categorías. Necesitamos productos. Entonces pluma creo que ahora podemos agregar el cuerpo aquí. Y este amigo será el tipo de fila. Y esta fila no es texto, es JSON. Por lo que el front end enviará bloque adyacente al back-end. Por lo que ya lo tengo preparado para no perder tiempo en escribir esto. Por lo que tengo el nombre, la descripción y leer descripción, imagen, marca, precio, categoría, y la categoría. Obtuve la cadena de la lista de categorías. Entonces si recuerdas, tenemos dos categorías. Copié uno y lo agregué aquí. Y el stock de conteo es de 10. Calificación es para no tanto buen producto. Y críticas. El número de opiniones es 22. ¿ Y se presenta? Sí, es cierto. Por lo que ahora cuando envíe el producto, obtendré respuesta del producto y con una nueva identificación del producto. Vamos a revisar la base de datos Atlas. Aquí está Atlas y tenemos aquí MongoDB, recrear una actualización. Entonces vemos aquí que el producto ya está publicado. Y notamos que la categoría tiene ID de objeto. Ahora intentemos enviar categoría inválida. Entonces Vamos a quitar, por ejemplo esto y que sea 80. Por ejemplo. Enviar Tengo categoría inválida. Y eso es huesos es 400 mala petición. Entonces lo especial en publicar un producto es sólo cómo lo vinculamos a la categoría. Por lo que debes validar cada categoría que ya existe en la base de datos y luego enviarla al puesto con la publicación del producto. De esta manera, tendrás un producto válido el cual realmente está vinculado a una categoría.
24. Consigue un producto y lista de productos REST API: Cuando estábamos preparando nuestra API, hicimos una solicitud get para una lista de productos. Entonces como vemos aquí, la lista de productos se guarda con find. Y entonces lo estamos devolviendo al frente eso. Entonces intentemos eso con nuestros cambios. Con Cartero. Veo aquí el producto, cambio el post para conseguir. Y vemos que tenemos array y lista de productos. Eso es muy sencillo. Vamos a crear una solicitud GET sólo para un producto. Será exactamente lo mismo que obtener lista de productos, como vimos antes. Sólo necesitamos aquí para agregar el parámetro ID. Y cambiemos este nombre por producto. Y ahora si hay un producto, entonces si no hay producto, lo siento. Por lo que devuelves un error. Si hay producto, entonces envíelo de nuevo al front-end o a la API. Pero lo que necesitamos cambiar aquí no está bien, sino encontrar por identificación. Y el ID, como vimos antes, viene de solicitud mirada por el o, lo siento params dot, porque tenemos los params en la URL, el ID. Guardemos y probemos. Ahora. Copia, por ejemplo, una de las ID que tengo aquí para los productos, y la pongo aquí después del producto. Entonces tengo el DNI aquí. Y digo, lo consigo, entonces me dieron los detalles del producto exactamente como aquí. Yo quisiera mencionar aquí que, por ejemplo, en la lista de productos, a veces si tengo una gran lista de productos, no
tengo que enviar todos los datos. Por ejemplo, si quiero en el front end mostrar sólo el nombre del producto y la imagen. Por lo que me manivela crear una API específica que devolviendo sólo lista de nombres e imágenes de los productos. Probemos eso ahora. Entonces siempre, después de haber encontrado aquí, encontrar método, si hago clic en punto, entonces encontraré un método llamado seleccionar. Por lo que es exactamente como seleccionar una consulta. Entonces puedo pasar aquí qué campos quiero mostrar. Entonces digo por ejemplo, sólo
necesito el nombre. Entonces digamos aquí nombre en una cadena y guárdalo. Entonces aquí vamos a quitar el producto solo uno y obtenemos una lista. Y vemos aquí tenemos lista de productos y sólo los nombres si queremos, por ejemplo, nombre e imagen. Entonces voy a esta cadena y añado solo espacio. Y luego el campo que quiero mostrar, por ejemplo, digo imagen, y luego guardo. Vayamos a Cartero y obtendríamos imagen y nombre. Aquí notamos que hay DNI, por lo que también podemos excluir este DNI. Cómo podemos hacer eso. Vamos también a la misma cadena, y tenemos el ID en este caso. Por lo que puedo decir menos el DNI. Por lo que cuando presiono Guardar, voy a Cartero, envío esa solicitud. Tengo ahora selección limpia. Por lo que de esta manera, puedes crear tus API con más rendimiento y más eficientes. Por lo que no tienes ningún obstáculo en las memorias para cargarle al cliente. Necesitas una lista de producto. Entonces solo manda lo que necesites. Para que puedas crear una API especial para eso. Para que puedas enviar lo que quieras a través de esta API.
25. Mostrar detalles de la categoría en el producto Populate: Entonces como vimos anteriormente, que estamos consiguiendo un solo producto de esta manera. Entonces, pero el campo de categoría es sólo el ID. Si quiero, por ejemplo, mostrar el producto con el nombre de la categoría. Entonces tengo, por ejemplo, el detalle del producto, pero también quiero mostrar su nombre. Entonces no es agradable ir y obtener otra solicitud para la categoría y luego fusionar estas dos solicitudes juntas y mostrar en el front end lo que necesito. Hay una manera muy bonita de hacerlo en MongoDB y Mangosta. Entonces después de encontrar por método ID, cuando presiono punto, los
veo MSO hay poblado. Rellenar significa que cualquier ID o
campo conectado a otra tabla se mostrará como detalle en este campo. Entonces qué campo es tiene, por ejemplo, ID, que está vinculado a otra tabla, como vimos antes en el esquema que tenemos aquí, creamos la categoría es ID de objeto y la categoría de referencia. Por lo que esta categoría en realidad es ID como vimos antes. Entonces digo un agitado poblado. Categoría. Voy a Cartero y luego hago clic en Enviar. Veo que obtuve los detalles de la categoría. Entonces aquí de esta manera, cuando creo una solicitud GET para un solo producto, asumo que estoy en una página de producto. Envio una solicitud para obtener el detalle del producto, y luego obtengo también el detalle de la categoría para poder mostrarlos también en la página del producto. Funciona también con la solicitud GET. Por lo que se ponen en general. Entonces si quiero aquí tener toda la lista poblada, así que solo digo poblar categoría de todas las listas de producto. Presiono Guardar, ve a Cartero. Obtengo lista de productos y IC los ya poblados. Algunos de ellos, no están conectados a una categoría. Ellos son previamente los creamos. Entonces aquí, por ejemplo, este producto, tiene una categoría y está conectado a alguna categoría en base de datos. Entonces como recapitulación, si alguien te pregunta cómo puedo conectar tablas MongoDB juntas como base de datos relacional, solo
creo un campo en la tabla original. Y entonces digo en este campo que quiero un ID de objeto y se hace referencia al esquema que creé para la otra tabla. Y luego cuando estoy creando una solicitud GET, digo poblar este campo. Por lo que este campo debe ser un ID y luego poblará lo que está relacionado con esa tabla.
26. Actualización de un producto REST API: Por lo que ahora actualicemos nuestro producto. Actualizar un producto es exactamente de la misma manera en que actualizamos una categoría. Pero como vimos en el post, sólo
necesitamos validar la categoría. A pesar de que ir a categorías, vamos a copiar toda la solicitud PUT sería exactamente la misma. Y luego voy al producto, agrego la nueva ruta. Y aquí tenemos producto o puesto ID. Y luego haremos lo mismo, lo que hicimos para categoría. Entonces cambiemos esto por producto. Aquí está producto, modelo de producto. Encuentra por DNI y actualización. Contamos con los perímetros solicitados params ID y voy a conseguir los campos desde aquí. Vamos a copiarlos igual y pegarlos aquí. Por lo que tenemos todos los campos del producto, nuevos. Sí, queremos devolver el nuevo producto. Si no hay ningún producto, entonces envíe una solicitud incorrecta o un error interno del servidor y luego diga, el producto no puede ser positivo. Y además, si todo está bien, entonces envía de vuelta el nuevo producto. Sólo ahora nos falta la parte donde necesitaríamos validar la categoría. Entonces otra vez aquí obtenemos lo mismo aquí. Y luego digo pega categoría costo, y luego estoy pidiendo categoría. Y si eso no es categoría, entonces envía categoría inválida al usuario. Entonces probémoslo ahora con el Cartero. Yo voy a Cartero, vamos a copiar o tenemos los campos ya aquí. Entonces podemos cambiar esto, ponernos. Y aquí paso la idea que quiero cambiar. Entonces digo aquí, por ejemplo, este DNI. Y luego cambiémoslo a producto uno en nuevo. Y aquí también describirás tú y Ford ejemplo. Actualicemos el precio 32. Y eso es todo. Enviamos la solicitud de post y nos llegó un error aquí que es de categoría inválida. Entonces hagamos la categoría correcta. Por lo que vamos aquí a las categorías API y recogemos la correcta y actualizada aquí. Y ellos mandan, nos dieron de nuevo el nuevo producto. Por lo que vemos u escuchamos el producto nuevo y la descripción está en U y con el nuevo precio. Entonces lo único que hicimos aquí que también, validamos la categoría. Entonces en el front end, como veremos más adelante, que tendremos Foro del producto. Entonces cuando hago clic en Editar, entonces veo los campos ya llenos. Por lo que solo actualizo los campos que necesito y luego vuelvo a mandar esa solicitud. Comprobemos también la base de datos si todo está actualizado. Y luego consigo la lista de productos. Y veo aquí el producto tiene una nueva descripción y un nuevo nombre. Y por supuesto también entonces tu precio.
27. Eliminar un producto REST API: También eliminar un producto es de la misma forma en que eliminamos una categoría. Pero aquí quiero mencionar algún punto que es muy importante para validar nuestra API. Primero copiemos también que eliminemos solicitudes de categorías. Tomaré éste y luego lo pegaré aquí en la API de Producto o rutas de producto. Reemplazamos todo al producto. Todo se reemplaza. Entonces tenemos ahora a todos los estados. Y probémoslo ahora. Consigamos una lista de productos. Conseguirá que tengamos todos estos productos. Quitemos los viejos porque están vacíos. Para que podamos seleccionar uno de los ID, cambiar esto para eliminar, y enviar esa solicitud. Ahora saxes a través y se elimina el producto. Lo que quiero mencionar aquí es cosa muy importante. Entonces, ¿y si envío una mala identificación como esta? Veré que obtendré error de que el ID de objeto no es válido. Por lo que también necesitamos validar el ID de objeto en todas las solicitudes. Entonces en este caso, captamos un error. Pero aquí en la solicitud PUT, esa solicitud no hay ninguna captando el error. Solo estamos comprobando si estamos consiguiendo un producto o no. Pero aquí está revisando la identificación, por lo que se colgará de alguna manera. Entonces cambiemos eso a la solicitud PUT y hagamos un problema en el, en el ID. Por ejemplo, elimino éste y luego envío una solicitud y veo que el backend está colgado. Por eso prefiero más de esta manera, la forma prometida. Entonces puedo decir siempre lo que puedo ver, lo que puedo conseguir y lo que puedo atrapar. Pero si quieres seguir así, por lo que tampoco podemos validar sólo la categoría. Podemos validar el DNI. ¿ Cómo podemos hacer eso? El ID debe ser el tipo de ID de objeto que se almacena en Mangoose. Por lo que aquí empezaré primero a hacer una constante. Requerir mangosta. Esta mangosta constante. Tiene un método donde puedo usarlo en la solicitud PUT. Por lo que no puedo decir que el punto de mangosta es válido ID de objeto, así que puedo pasar entonces el punto de solicitud params dot ID. Entonces si esto es válido, entonces continúo. Si no, entonces devuelvo una respuesta sobre el error. Entonces como vemos aquí, esto es devolviendo un booleano. Entonces pongámoslo dentro de un if. Entonces digo aquí si Mangosta. Por lo que enviaré también una mala solicitud de esta manera y digo ID de producto inválido. Y en este caso, el producto o la API devolverá por mí error cuando esté pasando por ID. Probémoslo ahora. Tenemos identificación equivocada. Veo que no devolví ningún error. Esto se debe a que dije si es válido entonces devolver error, por lo que no debería haber válido, así que agrego no. Entonces volvamos de nuevo y enviemos de nuevo la solicitud. Y obtengo error ID de producto inválido.
28. Consigue productos en la cuenta para fines de estadísticas:: Bienvenido de nuevo. En ocasiones en el panel de administración, quiero mostrarle al administrador cuántos productos tengo en la base de datos. Entonces en este caso, quiero ver una API que me esté devolviendo todos los productos o cuántos productos tengo en la base de datos. Por lo que devolverá sólo un número. La mangosta tiene muchos métodos. Por lo que en base a esos métodos, puedes devolver cualquier consulta que quieras con una API. Por ejemplo, en Mangoose, puedes tener desde el producto modelo cualquier método que quieras devolver. Para que puedas crear tu propia API en base a lo que te proporciona Mangoose. No contaré de los productos. Deseo precio total total de mis productos. Quiero, por ejemplo, total o precio de los pedidos, ventas totales, cualquier estadística que quiera tener en mi front end, por ejemplo, quiero tener panel admin. En el futuro. Te voy a mostrar eso con algunas estadísticas. Entonces para eso, necesitas crear API, que es conseguir normalmente para obtener lo que quieres de la base de datos. Entonces agreguemos uno nuevo aquí, como router dot get. Sería getMethod por supuesto. Y luego decir, por ejemplo, obtener conteo de slash. Por lo que la API será después de que los productos obtengan la cuenta. Por lo que el segundo parámetro, será el mismo que getMethod. Entonces vamos a copiar este de la misma manera y sólo cambiemos el camino ahí. Por lo que digo conseguir conteo, tengo respuesta asíncrona y aquí necesito cambiar en base a lo que Mangoose me da. Por lo que creamos una constante, lo
llamamos recuento de productos. Y aquí eliminaría hasta el final y diría por ejemplo, hay un método conjunto de documentos de recuento. Entonces quiero ver cuántos documentos hay en este modelo o en esta tabla. Entonces cuente documentos y luego devolverá el conteo o como devolución de llamada. Y entonces digo que sólo devuelva el conteo. Entonces consigo el conteo y lo devuelvo. Y luego me devolvieron los documentos de conteo, el recuento de productos. Entonces aquí digo, si no hay conteo de productos y luego devolver un error al usuario, de
lo contrario, enviar el conteo de productos. Eso es todo. Normalmente regresamos un JSON. Entonces por ejemplo, digo aquí, productos es un recuento de productos, o por ejemplo, digo que solo conteo es conteo de productos. Tienes libertad aquí para elegir cualquier nombre. Prefiero éste. Vamos a probar que suponíamos hombre, voy a Cartero y luego digo productos método GET, conseguir contar. Y ejecutamos esto. Y vemos que el recuento de productos es de tres, así que realmente son tres. Comprobemos eso. Sí, tengo primero 1, segundo, 1, tercero 1. Eso es genial. Por lo que ahora podemos mostrarle al administrador qué productos o cuántos productos tiene en su charla.
29. Obtener productos destacados REST API API de REST: Otra solicitud de estadísticas puede ser, por ejemplo, quiero los productos destacados, como cómo vemos aquí en la página de inicio de este sitio web. Estamos viendo algunos productos destacados los cuales se muestran siempre en la página de inicio. Por lo que anteriormente en el modelo de productos, teníamos algo o algún campo llamado se presenta. Es destacado tiene un valor booleano como verdadero o falso. Esto significa que este producto debe mostrarse en la página de inicio o no. Ahora hagamos una API para obtener solo los productos destacados. Y para hacerlo más complejo, podemos tener cuenta. Entonces, por ejemplo, puedo conseguir tres productos destacados
o los últimos tres productos destacados o los últimos seis productos destacados. Hagámoslo ahora. Por lo que cualquier solicitud GET es como comenzar con router.get. Entonces vamos a copiar este y construir nuestra API destacada. O en lugar de conseguir contar, diremos conseguir productos
destacados, destacados, por ejemplo. Por lo que en Mangoose, necesitamos encontrar los productos destacados. Sólo, no todos los productos, sólo el destacado. Entonces digo aquí, productos dot find. Y como recuerdas antes, tuvimos algo de filtración. Acabamos de hablar de ello, pero veremos cómo construir unos filtros con el producto. Entonces de todos modos, así que ahora me parece que está aceptando como objeto y luego puedes definir qué campos se requieren para ser el valor. Entonces por ejemplo, digo que se presenta debe ser una verdadera. Por lo que todos los productos que ha destacado a través, entonces los conseguiré. Por lo que aquí todo se queda igual es de hecho sólo el objeto. Por lo que ISA aquí acaba de devolver para mí los productos. Entonces digo aquí productos, productos, productos. Ahora vamos a revisar eso con Cartero. Yo voy aquí, digo Get feature. Por lo que enviamos y
solo obtuvimos un producto destacado porque solo tenemos un producto destacado en nuestra API, por lo que en nuestra base de datos. Entonces si lo revisamos aquí, así que el primero tiene, es falso. El segundo también es falso, pero el último aparece. De acuerdo, así que ahora no quiero sentir mi página de inicio cual producto destacado por ejemplo, tengo como esta página por ejemplo, tengo 200 características productos. Por lo que no sólo voy a, por ejemplo, cinco productos. Para ello, podemos merecer también alguna limitación a nuestra API en base a lo que el usuario está enviando. Por ejemplo, puedo agregar aquí, como vimos antes, podemos agregar cualquier parámetro como antes, agregamos un ID. Pero aquí podemos agregar conteo por ejemplo. Y entonces aquí voy a conseguir este conteo. El recuento es igual a solicitar los params porque su parámetro y recuento. Entonces si hay solicitud de conteo de puntos o solicita un par params dot count, si el usuario pasa algo, entonces consíguelo. De no ser así, entonces devuelve 0. Entonces esto como si aquí. Entonces si hay conteo pasado con la API, entonces consíguelo. De no ser así, entonces devuelve 0. Por lo que este recuento puede ser este valor o este valor. Es exactamente como la declaración IF. Entonces, ¿cómo usaremos este conteo? Es muy sencillo. Después de encontrar lo que quiero, solo el producto destacado, digo conteo límite. Entonces probemos eso con Cartero. Decimos que te ofrezcas. Y luego el conteo que quiero por ejemplo tres, entonces enviaré esa solicitud. No lo haremos es que esté colgando. Entonces hay error. Comprobemos cuál es el error. El error está diciendo aquí que el campo incapaz de analizarse encontrar productos se presenta a través del límite de rechazo tres, Return key false. Entonces, ¿por qué está pasando esto? campo límite debe ser numérico, pero aquí lo tenemos numérico. Porque eso, porque aquí, esta solicitud dot powerapps dot count está devolviendo, como ves aquí, una cadena. Y esto también será una cuerda. Entonces tenemos aquí un valor de cadena, no un número, porque límite es pedir un número. Por lo que para cambiarlo fácilmente a un número, solo coloca un plus detrás de esta bebida. Por lo que ahora, después de guardar y reiniciar, el servidor, pide nuestra API. Obtendremos el producto destacado.
30. Filtrar y obtener productos por categoría: Continuando con el filtrado, Vamos a tener también filtrado por categorías. Por lo que cuando el usuario seleccione algunas categorías específicas, obtendrá aquellos productos que están en esa categoría. Y este es el filtrado normal en cada taller. Por lo que necesitamos de alguna manera ajustar la solicitud GET u obtener solicitud de lista de
productos para tener filtrado por categoría. Pero primero, necesito hablar de algo que hemos vivido antes. Dos tipos de parámetros que podemos enviar al backend. En primer lugar es el parámetro URL. Por lo que el usuario puede enviar cualquier ID después de que ellos, estás enfermo o en el parámetro corporal. Entonces tenemos cuerpo. Y dentro de este cuerpo hay algunos parámetros, y también con la URL. Por lo que tenemos otro tipo de valores de paso al backend, que se llama parámetros de consulta. Los parámetros de consulta se utilizan siempre. En este caso, por ejemplo, tengo API de URL, URL localhost, y luego paso el parámetro de consulta. El parámetro API se pasa así, por lo que puedo pasar aquí número, pero el parámetro de consulta va siempre después de un signo de interrogación. Por lo que no puedo decir siempre que necesito aquí unas categorías. Entonces como vimos antes eso también podemos filtrar en el método de hallazgo. Entonces después de pasar el modelo y luego encontrar, podemos pasar objeto como lo hacíamos antes. Me gusta se presenta como uno de los campos debe tener este valor. Pero ahora hagámoslo como categoría. Por lo que este Find debemos tener categoría y con un ID específico el cual es pasado por el usuario. Pero cómo podemos hacerlo múltiples valores, porque aquí sólo puedo tener un solo valor. Es muy sencillo. Simplemente puedes pasar una matriz y automáticamente mangosta se dará cuenta de que todos estos valores deben estar en esa categoría. Y entonces esto devolverá los productos adecuados que tenga esas mejores categorías. Por lo que no puedo decir aquí algo como esto, primera categoría y segunda categoría ID. Entonces hagámoslo aquí como algo diferente. Por lo que para ser más diferente. Entonces ahora necesitamos tomar de alguna manera este param de consulta y dividirlo en una matriz y luego pasarlo a este hallazgo. Entonces es muy sencillo. Digo si hay categorías request dot, jquery dot, que es éste, entonces vamos a guardarlo en alguna constante. Const, por ejemplo, filtro. Y este filtro, tendremos las categorías de consulta de punto de solicitud de valor. Y vamos a dividir este valor. Entonces lo dividimos por coma. Entonces decimos dividir, dividir la cadena basada en coma, y luego volverá para mí a los elementos de la matriz, que es una cadena y la otra. Simplemente, podemos colocar esta variable aquí porque la conseguimos dividida como array. Pero debido al alcance en JavaScript, no
podemos asignar este valor o usar valor fuera de este si, porque otros campos no lo pueden ver. Por lo tanto, es mejor crear la variable aquí y darle como matriz vacía. Y esta variable, le asigno la división, y luego la estoy usando aquí. Probemos eso con Cartero. Entonces voy aquí y traté de conseguir el producto. No obtengo nada porque eso estoy obligando a la API a tener categoría. Entonces cuando no hay nada, entonces debe tener una categoría. Entonces vamos a tener como forma más dinámica. Hago eso como objeto vacío. Y este objeto vacío será asignado y tiene valor cuando haya params y o parámetros de consulta. Entonces digo que la categoría es ésta. Y luego este filtro, elimino todo este objeto y luego se pasará a la multa. Entonces cuando está vacío, no hay nada. Por lo que obtendré toda la lista del producto. Y cuando haya parámetros de consulta, se llenaría de categoría, que es nuestra condición, y tendrá este valor por parte del usuario. Intentemos eso otra vez. Ahora. Yo mando esa solicitud, agradable. Conseguí todos los productos previamente. Creé algunos productos, por ejemplo, producto 1 y producto 2 y producto 3. Y tienen de diferentes categorías, por ejemplo, esta categoría y esta categoría. Entonces digo aquí, categorías de interrogación. Y el valor de estas categorías. Tomemos la primera categoría. Por ejemplo, éste. Y envío, y luego me dieron dos categorías o dos productos. Por lo que esos dos productos, pertenecen a esta categoría. Añadamos otro. Por ejemplo, el segundo, dividiéndolos con una coma. Entonces digo aquí. Entonces conseguimos 123. El primer producto es de la segunda categoría, y los otros dos productos, son de la primera categoría. Y cuando no pase nada, entonces funcionará normalmente para conseguir toda la lista de los productos. Entonces aquí el usuario tiene la opción de pasar los parámetros de consulta o no. Por lo que ahora en mi página de inicio, puedo tener, por ejemplo, algunos banners que están mostrando algunos productos específicos de categorías y también el usuario cuando va a la página de producto, también
puedes filtrar estos productos por categoría. Por ejemplo, será algo así como casillas de verificación o por ejemplo, algunas pastillas. Para que pueda hacer click sobre ellos y seleccionar las categorías para las que desea mostrar los productos.
31. Cambiar la clave de "_id" a "id": más en el frontend: Cuando estoy obteniendo un producto o lista de productos, Mangoose o MongoDB está enviando el campo con el derecho como los hice. Pero el DNI, tiene algún pequeño problema. Tiene este subrayado. Yo quiero que el ID sea solo ID como clave, por lo que puedo usarlo en todas partes de mis aplicaciones, no sólo, por ejemplo, para la aplicación que estamos haciendo en este curso. Por lo que puedo usar este backend con otras aplicaciones que
normalmente están aceptando mayoritariamente el ID solo como clave. De alguna manera. Mangosta, también podemos copiar este ID y crear un campo llamado ID solo sin guión bajo. Entonces, ¿cómo hacer eso? Se llama virtuales. Entonces con este esquema de producto, que creamos antes, siempre
podemos crear un ID Virtual. Y este Virtual ID tendrá un get. Y este get será de la ID que se pasa en el esquema del producto. Por lo que esta es una forma de hacerlo y de hexa string porque tenemos cadenas hexa para el ID, que se llama ID de objeto. Y luego necesitamos habilitar alguna opción para el esquema del producto. Y decir que cuando quiero enviar algún valor al front end o a la API, habilitamos los virtuales porque este es un campo virtual. Entonces en cada esquema, podemos agregar esas dos o cuatro líneas o dos métodos. Y entonces tendremos el DNI. Entonces si lo probamos ahora con el Cartero, puedo mandar. Y voy a decir que voy a tener el DNI original y el DNI que quiero. Así centro comercial front end amigable, puedo usar este ID directamente sin este subrayado molesto.
32. Introducción: Ahora llegamos al último módulo, que relacionado con la espalda y el desarrollo. Ahora necesitamos subir las imágenes con nuestro producto, como vimos antes, el producto contiene dos campos. Una de ellas es una imagen principal y el segundo campo son las imágenes. Entonces, ¿dónde estará más descripción sobre el producto como imágenes de una galería? Por lo que en este módulo, verá el paso principal es instalar biblioteca Walter. Biblioteca es una famosa biblioteca utilizada para subir archivos al servidor usando Node.JS. Y en el segundo paso, encontraremos la mejor configuración para nuestro e-Sharp porque necesitamos configurar esta biblioteca para usar y subir los archivos a nuestro servidor. El tercero, veremos cómo utilizar el destino y subieron los nombres de archivo. Siempre cuando el administrador suba un archivo o una imagen, debe especificar el nombre del archivo. Pero no, no podemos hacer eso por el administrador ni por el usuario. No tenemos que dejar que le ponga nombre al expediente. Podrás subir cualquier archivo y será codificado en nuestro servidor. Usar Cartero también es muy importante para nuestro caso aquí para probar la subida de imagen, veremos cómo probar la carga de imagen con un cartero usando subir un archivo o varios archivos. Y no permitiremos que el usuario cargue nada. Necesitamos que suba solo tipos específicos de imágenes, como con extensión PNG para J Beck. Y por supuesto, todo esto hecho por un solo archivo. Ahora necesitamos ampliar la biblioteca para que sea posible subir múltiples archivos. Y se necesitan múltiples archivos para que subamos muchas imágenes para la galería de productos. Y por último, veremos cómo buscar este producto con las imágenes y
las imágenes de la galería para verlas en el front end. Por supuesto, vamos a buscar sólo la URL de la imagen. Espero que disfruten de este módulo y nos vemos en la próxima conferencia donde empezaremos a instalar biblioteca de mortero.
33. Modelo y esquema de usuarios: Como teníamos en nuestro modelo de usuario antes, vemos que necesitamos un nombre y correo electrónico y contraseña, etc. Así que construyamos nuestro esquema de usuarios exactamente cómo lo tenemos en este modelo. A la derecha. Ya los escribí para que podamos repasarlos rápidamente. Y luego se puede implementar desde el código que voy a subir a los recursos. En primer lugar, el nombre del usuario es una cadena y se requiere. En segundo lugar, el correo electrónico es una cadena y también verdadero requerido. Y también el hash de contraseña. Dijimos que guardaremos la contraseña hashed en la base de datos. Será una cuerda y se requiere. El número de teléfono del usuario también será una cadena o un número. Y con lo verdadero y se requiere. Aquí, identificaremos al usuario si es administrador en la tienda o no. Por lo que será un booleano y el valor predeterminado es falso. El domicilio que se utilizará para el envío del pedido del usuario. Entonces podemos usar una calle como una cadena, y el valor predeterminado es el valor vacío. Apartamento también es String. Zipcode es una cadena, ciudad y país. Y al final tenemos un esquema de usuario, como lo hicimos anteriormente con los productos, creamos un ID virtual. Entonces obtendríamos identificación de esa manera, no de esa manera. Por lo que es más amigable para el usuario o front-end. Por lo que podemos usarlo en el front-end como un ID normal para buscar datos de usuario o identificar a un usuario. Y aquí habilitamos los virtuales para el esquema. Y aquí la exportación normal del módulo y el esquema. Entonces todo esto se trata del esquema de usuario. Nos moveremos ahora para crear un usuario o usuario registrado en nuestra tienda online.
34. Registre una API nuevo REST de usuario: En esta conferencia, veremos cómo registrar o publicar un nuevo usuario como cualquier solicitud de post. También podemos publicar los datos del usuario en el cuerpo de la solicitud y luego enviarlos a la base de datos. Entonces para que sea rápido, Vamos a copiar una de las solicitudes de post que tenemos antes, por ejemplo, la categoría. Entonces vamos a copiar este y luego pegarlo en nuestro módulo de rutas de usuario y empezar a agregar las solicitudes de cuerpo en base al modelo que teníamos antes para el usuario. Entonces, sentiremos todos estos campos como si los tuviéramos desde el front end como normales y pegarlos aquí en nuestra solicitud. Por lo que antes que nada, ajustaré esto para ser usuario. Y aquí usaríamos modelo de usuario. Y luego esperaré para guardar al usuario. Y luego si no hay usuario, entonces responde con el error de que el usuario no puede ser creado o registrado. Entonces vamos a sumar los campos que necesitamos ahora. Por lo que separaré estas dos pantallas y luego añadiré mis campos aquí. Entonces nombre, el mismo nombre. Y el correo electrónico será correo electrónico. Y aquí el cuerpo de correo electrónico. Hagámoslo rápido por el resto. Ahora, nuestro nuevo modelo de usuario se verá así. Entonces puse todas las llaves o todos los campos, que las obtuve del esquema. Y ahí asumí que estoy sacando eso del cuerpo de la solicitud. Por lo que este amigo y solicitud vendrán del cartero o del front end. Cómo veremos a continuación. Probemos eso con un cartero ahora. Entonces vamos a crear un objeto, por ejemplo, y voy a asignar un usuario y un hash de contraseña y toda esta información en ese objeto. Entonces, ¿cuál será la ruta completa para eso? Será la ruta API y luego los usuarios. ¿Por qué? Porque en el app.js, teníamos antes, aquí se definen todas las rutas de API. Entonces estoy diciendo productos AP US y luego asigno las rutas de productos. Y entonces aquí tendremos usuarios. Por lo que en nuestra API, usaremos usuarios. Entonces yendo al front end, Vamos a copiar una de las API que teníamos antes y pegarla aquí. Y aquí. En lugar de productos, diremos usuarios. Eso es perfecto. Entonces vamos a añadir un post. Y luego en el cuerpo, vamos a sumar una fila. Y el tipo de esta fila es JSON, porque el usuario enviará los datos en formato JSON. Y entonces vamos a crear aquí nuestro objeto. Entonces yo diría el nombre, y le asigno cualquier nombre, por ejemplo, James, y lo mismo para el resto. Entonces, vamos a sentirlas. Entonces tenemos aquí el hash de contraseña, el número de teléfono, el administrador, Sí o no, departamento, código postal, ciudad y país. Por lo que en este caso, tendremos un usuario el cual tiene estas propiedades. No debemos poner la contraseña así. Entonces tenemos que hachearlo, como veremos en la próxima conferencia. Por lo que ahora planteo los datos y obtengo toda esta información. Por lo que tenemos aquí nombre que nombre de usuario, y los datos y toda la información que ingresamos. Y también la API respondió con ID y subrayado ID. Por lo que el usuario ha creado en la base de datos. Vamos a revisar nuestra base de datos sobre Atlas. Entonces cuando vayamos a nuestro clúster y luego colecciones, accederé a nuestra base de datos, que es de usuarios o base de datos de e-shop y los usuarios de mesa. Y veremos que aquí se crea el usuario. Creo que me perdí un campo el cual no se envía con la API, así que tenemos que agregarlo. Entonces sumémoslo aquí, que es calle. Entonces le ponemos tres también, y son 3s. Por ejemplo, 100. Voy a añadir diferentes usuarios con diferentes nombres para sentir nuestra base de datos. Entonces diré James, por ejemplo, yo diría Tom y Tom aquí. Y la misma contraseña, Asumamos que tiene 777 aquí y la misma dirección por ejemplo. Y vamos a enviar, enviar. Tendremos también lo mismo que también otro usuario como Mike. Tendremos aquí, Mike pequeño m. y también la misma información como digamos aquí 88. Y el número de calle, por ejemplo, cinco, el piso es 4. Entonces en este caso, en nuestra base de datos teníamos tres usuarios. Como veremos aquí. Estoy refrescando la página. Y veremos aquí que tenemos tres usuarios.
35. Hashing la contraseña de usuario: Guardar la contraseña, en este caso como texto plano no es seguro porque si alguien consiguió de alguna manera nuestra base de datos, verá la lista de todas las contraseñas de todos los usuarios en nuestra base de datos. Por lo que es mejor de alguna manera hash o codificar alguna manera para que nadie pueda entender qué es esto, la verdadera contraseña detrás de este hashing o está codificando. Para ello, hay una biblioteca,
es proporcionada por NodeJS. Se llama descifrar el js. Podemos instalarlo aquí en una nueva ventana. Por lo que MPM instalar ser agarrado JS. Y voy a instalar esta biblioteca y luego importarla en mi aplicación. Por lo que yo diría causado, ser agarrado y requerir descifrar JS. Entonces, ¿cómo vamos a utilizar esta biblioteca? Por lo que no le pediré al usuario ni al front-end un hash de contraseña. Pediré una contraseña normal, pero internamente en mi back-end, encriptaré esta contraseña. Por lo que aquí voy a decir ser crypt dot, hash sync. Y luego Hash Sync pedirá una cuerda y también algo llamado sal. El sal es, por ejemplo, como información extra, extra secreta para que cualquier persona no pueda descifrar este hash. Entonces por ejemplo, añadiré aquí mi secreto. Se puede agregar cualquier secreto. Por ejemplo, se puede decir mi cigarrillo. Se puede agregar cualquier cosa. Añadiré aquí, por ejemplo, número, es 10. Y no le pediré al usuario un hash de contraseña, pero le pediré simplemente una contraseña. Probemos eso ahora y veamos qué nos responderá
el servidor o el backend después de cifrar la contraseña. Entonces aquí, vamos a crear otra contraseña de usuario, no hash de contraseña. Por lo que será de uno a seis también. Y tiene alguna información como antes teníamos. No lo hagamos admin por ejemplo. Y voy a enviar, y vamos a ver aquí el hash de contraseña así. Entonces no es exactamente lo que envió el usuario. Por lo que usaremos de alguna manera cuando
iniciemos sesión, vamos a comparar este hash con la contraseña que usó el usuario cuando se bloqueó. Esto también se hará por librería de descifrar. Por lo que ahora tenemos un back-end seguro u objeto seguro
del usuario para que nadie pueda resolver o descifrar esta información.
36. Consigue el usuario y la lista de usuarios que se excluye la contraseña: Como vimos antes, que creamos solicitud GET para obtener lista de usuarios. Y también podemos crear lo mismo para conseguir un solo usuario. Por lo que copiarlo de categorías también. Y voy a cambiar esta categoría usuario. Entonces de esta manera, tenemos una lista de usuarios y obtenemos un solo usuario. Probemos eso con un Cartero. Yo voy aquí y no voy a conseguir un usuario que tenga su DNI. Ahí está así y no voy a lista de usuarios. Entonces los consigo así. Tenemos un tema de seguridad aquí. No quiero enviar la lista de usuarios con su hash de contraseña. Por lo que es mejor enviar la API o los campos API sin Password Hash. ¿ Cómo podemos hacer eso? Anteriormente, vimos que podemos excluir algunas partes de nuestra API o algunos campos. Cómo hacemos eso después de llamar al método find, ponemos Select y luego presiono Menos, y luego con menos, puedo especificar qué campo se debe excluir. Por ejemplo, aquí en este caso, diré hash de contraseña. Y luego cuando llame a la API, voy a ver que tengo campos sin hash de contraseña. Hagamos eso también para el único usuario. Pondré aquí selecto, o podemos copiar esto directamente. Funciona también con hallazgo por ID, como con hallazgo y ancho, encontrar por ID. Guárdalo. Pruébalo. Y vamos a conseguir, por ejemplo, este usuario con este ID que publiqué aquí. Y vemos que conseguimos a ese usuario sin ningún hash de contraseña. También podemos, al obtener lista de usuarios, por ejemplo, en el panel de administración de mi aplicación, solo
quiero mostrar el nombre del usuario y por ejemplo, número de
teléfono y correo electrónico. Por lo que en este caso, se
puede crear una API que sólo tenga estos campos. Por lo que puedes seleccionar no con menos, pero puedes decir nombre, teléfono, correo electrónico. Entonces obtendrás solo estos campos con esta solicitud de esta API. Entonces vamos a por ellos. Recibimos nombre, correo electrónico, y teléfono solamente. Esto es muy útil cuando quieres, por ejemplo, cuando tienes una lista de picos y luego esta gran lista, quieres reducirla. Por lo que solo desea seleccionar unos campos específicos que desea utilizar en el front-end. Volvamos a ponerlo al hash de contraseña. Por lo que solo quiero excluir el hash de contraseña y obtener lista de usuarios con todos sus detalles.
37. Accede una API REST de usuario y crea un toto: En esta conferencia, veremos cómo el usuario puede iniciar sesión y utilizar las API. Por lo que se le requiere tener su correo electrónico o ID y contraseña para luego enviarlos de alguna manera con API al servidor de autenticación. Y el servidor de autenticación responderá con GW t, que es JSON Web Token, y dirá que el usuario está autenticado y es capaz de utilizar las API que están aseguradas. Empecemos a hacer la primera parte. Por lo que necesitamos crear una solicitud de post donde la persona pueda enviar su nombre de usuario y contraseña al servidor. Entonces, primero creemos una solicitud de post en nuestra API de usuarios. Por lo que diré router dot post, y luego la ruta será login. Y luego vamos a guardar un método asíncrona, la solicitud y la respuesta. Y tendremos aquí la devolución de llamada. Hagamos el login por correo electrónico. Por lo que esperaremos en su respuesta por el correo electrónico y la contraseña. Entonces primero, necesitamos saber si este usuario existe. Realmente tengo un usuario con este email. Entonces primero, voy a crear constante, darle usuario. Y este usuario tendrá un método de peso, exactamente como lo hicimos antes usuario y encontrar uno. Deseo encontrar usuario por e-mail. Entonces diré aquí, encuentra uno, y entonces será objeto. Puedo asignar por qué campo quiero buscar al usuario. Por ejemplo, quiero buscar por correo electrónico. Por lo que aquí diré correo electrónico. Y el correo electrónico vendrá de la solicitud dot body dot email. Entonces aquí ya tengo al usuario, que se envían a buscar por el correo electrónico. Entonces si consigo un usuario o si no consigo un usuario, enviaré error. Por lo que vamos a hacer ese
usuario de retorno o estado de punto de respuesta para 100 puntos final. Y luego diremos que el usuario no encontró. De lo contrario, enviaré en la respuesta que se encuentre al usuario. Y será en el objeto de arena como usuario. Probemos eso para asegurarnos de que esto está funcionando. Entonces aquí necesito una solicitud de post, elimino esto, y aquí tendremos un login. Y entonces no necesitamos todo esto. Sólo necesitamos el correo electrónico, como dijimos, y la contraseña del usuario. Entonces aquí tendré contraseña. Por ejemplo, digamos 1, 2, 3, 4, envíalo. Y entonces vamos a conseguir que este usuario realmente exista con este e-mail. Cometamos error en el correo electrónico. Usted hace dos, por ejemplo, voy a conseguir el usuario no encontrado. Entonces ahora estamos en el camino correcto. Por lo que encontramos al usuario al que queremos iniciar sesión. Para iniciar sesión a un usuario, necesitamos comparar la contraseña que
ingresó y con la contraseña que ya existe en la base de datos. Pero ya tenemos una contraseña hashed. Por lo que necesitamos de alguna manera descontento o decodificar esta contraseña y luego compararla con la contraseña que envió el usuario. Y entonces digo, está bien, tienes razón, estás autenticado. Entonces después de estar seguro de que tengo un usuario en mi base de datos con ese email, quiero comprobar que si hay usuario que tenemos antes y descifrar Con compare cantar, no
puedo comparar dos contraseñas con el hash. Por lo que diré esa petición dot body dot password, que es enviada por el usuario y luego compararla con el hash de contraseña de punto de usuario, como el usuario, que encontré con su hash de contraseña. Entonces si este éxito de compresión, diré, por ejemplo, enviado al backend o al front end. Diremos, por ejemplo, estado de punto de
respuesta, por ejemplo, a un usuario de envío de 100 puntos. De lo contrario. Eliminamos esta parte. Y decimos, por ejemplo, con 400 y decimos que la contraseña está mal. Probemos eso. Y aquí, por ejemplo, tengo esta contraseña, nombre de usuario. Yo diría que la contraseña está mal, pero ¿recuerdas que tenemos la contraseña de esta manera de una a seis y el usuario se autenticó. Entonces cuando la contraseña es incorrecta, obtenemos la contraseña es incorrecta. Entonces ahora llegamos a la parte importante. Por lo que vimos antes que el servidor responderá con token web JSON. Entonces desde donde obtendré token web JSON en el back-end. En Node.JS, hay una biblioteca llamada JSON Web Token. Por lo que necesitamos instalar esta biblioteca. Entonces voy a la otra ventana que tenía cuatro para la instalación, diría npm I. Y luego JSON Web Token. Instalar esta biblioteca me dará la capacidad de utilizar JSON Web Tokens. Entonces vamos a tenerlo en nuestras constantes o importaciones podemos decir, vale, universidad AVT requiere JSON web token. Por lo que puedo usar esta variable ahora o constante para generar el JSON Web Token. ¿ Cómo hacer eso? Entonces cuando el usuario está autenticado y todo va bien. Entonces diré const token. Y luego usaría esta biblioteca JSON Web Token, ese signo hay un método ahí. Y este método aceptando el objeto, objeto con una carga útil y secreto, que es secreto o clave privada. Hablaremos del secreto. Entonces este JVP, esos letreros como vimos
antes, está pidiendo objeto. Y este objeto tendrá, por ejemplo, no se puede pasar nada. Puedo decir, por ejemplo, ID de usuario. Y el ID de usuario tendrá, por ejemplo, ID de punto de
usuario, el usuario que llegué aquí, y con su ID. Por lo que aquí puedes pasar los datos que quieras con el token. Veremos cómo resolver el token en el front end. Y también cómo podemos comparar el token en la API de autenticación. Y aquí en el segundo parámetro, necesitamos pasar un secreto. Secret es algo así como, por ejemplo, una contraseña que se usa para crear tus tokens. Por lo que puede ser cualquier cadena. Por ejemplo, diré, por ejemplo, cigarrillo. Y después de eso hay opciones. Y en estas opciones, podemos agregar algunas opciones al token, como fecha de caducidad, que veremos más adelante. Y en su solicitud enviando succes, enviaremos al usuario con su token. Por lo que diré enviar usuario y usuario, por ejemplo, correo electrónico que envíe sólo el correo electrónico y el token. Por lo que de esta manera, el usuario obtendrá el token en el front-end y podrá usarlo para acceder a la API. Vamos a probar eso. Entonces voy a Cartero. Voy a utilizar iniciar sesión. De nuevo, tenemos la contraseña equivocada. Pongamos la contraseña correcta. Y luego me dieron el e-mail y un token. Entonces esta ficha es creada por el secreto que tenemos aquí. Para que puedas hacer lo que quieras. Y este secreto, nadie lo sabe. Por lo que no puede nadie crear un token como con los mismos tokens que se utilizan en tu tienda online. Entonces en este caso, ningún usuario envía con la API, por ejemplo, cualquier token, y entonces tendrá la respuesta, respuesta
correcta porque no tiene el Secreto. Veremos cómo resolver el token con el secreto que
creamos para que el usuario pueda obtener la respuesta correcta. Entonces si recuerdas, tenemos aquí las variables de entorno. Entonces aquí podemos poner nuestro secreto. Por ejemplo, puedo decir aquí secreto. Mi perro es agradable. Entonces digo aquí secreto. Y lo usaremos aquí. Diremos constante. Y entonces digamos que secreto es proceso punto variables de entorno, punto secreto, que creé aquí. Entonces pasemos este secreto en lugar de la cuerda codificada. Volvamos a revisar de nuevo para asegurarnos de que todo está funcionando bien. Entonces conseguimos un nuevo doc. Por lo que a veces ves que cuando estás bloqueado en un sitio web al día siguiente, automáticamente estás desconectado. Esto sucede porque este token se ha caducado. Por lo que el servidor tiene algún tiempo de caducidad. Entonces cuando intentes usar este token, de nuevo, el servidor te responderá,
lo siento, este token está caducado. ¿ Cómo establecer el tiempo de caducidad? El tercer parámetro de este sinusoide, tiene opciones. Y estas opciones pueden ser una de ellas. Por ejemplo, caducar en, caducar en, puede especificar un día, una semana, un mes. Yo quiero un día. Digo una d. Si quiero una semana, digo 1 w. Así que normalmente, veamos, por ejemplo, para nuestra tienda web, tenemos el token para un día. Cuando vengo de nuevo después de un día para usar cualquier API y estoy cargando el token caducado, entonces el servidor dirá, lo siento, no
puedes usar esta API porque ha caducado. Vamos a guardarlo. Y veremos en la próxima conferencia cómo proteger nuestras API. Por lo que el usuario no puede usar ningún IPI solo si tiene un token.
38. Protecting la API y la autenticación JWT Middleware: Vimos antes cómo el usuario ahora tiene el token. Ahora puede usarlo para acceder a los datos o a nuestras API, pero cómo podemos hacer que nuestro servidor esté protegido. Por lo que nadie puede usar la API sin un token. Como vimos antes en nuestro app.js, teníamos un middleware. Y el middleware está revisando todo, yendo al servidor antes de que se ejecute. Entonces aquí en este punto, quiero comprobar si el usuario está autenticado o no. El secuenciamiento. Para hacer eso, normalmente, creo en mi, por ejemplo, quiero crear alguna carpeta auxiliar. Y en carpeta ayudantes, crearé un nuevo archivo, llámalo por ejemplo, GBT dot js. Y hay y hay una biblioteca llamada Express JWT, que se utiliza normalmente para asegurar las API en nuestro servidor. Entonces vamos a instalar esta biblioteca, MPM express JWT. Y vamos a pedirlo. Por lo que diré constante expreso JWT. Y entonces requerirá de JWT express. Y la función de protección será como la siguiente. Por lo que voy a crear una función, llamarla Autenticación o nuestro JWT. Y este método devolverá DWT expresado como una función. Y esta función, tiene opciones. Hablamos antes del secreto. El secreto se basa en alguna cadena donde podemos crear nuestro token. Entonces cuando alguien pasa cualquier token a nuestro, por ejemplo, backend, necesitamos compararlo con el cigarrillo. Entonces si el token se genera en base a ese secreto, entonces tendrá acceso a la API. Pero cuando su token basado en secreto diferente, entonces la API no funcionará. Y como recuerdan, hemos importado este secreto o lo hemos puesto en las variables de entorno. Entonces aquí volveré a decir const secret y luego procesar el medio ambiente dot secret. Otra opción que necesitamos pasar también es el algoritmo está generando este token. Si vamos a la página web de JWT io, veremos que el token se puede generar en base a muchos algoritmos. Éstos son los más utilizados. Por ejemplo, estoy usando HS 256, que también biblioteca JSON Web Token está usando. Entonces podemos tener, por ejemplo, algoritmos es array HS 256. Ahora exploramos este método con el módulo, así que decimos modulo dot exportaciones es nuestro JWT. Por lo que de esta manera podremos usarlo en nuestro app.js. Entonces aquí voy a decir arriba, no usar nuestro JWT
proveniente de constante de DWT, que se requiere. Ayudantes JWT. Por lo que ahora se usa el middleware. Ahora nuestro servidor está asegurado en base al token. Entonces cualquier solicitud que
vengamos, se nos pedirá autenticación JWT. Y luego vamos aquí o expresamos JWT donde giró para nosotros. Si es posible que el usuario pueda usar esta API o no en base a su token. Entonces vamos a comprobar ahora si nuestra API está protegida o no. Por lo que pediré un get de lista de productos. Yo voy aquí, envío esa solicitud y luego veo ese error no autorizado. Por lo que no se encontró ninguna ficha de autorización. Express JWT me devolvió este error. Por lo que necesito de alguna manera manejar este error y enviado al usuario que requirió datos. Pero primero, cómo podemos agregar un token a la solicitud. Normalmente agregando un token con una solicitud vienen con autorización en Cartero. Y también en el front end, necesitas usar, por ejemplo, un token al portador. Y ficha al portador. Tendremos que pasar el token por el que obtuviste después de iniciar sesión con el usuario. Aquí hay diferentes tipos de autenticación que usaremos, la más grande. Entonces antes teníamos también aquí el token después de que nos encerramos con un usuario de Thomas. Y aquí pasaremos esta ficha. Por lo que la autorización aquí que viene para esta API cargada con este token. Por lo que después de enviar la solicitud, llegaré ahí i datos. Si elimino ese token, no lo haré. No tengo ninguna autorización al frente y veremos cómo cargar token sobre la solicitud en los encabezados. Entonces ahora estamos seguros de que nuestro token está funcionando. Entonces hagamos un cambio aquí. Hacer error. Veremos que en el error autorizado, token inválido. Por lo que aquí tenemos diferentes errores. Por lo que necesitamos manejar este error de alguna manera. Eso veremos en la próxima conferencia.
39. Handing de errores de autenticación: Vimos previamente que obtuvimos algunos errores en nuestra API. Por lo que necesitamos manejar esos errores para que se muestren manera más bella para el usuario o el front-end. error de manejo en RGS se puede hacer simplemente de esta manera. Vamos al middleware y decimos AP US. Y creamos una función que contendría error como respuesta de solicitud de devolución de llamada. Y a continuación, en este caso, este método se ejecutará cada vez que haya un error en nuestra API. Por lo que aquí puedes comprobar si hay error. Entonces puedes ascender, por ejemplo, response.status. Al igual que por ejemplo, digamos 500 y el JSON. Y en este JSON USA por ejemplo, un mensaje y este mensaje diciendo error en el servidor. Por lo que cualquier error puede ocurrir en el back-end se llamará con este mensaje. Probemos eso con el error que obtuvimos con autorización. Por lo que cometeré un error aquí en este token. Entonces veremos aquí que obtuvimos error en el servidor porque tenemos un problema en el token, pero no sabemos cuál es el error exactamente. Por lo que podemos clasificar estos errores en función del tipo. Porque si imprimimos este error de alguna manera, digamos en lugar del mensaje, el sprint ,
este error, un error aquí y luego intentarlo, veremos que el error tiene nombre. Con base en el nombre. A lo mejor puedo clasificar los errores o podemos mantenerlo así. Depende de ti, pero podemos hacerlo más hermoso de la forma actual. Pero primero, para tener un app.js limpio, Vamos a mover este método a nuestros ayudantes. Entonces vamos a crear archivo aquí, llámalo manejador de errores a JS. Y creamos una función, lo
llamamos manejador de errores. Y tendrá los mismos parámetros, error, solicitud, respuesta, y siguiente. Y entonces podemos manejar lo que tenemos aquí. Entonces podemos tomar esto si lo pegamos aquí. Y de esta manera, podemos mantenernos al día J lo más limpio posible. Entonces aquí tenemos que decir manejador de errores. Y manejador de errores es constante. Se requiere error y aprender de los ayudantes y manejador de errores. Por lo que en base al tipo o el nombre del error, podemos clasificar nuestros errores. Por ejemplo, digamos si error nombre de punto, vimos previamente que tenemos un nombre, un error autorizado. Por lo que regresaré aquí estado 401, y el error será como un mensaje. Podemos decir que el mensaje es, por ejemplo, el usuario no lo es. Como veremos también en el futuro, tendremos tipo de los errores que se denomina error de validación. Ya veremos eso más adelante cuando vayamos a subir fotos. O decimos error nombre de punto será, por ejemplo, error de validación. Entonces la respuesta será la misma que ésta. Pero por ejemplo, vamos a ser suficientes. Ahora con el solo error, cambiaremos este mensaje cuando hagamos la subida de las imágenes y los archivos. Y para errores generales, es mejor manejar eso también. Por lo que aquí hemos devuelto estado de punto de respuesta. Y cuando hay algún general, podemos decir que es un error de servidor, así que son 500. Y luego en el JSON, envío el mensaje como error. O bien puede enviar el error directamente sin un mensaje. Aquí, nos pondremos de vuelta y regresaremos aquí también. Por lo que ahora tenemos un manejador de errores para nuestra autorización y validación. Entonces ahora en el front end, cuando hago alguna sincronización no autorizada. Entonces cuando pido una API sin ningún token, entonces obtendré este error. Y si lo hago, Por ejemplo, subo un PDF y no se me permite subir un PDF a nuestro Thurber, así que obtendré el error de validación. Y también si aquí no hay error clasificado, entonces obtendremos el error en general como mensaje en el JSON. Es agradable tener algunos comentarios siempre en el código. Por lo que puedes jugar algunos comentarios para explicar qué tipo de error es este.
40. Eliminar las rutas de las API REST de la autenticación: Bienvenido de nuevo. Ahora tenemos una API totalmente segura, por lo que nadie puede usarla sin autenticación. Por lo que en este caso, el usuario, cuando quiso mirar dentro, debe estar autorizado. Entonces esto no es lógico para nosotros. Por lo que el usuario puede ser capaz de usar un login para obtener un token. Entonces en este caso, necesitamos excluir de alguna manera esta API de para ser autenticada. Entonces aquí en Express JWT, no
puedo decir a menos. Y en esto a menos que tenga objeto donde pueda localizar empático es todo el API que quiero excluir. Por ejemplo, excluyamos el inicio de sesión. Haz eso. Necesito especificar todas las API que quiero que sean excluidas. Por lo que puedo decir aquí, api slash, v1 slash usuarios y login. Por lo que quiero que este sea ejecutado. Probemos que ahora es Cartero. Y aún no estamos autorizados. Esto se debe a que necesito agregar otra tira aquí. Entonces vamos de nuevo a Cartero. Lo intentamos y tenemos el token de nuevo. Por lo que hay que tener cuidado de que hay que tener el listón aquí. Por lo que también podemos agregar el padrón. Ya agregué que sólo la API, que es exactamente igual que la publicación. Entonces aquí en los usuarios, tengo el registro de puestos, que es exactamente lo mismo que post. Por lo que el usuario también puede registrar una cuenta en la tienda online. Y aquí se usa para el administrador que quiere eliminar o agregar usuarios. ¿ Qué pasa con los productos? Productos Además, necesito de alguna manera obtener el producto de forma gratuita sin autenticación. Por lo que no necesito que el usuario sea autenticado para obtener el producto, porque no quiero que la gente inicie sesión. Entonces podrán ver mi tienda web. Los necesito para obtener la lista de productos sin ninguna autenticación. Entonces cómo podemos hacer eso, necesitamos especificar el método, el método HTTP. Por lo que puedo decir imprimirme solo que GET solicita, pero no permitas post. De lo contrario la gente podrá publicar productos en mi tienda web. Entonces para hacer eso, este método de ruta aceptando Un objeto y este objeto tiene un primer campo como URL. Y segundo campo son los métodos. Y URL, puedo especificar la URL como la tenemos aquí. Pero en lugar de eso, usaré productos. Y los métodos serán conseguir, por ejemplo, y opciones. Y esos serán una matriz. Entonces vemos aquí especificamos la URL de la API, y luego especificamos los métodos. Probemos eso. Iré aquí a obtener lista de productos. Sin autenticación. Funciona perfecto. Y cuando quite eso, no va a funcionar. Por lo que es mejor tenerlo así para que el usuario pueda obtener la lista de productos en el front-end. Yo refactoricé aquí el código, por lo que se ve más hermoso. Entonces aquí tenemos la variable API, que es que la obtenemos de la variable de entorno. Y aquí estoy usando backticks para inyectar la variable dentro de la fuerza. Pero ahora tenemos un tema. ¿ Te acuerdas? Teníamos antes en las API para productos, creamos métodos como por ejemplo, obtener destacados y obtener destacados. Necesitábamos también ser públicos porque quiero mostrar el producto de características en mi front-end sin autenticación de usuario. Entonces aquí, si quiero probarlo, voy a Cartero publicado aquí y digo tres productos destacados. No voy a estar autorizado. En este caso, necesitamos especificar también esta URL aquí. Pero entonces tendremos muy larga lista de API, sobre todo para el momento en que tengamos tienda web muy grande. Porque necesitamos muchas API. No sólo diciendo, por ejemplo, dame el producto de la función o dame el recuento de productos. Entonces lo bonito aquí que puedo usar cadena STD así, puedo usar expresiones regulares. Las expresiones regulares me están dando la capacidad de especificar todo después de los productos, por ejemplo. Entonces aquí con esta cadena, puedo poder usar esta. Entonces porque aquí tenemos tengo esta estrella. Entonces cualquier cosa después de los productos funciona. Entonces ahora después construí mis rechazos, así que aquí digo API slash, v1 slash productos. Aquí se escapa de slash. Por lo que no va a hacer ningún conflicto con el listón que tenemos que definir. Este tema trata de expresiones regulares. Por lo que necesitas saber más sobre estas expresiones regulares. Estoy usando probador siempre rechaza, que siempre se encuentra en línea. Esa es una hermosa página web llamada regex 101. Y aquí puedes probar tus expresiones regulares. Entonces aquí me llevaré éste y lo probaré en ese sitio web. Entonces digo aquí, algo así se va a permitir, Pero si cometí un error aquí, entonces no se permitirá. Entonces es exactamente esta fórmula. Entonces aquí es mejor usar expresiones siempre regulares para especificar más las API y tener menos código. Entonces probémoslo ahora. Y tenemos nuestros productos destacados. Hagamos también lo mismo, cuatro categorías. Por lo que tenemos aquí 1 y categorías. Para que podamos conseguirlos. Y por ejemplo, no podemos hacer comerlos ni publicarlos. Entonces en el futuro, cuando agrego más API, necesitamos agregar algunas exclusiones aquí, siempre en esta matriz de ruta.
41. Añade más información de usuario en toto: Vimos antes cuando teníamos un login que no podemos especificar algunos datos dentro de esa respuesta o dentro del token. En este caso, también puedo pasar algunos datos secretos, que quiero ser solo viene con el token. Entonces si el usuario no tiene esta información en el token, no le permitiré que haga algo. Una de las informaciones secretas que puedo pasar aquí es admin. Así es admin, puedo decir que este usuario es admin en la tienda online o no. Entonces en este caso, puedo permitirle que busque en el panel de administración de la tienda web o no. Por lo que el usuario normal no puede iniciar sesión, pero el administrador, que tiene admin, cierto, siguió buscando. Y por supuesto, en este caso, es mejor separar las tablas. Por lo que puedo tener usuarios y clientes, por ejemplo, o usuarios y admins. Por lo que esto lo veremos en la próxima conferencia con más detalle. Ahora tenemos el usuario y luego comprobaré usuario es admin. Entonces en este campo, en este token, puedo enviar al usuario si es administrador o no. A lo mejor me dirás por qué no puedes hacer eso en el front end, como comprobar si el usuario es administrador o no. En este caso, el usuario podrá, por ejemplo, algún hacker que tenga experiencia en programación, podrá desde front-end para iniciar sesión al panel de administración. Ni siquiera él tiene esta habilidad. Simplemente puede crear un dato falso que es administrador. Y luego se puede poner como en el JSON es admin es cierto. Y entonces puede mirar adentro. Y este caso, no es bueno en nuestra tienda online, así que es mejor tenerlo asegurado aquí. Entonces si el usuario no tiene ese yo token, que tiene es admin, entonces no podrá buscar en el panel de administración. Probemos eso y veamos nuestro token si está validado, correcto, iré a Cartero y presionaré Enviar. Eso es bueno. Tenemos ahora el token. Por lo que comprobamos este token en DWT dot io. Ve aquí, pruébalo. Diré también este admin y tiempo de caducidad. Entonces en este caso, la persona no puede construir una ficha así porque no, no tiene el secreto. Y si recuerdas, siempre la API está comprobando este token. Si se construyó con ese cigarrillo, que especificamos en nuestro backend.
42. Usuarios y administradores: Como vimos antes, que excluimos algunas solicitudes de API para no ser autenticadas. Por ejemplo, aquí los productos como Git y opciones no deben autenticarse porque estarán en público. Para que cualquier usuario público pueda navegar por los productos en mi e-shop. Por lo que el usuario de inicio de sesión que
encerró en la tienda electrónica, puede publicar productos o actualizar a productos, productos de élite. Pero en nuestro caso ahora los usuarios, nuestros clientes. Entonces si soy cliente y me metí en el tema, entonces en este caso, podré eliminar productos. Y en los primeros segundos que publique este sitio web en línea, se va a destruir. Si recuerdas, creamos en el modelo un campo que dice es admin. Por lo que aquí especificamos al usuario si es administrador o no. En nuestro e-sharp, tendremos también panel de administración. Y este panel de administración no está permitido que los usuarios normales ingresen solo a los admins. Por lo que tenemos aquí en la tabla de usuarios, algunos roles de usuario. Tenemos un cliente y tenemos admin, y ambos están en la tabla de usuarios. Tienes libertad aquí para hacer, por ejemplo, tablas separadas en este caso. Pero aquí quería mencionar los roles de usuario. Por lo que también puedes hacerlos en una misma tabla pero con diferentes roles. Hay muchas formas de hacer roles de usuario en Node.JS, pero voy con la forma más sencilla que necesitamos para nuestra e-shop. Si recuerdas, después de que el usuario consiguió iniciar sesión en la aplicación, se le
asignó un token. Y este token está sobrecargado con ID de usuario y es admin. Y aquí sabemos dentro del token si el usuario es admin o no. Y cuando el usuario envía una solicitud, la biblioteca JWT está desensamblando este token con el código secreto que se proporciona en nuestra API o en nuestro servidor. Y verá que si realmente se genera a partir de este servidor o no. Por lo que podemos identificar al usuario si tiene token de nuestra e-shop o no. Hasta ahora todo está bien. Entonces supongamos que tengo una ficha correcta. Y también quiero buscar en mi trabajo como administrador. Dejar de esta manera nos mantendrá no seguros porque el usuario, en este caso es capaz de eliminar o agregar productos. Por lo que el JWT express tiene un gran método que está revisando, por ejemplo, o revocando el token bajo algunas condiciones específicas. Para ello, hay un campo se revoca, y esto se revoca es una función. Por lo que también podemos, en la devolución de llamada, podemos especificar si el usuario es administrador o no. Por lo que creo aquí, por ejemplo, se revoca
otro método. Y esto se revoque será una función, función asíncrona. Y tendrá solicitud, carga útil. Y Don. ¿ Cuáles son esos parámetros? Solicitud es cuando quiero usar los parámetros de solicitud o el cuerpo de solicitud, quiero saber algo lo que está enviando al usuario. El carga útil contiene los datos que están dentro del token. Por ejemplo, quiero obtener es admin desde el token que está firmado con el usuario. Y este usuario me lo está enviando con los encabezados de solicitud. Entonces aquí en este caso, puedo decir si no el punto de carga útil es admin. Porque ahora tengo acceso a esto, es admin a la carga útil de ese token. Entonces voy a volver que hecho es nulo y verdadero. Entonces en este caso, estamos diciendo que rechaza el token. Entonces si alguna API autorizada llamó y nuestro usuario no es admin, entonces será rechazada. Y de lo contrario, si es administrador, podemos decir que hecho sin ningún parámetro. Como dijimos antes, sólo
tenemos dos tipos de usuario en nuestro número. Por lo que tenemos admin y usuarios. Si tienes más roles, puedes escuchar, clasificarlos. Y aquí se define lo que está en evocado o lo que se permite. Ahora, intentemos eso con cartero. Si recuerdas, aquí tenemos un usuario, Thomas Jackson, que no es administrador en la tienda. Y estos son sus datos. Entonces vemos aquí que es admin es falso. Y cuando traté de publicar un producto en nuestra API y nuevo producto, conseguiré que el usuario no esté autorizado. Cambiemos el token para estar con admin a través. Bueno, vayamos a la base de datos manualmente y cambiemos a este usuario para que sea administrador. Por lo que voy a decir aquí admin a través y luego hago clic en actualizar. Si trato ahora de usar enviar, también
me voy a quedar no autorizado. ¿ Por qué? Porque estoy usando el token con el que se carga es admin false. Por lo que necesitamos volver a mirar para conseguir un nuevo token. Por lo que voy a la API de inicio de sesión, tengo el usuario y la contraseña. Yo envío esa solicitud, me dieron una nueva ficha. Y usémoslo en nuestras solicitudes de post. Sobre la autorización. Yo juego, lo
sustituyo aquí y lo intento de nuevo. Y se ha publicado con éxito el producto gracias a expresar JWT que tiene este método. Por lo que fue capaz y nos hizo capaces de hacer, por ejemplo, este rol de usuario. Ahora nuestra aplicación es totalmente segura y nadie puede
usarla ni acceder a ella sin ninguna autorización ni ningún rol de administrador.
43. Obtener el Count de usuario REST API: En ocasiones el administrador del taller quiere saber cuántos usuarios o clientes tiene en su taller. Entonces en este caso, necesita una API para conseguir el recuento de usuarios. Eso lo hicimos previamente con los productos. Teníamos una API, sobre todo por conseguir cuántos productos tenemos en nuestro número. Entonces vamos a copiarlo e ir a la API del usuario. Después de iniciar sesión y registrarse, podemos usarlo aquí. Y decimos lo mismo getCount, pero usuario. Y aquí decimos cuenta de usuarios. Si no cuenta de usuarios, entonces devuelve 500 y luego tu devolución para mí cuenta de usuarios. Entonces salvemos intentó a su Cartero. Vamos por ejemplo, aquí, digo usuarios y obtenemos conteo. Pruébalo. Tenemos un error porque estoy haciendo un post. Necesitamos hacer un GET. Lo intentamos de nuevo. Tenemos cuenta de usuarios para, realmente
tenemos cuatro usuarios. No hicimos también una solicitud de eliminación. Entonces, también lo copiemos de, por ejemplo, las categorías o productos. Podemos hacerlo desde aquí y conseguir éste. Y luego ponemos una solicitud de eliminación y sustituyo usuario, usuario. Y todo lo demás es usuario. Entonces como ven aquí, es exactamente igual como lo hicimos con los productos. Lo guardamos, y ahora estamos totalmente terminados con los usuarios. Estoy tan contenta de que termines este módulo y verás el código donde llegamos en la carpeta de recursos. Para que puedas descargarlo y luego probar cosas, cambiar cosas, probarlo tú mismo e intentar comparar tu código con el código que subí.
44. Órdenes: Bienvenido a una nueva sección. En este apartado se relaciona totalmente con los pedidos. Por lo que hemos creado sus productos y también los usuarios. Y ahora vamos a construir las órdenes. Al igual que cada e-shop, el usuario va a tener una llena su tarjeta y luego va a revisar para enviar un pedido. Este pedido vendrá con la dirección de la persona y también las opciones de envío y cómo pagará este pedido. Y veremos también después de que el usuario se haya conectado, cómo obtendríamos también los datos del usuario y llenaríamos los datos del pedido automáticamente. Entonces sin dejar que el usuario vuelva a sentir la dirección de facturación. Por lo que vamos a dejar que los datos provengan de la información del usuario que creamos antes. Y también en este apartado, veremos cómo vincular el producto con el pedido. Por lo que veremos que el pedido contiene muchos productos. Por lo que a veces
añado, por ejemplo, camiseta y pantalón. Por lo que veremos cómo vincular el pedido con los productos. Y en el back-end o en el back office donde el administrador puede iniciar sesión y controlar los pedidos. Veremos cómo podremos cambiar el estado del orden. Por lo que será de entregado o por ejemplo, enviado, o incluso está en espera o cancelado. Por lo que aquí todo estará relacionado totalmente con el backend. No vamos a trabajar en el front end. Por lo que vamos a trabajar con Cartero. Estudiante puede entender cómo funciona este backend aislado del front end. Espero que disfruten de esta sección. Esta sección, como les dije, no
está repitiendo las secciones anteriores. No tiene cosas nuevas. Cómo vincularemos los productos como array de artículos de pedido y también lo vincularemos a la orden se prepara. Y empecemos.
45. Orders y los artículos de la orden modelo y el esquema: Bienvenido de nuevo. Ahora vamos a implementar el esquema de pedidos y pedir el esquema de artículos. Previamente, implementamos la base de datos o planeamos la base de datos en base a lo que necesitamos para la e-shop. Como ves a la derecha de la pantalla, tenemos la tabla ya de pedidos y artículos de pedido. Al igual que en la base de datos relacional, vemos la conexión entre el orden y los artículos del pedido. Empecemos primero con los pedidos, como vimos antes, con los productos y la relación con las categorías. También habíamos implementado que la categoría tiene un tipo de ID de objeto y la referencia es a tabla de categorías. Entonces hagamos lo mismo entre el pedido y el artículo de pedido. Por lo que copiaré esta parte. Iré a la orden y pondré aquí artículos de pedido. Y aquí tendremos el ID de objeto y la tabla de artículo de pedido y requerido sí, a través. Pero la diferencia aquí de que tenemos tal vez múltiples artículos de pedido, no sólo uno. Entonces en Mangoose podemos implementar eso alineando esto dentro de una matriz. Por lo que en este caso, necesitamos pasar o tener la matriz
de elementos de pedido de ID de artículos de pedido que están existentes en la base de datos. Por lo que en este caso, necesitamos crear tabla de artículos de pedido. Entonces vamos a tener un archivo aquí. Llámalo orden ítem dot js. Y tendrá el mismo esquema, Mangosta toda esta información. El asunto aquí vamos a tener artículo y aquí están los artículos que no tenemos esto. Tendremos cantidad, que es tipo número. Y se requiere. Sí, cierto. Y como vemos también que tenemos un producto. Por lo que necesitamos vincular este artículo de pedido al producto. Por lo que voy a decir aquí que voy a tener ID o tipo de ID de objeto. Tipos de esquema de mangosta que objeto ID. Y eso es referencia de este artículo de pedido será producto. Y vamos a exportar como artículo de pedido y tenerlo como artículo de pedido. Y aquí hemos ordenado esquema de ítem. Por lo que nuestro artículo de pedido está listo, el cual hemos importado aquí. Y nos referenciamos con ID de objeto en tabla de orden. Entonces la cosa aquí que tenemos muchas relaciones. Por lo que el pedido se refiere a todos los demás artículos y el artículo del pedido es relativo o se refiere al producto. Por lo que en mi solicitud, cuando pida un pedido, obtendré todos los demás artículos incluyendo sus productos y poblaré estos productos. Por ejemplo, necesito el nombre y la categoría también. Aquí agregué rápidamente los otros campos que necesitamos, la dirección de envío, 12, ciudad, código postal, país, estado
telefónico, que diremos que un valor predeterminado anexando. Entonces, cuando la persona presente una orden, entonces estará pendiente el valor por defecto o el primer estado de la orden. Y aquí tenemos también el precio total. Cómo veremos que lo calcularíamos internamente cuando creemos la orden. Y aquí, otra referencia con ID de objeto a la tabla de usuarios. Sabemos qué usuario o su desorden y la fecha ordenada entonces aquí, que el usuario no tiene que enviarlo al back-end. Se creará automáticamente con el punto ahora. Por lo que creará la hora en la que se envíe la solicitud de post. Y como recuerdas antes, teníamos aquí alguna ID virtual. Por lo que para no tener este ID de subrayado, podemos tener también ID normal. Vamos a copiarlo también y tenerlo de la misma manera. Entonces aquí dije esquema de orden, crea para mí un campo de ID virtual en lugar de ID de subrayado. Por lo que ahora estamos listos para trabajar con estas mesas. Por ejemplo, aquí tenemos orden y orden ítem, por lo que se logra esa relación entre estas dos tablas. Y ahora estamos listos para crear nuestra API con pedidos.
46. Array de reflejos Ejemplo de la orden de pedir los artículos a productos: Por lo que el orden está vinculado a los elementos de orden por matriz. Entonces veamos y leamos ejemplo cómo el front end enviará estos datos al back-end que creé aquí y objeto de, por ejemplo, cómo el usuario enviará los datos al back-end. Entonces, en primer lugar, imaginemos que el usuario tiene un carrito y seleccionó dos productos, producto 1 y el producto 2. Y tienen diferentes identificaciones. Por lo que los artículos de pedido serán array de dos productos, y cada producto tendrá una cantidad. Entonces de esta manera, tengo matriz de artículo de pedido o su artículo tiene una cantidad y el producto. Y el resto será igual. Excepto aquí veremos que el usuario enviará el nombre de usuario, pero enviamos el ID de usuario creando el pedido. Aquí lo mismo. No enviamos el nombre de su producto, pero enviamos el ID del producto. Por lo que así es como se vincula el ID del producto
al artículo del pedido y cómo se vinculan los artículos del pedido al pedido.
47. Nuevo orden y crea elementos de orden para publicar artículos de nueva orden: Colocar un pedido en nuestra base de datos se requieren datos del usuario. Como vimos antes, tenemos estos datos JSON donde usuarios después de hacer la caja, él colocará el pedido en nuestra base de datos. Entonces lo que necesitamos primero para crear una solicitud de post en pedidos API, ya
tenemos una solicitud GET. Tenemos que crear ahora una solicitud de post para no repetir el mismo proceso que hacíamos antes. Copiemos la solicitud de post más simple que creamos en categorías. Y vamos aquí dos categorías, publicamos solicitud y lo copiamos, y lo pegamos en nuestros pedidos. Entonces lo que se requiere de nosotros, necesitamos crear un modelo de orden y los campos del orden que éramos, teníamos antes y creamos el esquema. Entonces supongamos el caso más simple ya que el usuario enviará esos datos. Entonces aquí obtenemos los datos. Los pego rápidamente para no repetir el mismo proceso. Por lo que tenemos del usuario los artículos de pedido todos vienen con el cuerpo de la solicitud, que es éste de aquí. Por lo que tenemos todos los demás elementos y todos los datos que son enviados por el usuario desde el front end. Arreglemos esto aquí. Yo estoy enseñando cue de esa manera cómo llamarlo rápido, así que no tenemos que volver a escribir todo respecto al pedido porque, ya sabes, siempre tenemos post request, siempre
hemos delete request. Por lo que es mejor copiarlo de solicitud básica y cambiar el, por ejemplo, el nombre cosas a caber en nuestra nueva API. Por lo que aquí hemos pedido todo ahora orden y enviado de vuelta la orden creada. Pero si recuerdas, hemos creado tabla de artículos de pedido. Por lo que el usuario no sabe en el front-end que los elementos de orden que se almacenan en la base de datos. Por lo que aquí solo enviarás estos datos. Él quiere tres veces de este producto y dos veces de este producto. Pero para buscar estos datos y almacenarlos para el administrador, esto será como por ejemplo, podemos decir un obstáculo,
un pequeño obstáculo para volver a obtenerlos de la base de datos. Pero vamos a resolver eso con Mangoose durante esta relación entre artículos de orden y pedido. Por lo que cuando se envía o crea el usuario o la solicitud de correo, tenemos que crear los ítems de pedido primero en su base de datos y luego adjuntarlos o relacionarlos con la solicitud de orden que tenemos aquí. Y como vimos anteriormente, que ordenar artículos, es matriz de identificadores de la tabla de artículos de pedido. Entonces en este caso, necesitamos array de identificadores,
identificadores que están en la base de datos de esos artículos de nuestro pedido. Entonces primero, necesitamos crear esas identificaciones o cómo Mangoose las va a crear para mí. Y luego los guardaré con la orden o los relacionaré con esa orden. Entonces aquí, no vamos a obtener del usuario directamente el artículo de pedido que está conteniendo el producto y la cantidad saber, necesitamos sólo array de identificadores. Por lo que podemos decir pedidos de artículos ID. Y este ítem de pedido los identificadores vendrán de nuestros artículos de pedido creados en la base de datos, que haremos aquí. Por lo que tenemos esta constante const ID de artículo de pedido, que los obtendremos después de la creación del artículo de pedido en la base de datos. Por lo que necesitamos de alguna manera primero dos bucle dentro de los elementos de orden los cuales se envían desde el usuario. Por lo que voy a decir solicitud de cuerpo de
punto, elementos de orden de punto para bucle siempre usamos mapa porque sabemos que el usuario enviará array, array de elementos de orden. Y aquí tendremos o su artículo, un artículo de pedido. Y luego dentro de este artículo de pedido, creamos let new order item, new order item model. Por lo ordenado modelo de artículo. Necesitamos tenerlo de nuestros modelos o de su artículo. Es exactamente como estamos creando una nueva categoría o un nuevo producto, o es como una solicitud de post. Entonces digo aquí, o el ítem, ¿cuáles son los campos en el ítem de pedido? Contamos con cantidad y un producto. Entonces voy aquí, digo cantidad. Por lo que ya tenemos un elemento de pedido de la lista de los ítems de orden que ellos usuarios. Y así digo aquí, pide cantidad de punto artículo y también producto, que contendrá el ID del producto. Entonces desde el artículo de pedido punto-producto, entonces necesitamos guardar este artículo en la base de datos. Entonces digo let o el nuevo ítem de orden, la misma variable podemos usarlo. Esperar un nuevo artículo de pedido que creamos previamente o el modelo, y no seguro. Entonces aquí estamos guardando el artículo de pedido en la base de datos. Entonces cuando hacemos un bucle en los artículos de orden, por
lo que por cada elemento de pedido, lo
guardaré en la base de datos. Pero quiero que este mapa me devuelva sólo las identificaciones. Entonces aquí digo devolver no el nuevo artículo de pedido, sino el nuevo ítem de pedido ID de punto. Por lo que en este caso, obtendremos sólo los IDs en una matriz. Por lo que creamos los ID de pedido y los adjuntamos a la orden, y vamos a guardar el pedido. No lo guardemos ahora en la base de datos, solo
enviemos la orden se crea o el
modelo de orden al front-end al usuario después de que publique la solicitud. Entonces probemos eso con Cartero. Voy al cartero y lo sustituyo por pedidos basados en nuestra API, cómo lo creamos. Y entonces pondré aquí los datos. Primero revisemos el token de autenticación y luego el cuerpo, lo que tenemos este JSON por ejemplo, ya
estoy obteniendo estos ID de nuestra base de datos. Por lo que ya debemos tener estos identificadores en la base de datos. Enviemos la solicitud de post. Vemos que nos dieron un error. Viene el error, Veamos en la consola de nuestro servidor de prueba o de nuestro servidor, veremos que aquí tenemos un peso. Esto se debe a que tenemos aquí un peso, pero Esto requiere una función asíncrona. Quiero decir aquí. Entonces aquí tenemos un peso y esto requiere una función asíncrona. Entonces en este caso, no
podemos hacer esperar dentro de una función normal. Necesitamos colocar una función asíncrona básicamente es ésta. Por lo que diría aquí asincrónico y guardar e intentarlo de nuevo. Y veremos que se crea la solicitud o se enfría la orden, pero los elementos del pedido están vacíos. Hagamos un seguimiento de estos artículos de pedido para ver por qué no se crean. Para rastrearlos. Podemos hacer registro de consola de orden, artículos, IDs. Y veamos en la consola qué nos va a devolver. Por lo que aquí salvé. Y luego intentémoslo de nuevo. Comprobemos la consola. Veremos que hemos vuelto a las promesas. Por lo que no estamos regresando realmente el DNI, estamos regresando unas promesas. Esto porque tenemos aquí función asíncrona y esperamos, y estamos regresando con esperar una promesa. Entonces de alguna manera necesitamos resolver esas promesas. Debido a que el usuario está enviando matriz de artículos de pedido, no sólo uno. Entonces tenemos que combinar esas promesas juntas. Entonces aquí tenemos una matriz de promesas para combinarlas, uso promise dot all. Entonces aquí en este caso, tendré una promesa de retorno o una promesa, que se resolverá después de eso aquí, antes de que creemos el orden. Entonces tratemos de consolidar. Otra vez. Vemos que conseguimos una promesa, no a promesas como antes. Por lo que necesitamos resolver esta promesa. Cómo podemos resolverlo, podemos crear una nueva constante. Llámalo El ID de pedido es sólo o pedir artículos. Ids, por ejemplo, resueltos. Porque esto es una promesa. Entonces puedo decir aquí, uh, esperar a que esto se resuelva y luego imprimirme los para mí. Y luego sustituyo este ID de artículos de pedido por los identificadores de artículos de pedido resueltos. Vamos a intentarlo de nuevo. Eso es genial. Llegamos a ellos otra vez. Y en el registro de la consola, tenemos los dos ID que se crean de nuestros artículos de pedido. Comprobemos eso en la base de datos. Después de iniciar sesión, veo aquí orden artículos se crea la tabla. No creé que reserven atlas es muy inteligente. Entonces basado en el modelo que creé en mi base de datos o en mi código, es crear la tabla para mí. Entonces aquí si voy a pedir artículos, voy a ver para pedir artículos los cuales se crean en base al cartero y tienen el mismo ID que están en la base de datos. Por lo que ahora estamos listos para crear nuestro pedido. Entonces aquí no tenemos nada, así que no tenemos mesa de pedidos. Eso es porque comentamos este ahorro. Entonces aquí, después de que se cree o guarde la orden, entonces la reenviaré de nuevo. Quitemos este registro de consola para no tener nuestro registro lleno de datos innecesarios. Entonces aquí iré ahora al cartero. Hacer un pedido. Genial. Ahora hemos creado un pedido, y tenemos aquí, se crea
el nuevo ID de la orden. Por lo que si vuelvo a ir a Atlas, voy a refrescar. Y veremos que la tabla de pedidos se crea automáticamente porque tenemos modelo de pedidos. Entonces lo que le pedí a Mangoose que creara para mí este modelo de orden, entonces él creó la tabla. Entonces aquí tenemos otros artículos, ID de
objeto de los nuevos artículos de pedido que se crean de nuevo aquí. Por lo que cada vez que hago el pedido, creo un nuevo pedido artículos. En la próxima conferencia, veremos cómo obtener artículos de pedido o el pedido en sí de manera más detallada. Por lo que no vamos a obtener solo identificaciones, vamos a obtener más detallados. Veremos el artículo del pedido, lo que contiene, y también todo. Por ejemplo, qué usuario lo creó, no sólo IDs.
48. Obtenga detalles de pedido y rellenar productos en los elementos de orden y los datos del usuario: De acuerdo, ahora vamos a conseguir una lista de órdenes ya que ahora tenemos un pedido en la base de datos. Ya hemos creado una solicitud GET para una lista de pedidos. Entonces probémoslo ahora con un Cartero. Iré aquí, crearé lo mismo que post request, pero será un GET y la autorización porque siempre cuando crea una nueva API, debo tenerla autenticada. O excluimos esta API de la autenticación como vimos anteriormente. Por lo que ahora usaré este token get list ratones, tenemos lista de órdenes. Por lo que ahora sólo tenemos un pedido en la base de datos. Y lo estamos consiguiendo con la solicitud GET porque es una matriz. Vamos a poblar al usuario para que podamos ver los detalles del usuario dentro de esta solicitud. Porque por ejemplo, quiero ver en el panel de administración, en la tabla de órdenes, quiero ver a los usuarios que los ordenaron. Entonces aquí vamos en el código y sólo decimos punto poblar. Qué poblar al usuario. Guardar. Inténtalo de nuevo con Cartero. Obtenemos ahora el detalle del usuario, todo su detalle. Pero para mí como usuario o como administrador, no
necesito toda la información del usuario. Entonces sólo quiero, por ejemplo, su nombre. Para hacer eso. Acabamos de poner después de la población del usuario, ponemos los campos que queremos poblar. Entonces todo lo que tengo, por ejemplo, el nombre y en Cartero, cuando envío esa solicitud, me da sólo el nombre. Vamos a publicar otro pedido con un dato diferente. Por ejemplo, diré aquí en lugar de país, República
Checa, pondré a USA. Entonces aquí voy a ir allá y
decir, no uso un y un número diferente. Ejemplo, 1, 2, 3, 4, 5, 7. Por lo que aquí publicaré otra solicitud u otro pedido. Por lo que en este caso, voy a entrar ahí menos dos órdenes. Por lo que también podemos ordenar los pedidos por fecha. Entonces porque ya tenemos ese campo ordenado fecha, así que tenemos la fecha aquí por el punto. Ahora, también podemos ordenar esto por fecha. Para ello, Es muy sencillo. Simplemente voy aquí y después de la población del usuario, digo ordenar basado en la fecha de la columna ordenada. Entonces aquí tenemos, recuerdas una fecha ordenada. Y en base a esta columna, quiero ordenar mi salida. Entonces vamos aquí, Cartero, intentamos volver a conseguir la lista, y vemos que los conseguimos ordenados por fecha. Como pueden ver, el orden aquí es de más antiguo a más nuevo. Por lo que anteriormente tenemos este el 23 de diciembre en este momento. Y ahora tenemos éste. Por lo que podemos pedir de los más nuevos a los más antiguos. Y creo que esto que interesa al usuario para hacerlo. Simplemente alineamos esto en un objeto y luego decimos que este objeto igual a menos uno. Entonces cuando digo en el método de ordenación, este caso, entonces significa que ordenarlos de los más nuevos a los más antiguos. Entonces si me refresco y voy a Cartero de inmediato, y veremos que tenemos el 1 más nuevo primero y luego el más antiguo. Se puede consultar la documentación del método de ordenación. Tiene muchas características. Por lo que puedes utilizarlos para ordenar tus salidas en función algún campo específico o en algún orden específico. Ahora obtengamos un detalle de solicitud o un detalle de pedido. Entonces lo mismo está aquí. Publico o consigo esta solicitud pegada aquí. Y entonces en lugar de tener el tipo y población, tenemos hallazgo por identificación. Y aquí especificamos el DNI. Y el DNI se solicitará params de punto. Debido a que sus parámetros tomaron ID. Y nos renombraron esto para ordenar sólo en lugar de lista ordenada. Aquí tenemos orden, orden, orden. Voy ahora al front end y consigo, por ejemplo, este. Después de eso, pongo este DNI del pedido y envío esa solicitud. Y voy a conseguir sólo este orden con población del usuario. Llegamos ahora al punto importante. Tenemos aquí, los artículos de pedido sólo como IDs. Queremos ver los productos están dentro de estos artículos y la cantidad que, limpiemos un poco nuestro código. Entonces tenemos aquí poblar. Y también habremos enseñado poblado de otro campo que es artículos de orden. Eso lo probamos ahora. Veremos que conseguimos el producto y la cantidad. Pero y si también quiero poblar este producto de
una manera que veamos el detalle del producto dentro o los artículos. Entonces como vimos aquí, el usuario, nos dieron todos sus detalles. La diferencia aquí que tenemos array de ellos. Por lo que necesitamos saber cómo poblar el producto dentro de esta matriz de artículos de pedido. Para ello, tenemos aquí una forma diferente de poblar. Entonces, en lugar de hacer esto, el método poblado será un objeto que aceptará una ruta. Y aquí pongo artículo de pedido o pedido artículos. Y dentro de este objeto, digo también poblar para mí el campo, que se llama producto. Entonces lo pondré aquí y lo intentaré de nuevo. Ya veremos como una magia. Obtuvimos toda la información sobre los artículos del pedido. Y en nuestra base de datos, el orden se ve así. Entonces si actualizamos, tenemos nuestro pedido solo con ID y los artículos de pedido son solo ID. Entonces de esta manera, estamos manteniendo un tamaño pequeño los documentos de la base de datos, y estamos haciendo las relaciones usando la flexibilidad de Mangosta. Si vemos también aquí que el producto tiene la categoría y la categoría también es id Si quiero poblar también la categoría, no podemos hacer eso. No hay problema. Podemos decir también esto es poblado. Este es un camino que se llama producto y luego poblar categoría que está dentro de este producto. Entonces si vamos de nuevo, manda esta solicitud, veremos que la categoría también está poblada para todo el pedido. Entonces para hacerlo más limpio, no
podemos tener aquí este camino, así podemos entender la forma en que se construyó. Entonces aquí tengo decir aquí, éste. Ahora tengo el código limpio. Entonces esta es la forma de hacer población de la relación entre las tablas en la base de datos. Vemos en el futuro. Ahora cómo eliminamos estos pedidos y cómo actualizamos el estado de este orden, que será en la próxima conferencia.
49. Actualización de el estado de la orden REST API: Después de que hicimos la solicitud GET y post solicitud de pedido, Hagamos la solicitud de actualización como los requisitos de mi emisión arriba. El administrador de la A-Sharp sólo quiere cambiar el estado de la orden. Por lo que cuando algún cliente hace un pedido a la tienda electrónica, el dueño de la tienda quiere procesar este más viejo. Por lo que de esta manera, la orden será trasladada de flexión y luego a tramitar y luego por ejemplo, a turno y luego a estado entregado. Por lo que necesitamos sólo actualizar el estado de la orden. Vimos previamente cómo estamos actualizando, por ejemplo, el producto. Estábamos actualizando todos los campos para que el usuario o el front-end me manden de nuevo todos los campos. Pero aquí en las órdenes, sólo
necesitamos actualizar un campo, que es el estado, que es éste. Para hacer eso, hagámoslo rápidamente. Copiamos una de las solicitudes, por ejemplo, de las categorías. Conseguimos este. Lo copiamos a los pedidos. Ese puesto externo ID. Necesitamos el DNI. Y entonces diré aquí que tengo la orden. Aquí. Pido el modelo de pedido. Y aquí no pasamos nada, sólo el estatus. Por lo que el estado vendrá de requisito o solicitud de cuerpo de punto, estado de punto. De esa manera, si no hay un pedido asignado con este ID, entonces estoy enviando error. De lo contrario, estoy enviando de vuelta el pedido actualizado. Por supuesto puedes agregar todos los campos que quieras actualizar. Pero los requisitos para esta e-shop, solo
necesito actualizar el estado. Guardémoslo y probémoslo con cartero. Por lo que ya tenemos este orden, Vamos a actualizar. Entonces tendré una fila y el tipo de eso o es JSON. Por lo que aquí diré estatus será, por ejemplo, enviado. Por lo que puse aquí enviado. Y también tenemos que cambiar esta petición por poner. Y lo enviamos. Y obtuvimos el mismo orden que un turno. Entonces volvamos a conseguir la orden. Tenemos un llegar aquí, checa. Ya vemos el detalle del pedido y tenemos el estado del pedido será enviado. Eliminar la orden será la misma. Vamos a copiarlo también la orden Eliminar de la categoría. Y aquí vamos a agregar orden, encontrar por ID, y luego me va a devolver orden. Si hay o ahí, entonces regresa el verdadero éxito. De lo contrario enviar error o no encontrado nuestro algún error en el servidor. Entonces intentemos eso con Cartero también. Voy a cambiar esto de llegar a borrar. Eliminamos y obtenemos el éxito. Se suprime esa categoría. Tenemos que arreglar esto porque no es categoría. Tenemos que hacerlo como orden. Y aquí también orden. Entonces ahora si quiero conseguir una lista de las órdenes, nuevo, tendremos sólo un pedido, que es el que llamó a USA. Y ahora sólo teníamos uno. A lo mejor alguien preguntará ¿Qué pasa con los artículos del pedido? ¿ Están borrados o no. Comprobemos eso en la base de datos. En nuestra base de datos teníamos artículos de pedido y deberíamos tener dos pedidos solo para pedir artículos, pero vemos que los artículos de pedido siguen aquí. Entonces tenemos un tema aquí. También necesitamos eliminar los elementos de orden del pedido que se borra. Por lo que voy a dejar esto como un ejercicio para ustedes. Por lo que el ejercicio será solo para eliminar los artículos ordenados también después de que eliminemos el pedido. Y luego los veré en el siguiente video para ver la solución, cómo implementamos la eliminación de artículos de pedido después de eliminar el pedido.
50. Cálculo de una orden con mongoose: Enviar el precio total desde el front end no es una buena práctica. Por ejemplo, si algún hacker pudo enviar un pedido con un precio total falso de alguna manera, entonces se almacenará en mi base de datos con un precio total falso. Entonces tal vez alguien tiene orden era de cien, diez cientos dólares, pero lo fingió y lo hizo con 2 dólares. Cuando tenga una tienda online muy ocupada, no la
detectaré. Por lo que es mejor después de que el usuario esté enviando los artículos del pedido, ID, o los artículos del pedido en general al backend. Calculamos eso internamente en el back-end en base a lo que tenemos en la base de datos. Por lo que la fuente de la verdad es una base de datos. Entonces lo que necesito hacer es recorrer
los artículos de pedido que obtuve del usuario o del front-end. Y luego resuelvo esos artículos de pedido. Obtengo el producto relacionado con el producto. Y con la cantidad, multiplico eso y calculo el precio total. Entonces todo viene de la base de datos. Entonces intentemos hacer eso. Aquí. Tenemos los identificadores de artículo de pedido resueltos. Entonces de alguna manera necesitamos reemplazar esto por una variable que calculamos internamente. Entonces llamémoslo un precio total. Y este precio total vendrá de una constante donde vamos a resolver estos artículos de pedido. Entonces de la misma manera, hacemos clic Crear una constante, llamarla un precio total. Porque vamos a bucle en los artículos de pedido exactamente de la misma manera aquí. Entonces lo haremos como promesa punto todo. Por lo que aquí voy a obtener los ítems del pedido identificaciones resueltas y mapa sobre ellos. Y me van a pedir ID de artículo. Voy a recuperar el elemento de pedido de
la base de datos porque está almacenado aquí ya en la base de datos. Entonces exactamente como aquí, diga asíncrona para nuestro artículo de pedido. Y obtenemos el artículo del pedido a través de espera. Y obtenemos también el modelo de artículo de pedido. Y encuentra por DNI, el DNI que llegué aquí del mapa. Y luego dentro de este artículo de pedido, obtendremos solo el ID del producto y la cantidad. Por lo que también necesitamos poblar el producto. Y para hacerlo más rápido, sólo
podemos pedir el precio. Por lo que aquí me van a devolver pedido artículo con el campo de producto dentro de él, sólo el precio. Y luego iré a Create Constant precio total, solo uno. Y diré el artículo de pedido que obtuve de la base de datos, punto-producto, precio de punto, porque tenemos el precio poblado ya multiplicado por la cantidad de punto del artículo de pedido. En este caso, obtendré también la cantidad multiplicada por el precio. Obtendré el precio total de un artículo. Entonces mapeo sobre toda esta matriz, me gustaría después de eso, volver, sólo el precio total. Entonces aquí tendré matriz de precios totales para cada artículo de pedido. Así que vamos a tratar de consola log esta matriz de precios totales para asegurarnos de que todo va a funcionar bien. Y voy a publicar una nueva solicitud o un nuevo pedido. Tengo un error aquí porque soy consola log una promesa. Entonces aquí, como lo hicimos antes antes, que tenemos aquí sólo una promesa, devuelta, prometida en absoluto, toda promesa combinada, ponemos un peso. Entonces es simplemente que también podemos poner un peso aquí, como el peso y resolver esta promesa después de que todo se haga por dentro. Vamos a intentarlo de nuevo. Reinicia nuestro servidor. Intenta publicar. Veremos aquí que tenemos matriz de dos artículos o pedir artículos con su precio total. Por lo que necesitamos hacer fusionar o resumir estos dos precios a uno. Para ello, no podemos simplemente hacer precio total constante. Y esta matriz de precios totales, lo
reduciré. Y es método reducido. Es una forma famosa de obtener la suma de todos los números dentro de la matriz. Entonces tengo a y b, regresa para mí un plus B. Y aquí agregamos un 0. Entonces el valor inicial es 0 y luego combinar a y B, o combinar cada elemento de esta matriz. Entonces aquí, después de obtener el precio total, podemos colocarlo aquí, reiniciar nuestro servidor, hacer una solicitud, y veremos que creamos una solicitud de post con el pedido. Y el precio total es 146, que se combina de dos artículos de pedido. Vamos a obtener también este detalle del pedido. Vamos aquí, lo ponemos en la solicitud GET para obtener los detalles. Entonces veremos primer producto, tenemos un 32 y la cantidad es de tres. Y también el segundo producto es la cantidad 2, y el precio es de 25. El precio total será de 146. De esta manera, garantizamos que el precio total viene solo de nuestra base de datos, no del front-end. Entonces, en primer lugar, creamos los artículos de pedido como vimos antes. Después nos dieron el precio, precio total de cada artículo de pedido, y luego los combinamos o los resumimos en un solo número. Y luego creamos el pedido con el precio total, que viene totalmente de la base de datos.
51. Obtener ventas de tiendas total con $sum: Como siempre. Y al final de cada módulo, hacemos siempre alguna solicitud post o GET de algunos datos estadísticos. De lo que me vino a la mente aquí que por ejemplo, quiero mostrar en el tablero del panel de administración de la aplicación cuánto totales colinas tengo en toda mi e-shop. Por lo que el dueño de la tienda, cuando se
encerró en el panel de administración, ve las ventas totales y estará contento. Entonces como siempre, vamos a crear una solicitud get. Y la ruta será get y ventas totales. Y aquí vamos a, después de que pasemos esta API, después de los pedidos, obtendremos el total de ventas. Por lo que aquí tenemos asíncrona, solicitud y respuesta. Y será un método ROM. Y definimos una variable, lo
llamamos ventas totales. Y obtendremos el total de ventas directamente de MongoDB. Entonces mediante el uso de Mangoose, aquí, tengo aguardado, el modelo de orden. Entonces uso un método llamado agregado. Y el agregado, puedo agrupar como unirse, podemos decir en base de datos relacional, todas las tablas o todos los documentos dentro de esa tabla a uno. Y luego consigo uno de estos campos en esa tabla y uso uno de los métodos de Mangosta, como por ejemplo, algunos en ese campo. Por lo que me devolverá la suma de todo el campo, que nombre, Precio total. Si recuerdas, tenemos un precio total calculado ya, cómo vimos en la conferencia anterior en cada orden. Por lo que necesitamos sumar todos estos precios totales en uno usando algunos. Entonces para hacer eso, tenemos aquí un objeto. Estamos agrupando la mesa. Y aquí en el método, decimos que el ID es nulo. Es así. Y nombramos el campo que queremos devolver en nuestra API. Entonces digo que las ventas totales son la suma. Esta es una palabra reservada en Mangosta de precio total. El precio total es un campo en el orden, y lo hemos calculado aquí mientras estamos creando el pedido. Entonces obtendré el total de ventas resumiendo todos los precios totales. Entonces comprobamos si no hay ventas totales, luego devuelto por mí, error response.status. Y luego por ejemplo, decimos 400. No enviar, el pedido, las ventas no se pueden generar. De lo contrario decimos respuesta dot enviar. Las ventas totales son ventas totales. Probemos eso ahora con Cartero, voy aquí, digo conseguir ventas totales. Enviamos una solicitud. Vemos que conseguimos array con ID nulo y ventas totales. Entonces vimos que conseguimos exactamente lo que hemos construido en el grupo. Entonces si elimino este ID nulo, obtendré error porque Mangoose no puede devolver ningún objeto sin ID o ID de objeto 2, como vemos aquí en este error, dice
que una especificación de grupo debe incluir un ID. Por lo que es mejor volver a ponerlo. O también puedes dar ID usando especificaciones de Mangosta, Es mejor ponerlo como nulo. Entonces vimos aquí que conseguimos una matriz. También podemos BOP directamente esta matriz y tomar sólo las ventas totales. Entonces podemos decir aquí, devuelto para mí ventas totales punto pop porque es una matriz. Y luego ventas totales. Entonces en este caso, obtuve el primer elemento de esta matriz, o el elemento ligero porque está devolviendo solo una matriz con un elemento. Entonces digo, dame este artículo y el total de ventas que especificé aquí. Lo intentamos de nuevo. Enviamos esa solicitud, obtendremos ventas totales es de 290 a esto porque tenemos aquí, si obtenemos la solicitud, tenemos pedidos. Por lo que el primer orden tiene 146 y el segundo orden tiene también 146. También podemos obtener cuántos pedidos se crean o se colocan en mi tienda antes de cómo hacemos un recuento total de los productos. Por lo que aquí podemos copiar esto desde la API de Producto y colocarlo en pedidos. Y decimos aquí o allá, contar nuestro recuento bajo o el conteo del titular de la cuenta y aquí ordenar. Y con documentos de conteo, obtendremos el conteo y regresaremos a nuestro conteo de pedidos, y luego lo obtendremos. Probemos eso de nuevo en nuestro Cartero. Entonces aquí digo getCount. Y veremos que tenemos tres órdenes. Por lo que ahora se completa nuestra API para los pedidos. Ya estamos listos para utilizar toda la API relacionada con los pedidos en el front end. Y en el siguiente apartado, volveremos al producto para subir las imágenes. Te acuerdas, tenemos aquí imagen e imágenes. El imagen será la imagen principal de su producto, y las imágenes contendrán las imágenes de galería de su producto. Espero que hayas disfrutado de esta sección y te veo en la siguiente.
52. Obtener pedidos de usuario: En el front end, cuando el usuario ingresa, necesita saber qué órdenes ordenó en el historial. Por lo que necesitamos tener algo al menos de historial de pedidos. Entonces de esta manera, esta API será exactamente como conseguir menos pedidos, algo así, pero se especificará solo para un usuario específico. Entonces tomemos estas solicitudes GET y lo copiemos a la última. Y aquí diremos que quiero conseguir,
por ejemplo, usuarios mayores o pedidos de usuarios. Y necesitamos especificar como un, por ejemplo, como parámetro, el ID de usuario. Por lo que aquí decimos ID de usuario. Entonces cuando estoy enviando una solicitud desde el front-end o desde nuestra API, necesitamos especificar el ID de usuario para el cual quiero obtener los pedidos. Y como condición para el hallazgo, decimos objeto, campo de
usuario debe ser request dot params dot. El mismo paradigma que tengo aquí, ID de usuario. Y tal vez no necesitamos poblar al propio usuario. Necesitamos poblar los productos dentro de este pedido. Entonces es exactamente como lo hicimos aquí en el detalle del pedido, cómo estábamos poblando los artículos del pedido y los productos y la categoría. Copiamos ese mismo y lo pasamos aquí. Por lo que en este caso, veremos que los artículos del pedido se han poblado con los productos y ordenaron de los más nuevos a los más antiguos Para no tener nombres confusos. Vamos a renombrar esto. Por ejemplo, podemos decir usuario o su lista. Y aquí lista de pedidos de usuarios aquí también usuario ordenado. Ejecutemos el servidor. Pm inicio. El servidor está ejecutando la conexión de base de datos lista? Eso lo intentamos en Cartero. Entonces tengo aquí órdenes, obtengo órdenes de usuario, y paso el ID del usuario, cual quiero tener sus órdenes. Entonces paso éste y me dieron otros artículos. Se ven así. Y otro pedido, tiene también artículos de pedido. Por lo que tenemos los tres pedidos para este usuario. Veremos aquí el mismo nombre de usuario son el mismo ID de usuario. Siempre es n igual a 4, 4. Y aquí otro. Por lo que al final de esta sección, verás que eres capaz de crear cualquier solicitud o
cualquier API que necesites en base a lo que las necesidades en el front end. Entonces por ejemplo, llegamos aquí los pedidos del usuario y también nos dieron, por ejemplo, cuántos pedidos tengo en mi emisión. Eso es todo acerca de las API. En la siguiente sección, aprenderemos a subir archivos a nuestro servidor, como imágenes o algunos archivos adjuntos en general. En esta conferencia, hay apego
del código de recursos donde llegamos en estos ordenes. Y puedes descargarlo e intentar por ti mismo
hacer algunas cosas diferentes con las API en función de tus necesidades.
53. Imagen y galería: Ahora llegamos al último módulo, que relacionado con la espalda y el desarrollo. Ahora necesitamos subir las imágenes con nuestro producto, como vimos antes, el producto contiene dos campos. Una de ellas es una imagen principal y el segundo campo son las imágenes. Entonces, ¿dónde estará más descripción sobre el producto como imágenes de una galería? Por lo que en este módulo, verá el paso principal es instalar biblioteca Walter. Biblioteca es una famosa biblioteca utilizada para subir archivos al servidor usando Node.JS. Y en el segundo paso, encontraremos la mejor configuración para nuestro e-Sharp porque necesitamos configurar esta biblioteca para usar y subir los archivos a nuestro servidor. El tercero, veremos cómo utilizar el destino y subieron los nombres de archivo. Siempre cuando el administrador suba un archivo o una imagen, debe especificar el nombre del archivo. Pero no, no podemos hacer eso por el administrador ni por el usuario. No tenemos que dejar que le ponga nombre al expediente. Podrás subir cualquier archivo y será codificado en nuestro servidor. Usar Cartero también es muy importante para nuestro caso aquí para probar la subida de imagen, veremos cómo probar la carga de imagen con un cartero usando subir un archivo o varios archivos. Y no permitiremos que el usuario cargue nada. Necesitamos que suba solo tipos específicos de imágenes, como con extensión PNG para J Beck. Y por supuesto, todo esto hecho por un solo archivo. Ahora necesitamos ampliar la biblioteca para que sea posible subir múltiples archivos. Y se necesitan múltiples archivos para que subamos muchas imágenes para la galería de productos. Y por último, veremos cómo buscar este producto con las imágenes y
las imágenes de la galería para verlas en el front end. Por supuesto, vamos a buscar sólo la URL de la imagen. Espero que disfruten de este módulo y nos vemos en la próxima conferencia donde empezaremos a instalar biblioteca de mortero.
54. Configure la carga de la versión en el servidor: De acuerdo, entonces primero necesitamos configurar el back-end para aceptar subir los archivos. Para ello, necesitamos instalar una biblioteca llamada Walter. Al igual que cualquier biblioteca, hacemos npm instalamos Walter. Y con esto, instalaremos la biblioteca y la usaremos para subir archivos a nuestro servidor. Y como siempre, hacemos constante, Walter y requerimos mortero. Veamos la documentación de esta biblioteca. Si vas a Google y tecleas motor, verás los paquetes MPM, el sitio web de npm, donde tenemos todo el uso de esta biblioteca. Para ver un uso más detallado o un uso actualizado, puede ir a la página principal de la biblioteca. Por lo que aquí hago clic en él y me llevaría a la página de inicio de biblioteca de morteros. Entonces el uso más simple de esta biblioteca será como el siguiente, cómo está en la documentación. Entonces, en primer lugar, necesitamos un formulario y este formulario será proporcionado por el cartero, como veremos más adelante. Y el primer uso aquí que podemos llamar a la biblioteca molto y luego configurarla con un destino en nuestro servidor de la carpeta. Por lo que cuando el usuario cargue cualquier archivo a través del formulario, se almacenará en la carpeta de cargas, que estará en la raíz de la aplicación back-end. Y después de eso, en cada solicitud de post, por ejemplo, tenemos un post de producto necesitamos pasar también no sólo la URL y la función de solicitud y respuesta, necesitamos también pasar la subida,
me refiero a la subida configuración de Walter. Entonces aquí podemos pasar la subida y decimos una sola, pasamos el nombre del campo, que se ve desde el front end. Entonces como ven aquí, el nombre del campo se llama Avatar, y aquí se pasa en la solicitud. Pero aquí el archivo subido será exactamente el mismo nombre donde lo subieron el usuario. Por lo que tendremos un problema cuando un cliente, o lo siento, el administrador subirá el archivo. Tendrá, por ejemplo, otro expediente con el mismo nombre. Entonces este archivo reemplazará al archivo antiguo. Y en este caso tenemos un problema entre los productos puede ser voy a perder algunos nombres de productos o algunas imágenes de productos. Por lo que la mejor manera que necesitamos tener más control en nombrar los archivos y nombrar el destino. Entonces, por ejemplo, necesitamos, cada vez que se cargue el archivo subido, necesitamos cambiarlo de alguna manera a algunos, un nombre único y luego almacenarlo en nuestro servidor. Para ello en biblioteca múltiple, existe otra opción de tener un control completo sobre el nombre de los archivos, que se denomina almacenamiento en disco. Y con este ejemplo, vamos a construir nuestra API de subida. Por lo que usaremos esta parte. Tomémoslo exactamente igual y copiarlo a nuestra aplicación. Y diremos que el almacenamiento es el almacenamiento en disco Walter, que tiene dos campos, el control del destino y el control del nombre del archivo. El destino será una función donde tenga la solicitud en sí y el archivo y la devolución de llamada. Se devolverá la devolución de llamada si hay un error en la carga y asignamos el destino en ella. Entonces aquí, pongamos nuestro destino de subida. Podemos llamarlo público y sube. Por lo que aquí, tendremos una carpeta llamada cargas públicas. Podemos crear esta carpeta. Entonces podemos decir aquí en el back-end, podemos decir subidas. Y dentro de ella, o lo siento, podríamos tener público primero. Público. Y es público estará en el nivel raíz. Por lo que tendrá, por ejemplo aquí. Y el público, la carpeta de cargas estará dentro de ella. Por lo que aquí ahora tenemos subidas públicas. Por lo que en un futuro, cuando
subamos el archivo, lo veremos aquí ubicado directamente en las cargas públicas. En el nombre del archivo. Será lo mismo. Contendrá la petición de roca y el archivo. Y necesitamos de alguna manera cambiar el nombre del archivo para que se ajuste a nuestras necesidades y cómo se ubicará en las cargas. Por lo que hay otra forma como él está creando aquí. Por ejemplo, el, algunas matemáticas aleatorias para tener un nombre aleatorio de la aplicación o sobre el archivo. Y luego puso el nombre del archivo original con guión y el sufijo único que creó antes. Hagamos de otra manera. Por lo que crearía una constante. Vamos a llamarlo nombre fino. Y este nombre de archivo será el propio archivo que obtuvimos ese nombre original. Ya está definido. Y entonces decimos, alguna manera para reemplazar los espacios, no
es agradable tener espacios en la nomenclatura de los archivos en el servidor. Porque cuando tengas la URL, tendrás URL fea donde reemplazará como por ampersand t2 para los espacios. Pero aquí podemos tener exactamente nuestros reemplazados los espacios con split. Por lo que estoy dividiendo el nombre de archivo en función del espacio y el reemplazo o unión. Nuevamente este espacio con un guión. También puedes usar otra forma, que es por ejemplo, dot reemplazar cada espacio con un guión. Ambos caminos están bien. Por lo que también podemos agregar algún prefijo o sufijo a este nombre. Por lo que aquí podemos decir el nombre del archivo. Y por ejemplo, podemos decir lote de fecha ahora. Entonces aquí DataNode ahora método, si lo vemos, devolverá el número del día. Para que podamos probarlo con la consola del Google Chrome. Ya puedes decir fecha. Y verás que tienes el número de la fecha y la hora ahora. Por lo que este es un gran número único para crear nuestros archivos. Entonces después de eso, hemos creado una constante. Hagámoslo como una constante, no como un VAR. Y esta constante se llama subir. Nuevamente, llámalo, por ejemplo, opciones de subida. Y esta opciones de subida, necesitamos pasarlo a nuestra solicitud de post donde estamos creando el producto exactamente de la misma manera como se describe en la biblioteca de Malta. Entonces si vemos aquí que tenemos también el sencillo de subida y Avatar y el nombre del campo. Nombre de campo, necesitamos enviarlo desde el front end. Entonces aquí decimos opciones de subida, punto, sencillo, y el nombre del campo donde quiero enviar desde el front end. Entonces digo, por ejemplo, imagen. Pero aquí cuando estamos creando el producto, estamos analizando solicitud de imagen de punto cuerpo dot. Esto está mal. Necesitamos editar este campo para tener la ruta completa de la imagen. Por lo que soy Walter ya nos envió con esta solicitud, el expediente. Por lo que no podemos decir por ejemplo, constante filename es request dot file, dot filename. Y este nombre de archivo viniendo de aquí donde configuramos el nombre de archivo del archivo subido. Entonces tendremos el nombre exactamente como lo tenemos de esta manera. Al igual que el nombre original del archivo, reemplazado por guiones y luego guión, no lo saben. Hagámoslo de esta manera. Tenemos un nombre de archivo y luego ponemos el nombre del archivo aquí. Pero cuando quiero buscar estos datos en el front end, y quiero ver el, O por ejemplo, mostrar la imagen en el front end. Tendré tema eso. Voy a obtener sólo el nombre del archivo. Por ejemplo, obtendría imagen 300, 300 punto J Beck. Y esto es un problema para nosotros porque en el front end no conoce la ruta original del archivo. Necesitamos de alguna manera tener la ruta completa con la URL también del backend. Por lo que diré http, localhost 3000 y la carpeta de carga. Y luego la imagen con el nombre y la extensión. Sentimos que también llegó aquí para agregar la extensión. Por lo que tenemos el nombre del archivo solo así. También necesitamos editar las opciones de nombre de archivo aquí. Tener también con la extensión. Veremos eso cuando estemos validando el expediente en las próximas conferencias. Pero ahora centrémonos en esta parte de que necesitamos la URL completa, no sólo el nombre del archivo. Para eso, necesitamos construir de alguna manera esta cuerda. Por lo que podemos decir constante. Podemos decir ruta base, como la ruta base fuera de su aplicación. Y lo podemos hacer con backticks de alguna manera, como punto de solicitud. Tiene algún campo llamado protocolo. Y este protocolo me devolverá el HTTP. Y luego veremos que tenemos barras de dos puntos y necesitamos pasar al huésped. Por lo que también podemos hacerlo de la misma manera. Podemos decir request dot get,
obteniendo un campo específico llamado host. Esta es una forma de cómo obtener al anfitrión de la solicitud. Por lo que ahora construimos nuestro camino base. Vamos a sumar cuatro. También la parte donde estamos diciendo la carpeta donde se sube. Por lo que tenemos que sumar también esta parte. Por lo que podemos decirlo así. Y luego agregamos sólo el nombre del archivo. Entonces podemos decir aquí, después de eso tenemos backticks, ruta
base, y el nombre del archivo. De esta manera, construimos nuestra URL API o URL de archivo subido. De esa manera, tenemos la ruta base es esta parte y el nombre del archivo, que es esta parte. Probemos eso ahora con el cartero. Y prueba si todo está funcionando bien.
55. Pruebar la carga de imágenes con Postman: Ahora vamos a probar nuestros cambios con Cartero. Te acuerdas, creamos aquí el campo de imagen, cual tendrá la ruta y el nombre de archivo que se carga. Ir a Cartero. Necesitamos crear una solicitud de post sobre la API del producto y agregamos la autorización con el token de barrera que obtuvimos antes. Y tenemos el token aquí para recordarles, conseguimos ese token después de que tengamos un usuario conectado. Entonces aquí voy. Y luego busco a un usuario con su correo electrónico y contraseña, luego obtendré el token. Esto. Si no sabes cómo obtener este token, qué explicamos eso en el capítulo del usuario. De acuerdo, pero ahora cómo podemos probar a Cartero para subir archivos. Recuerda que estábamos enviando en el cuerpo de la solicitud como JSON, y estábamos creando el JSON aquí y estábamos poniendo el nombre
del producto o la descripción del producto o la descripción y el precio. Pero aquí será un poco diferente. En el front end, será algo así como una forma. Forma era campos como como se ve ahí dentro a la derecha de la pantalla. Entonces aquí tenemos unos campos donde lo llenaremos y los enviaremos al backend. Y el campo de archivo donde el usuario puede subir un archivo. Esto se llenará con un dato de archivo, y los datos del archivo se enviarán al backend a través de un dato de formulario. Por lo que necesitamos crear algo así como un dato de formulario y hombre en relieve. Si desea simular un formulario, puede crear un dato de formulario y cada campo se nombrará aquí con su valor. Por ejemplo, tendré aquí el nombre del producto. Y por ejemplo, el producto que quiero publicar será el producto seis. Y quiero también, por ejemplo, descripción del producto. Y aquí estará producto busca descripción. Entonces necesitamos de alguna manera poner todos los campos que queríamos como vimos previamente, el modelo de productos que tenemos aquí. lee la descripción, la descripción, las imágenes y todo aquí. Entonces necesitamos tener el campo de imagen, déjame sentir los campos aquí en el Cartero. Y luego hablaremos de las imágenes. Por lo que aquí hemos llenado todos los campos de formulario que necesitábamos enviar al backend y con su valor. Entonces para la imagen aquí, se valorará, no serán, por ejemplo, textos como aquí, o un valor, o un número o un booleano. Será un archivo. Entonces, ¿cómo podemos hacer eso como archivo? Es muy sencillo. Tenemos cartero, Hay un truco que cuando pones el ratón, el campo, ¿dónde quieres cambiar? Puede seleccionar que el tipo de este campo pueda ser un archivo. Cuando pongas el archivo, tendrás tu capacidad para seleccionar un archivo de tu PC. Exactamente igual como estás subiendo un archivo en el formulario web. Entonces, vamos a seleccionar una imagen. Tengo aquí, muchas imágenes, por ejemplo, esta. Y subiremos y enviemos la solicitud de post. Veremos que la solicitud de post se crea exactamente cómo lo hicimos en el back-end. Y tenemos la imagen como URL completa. Y el archivo de imagen con la misma extensión aquí. Pero si ven aquí que tenemos una extensión y luego la nomenclatura, entonces tenemos un problema aquí. Por lo que necesitamos de alguna manera excluir esta extensión y poner este punto fecha ahora después, y luego ponemos la extinción al final. Hagámoslo rápidamente. Cambiaremos su configuración aquí del nombre de archivo en Walter para obtener el nombre de archivo derivado con la extensión. Entonces cambiemos esta parte con los backticks será más agradable en el código. Entonces podemos tener el nombre de archivo dash, esta fecha doc ahora. Y necesitamos aquí agregar de alguna manera la extensión para que podamos decir punto y aquí será la extensión de donde voy a obtener la extensión. En la siguiente conferencia, veremos cómo validar estos archivos que están llegando al back-end. Por lo que necesitamos que el usuario cargue solo tipo específico de imágenes. Necesitamos que suba solo JPEG y PNG. Por lo que no podemos dejar que aplauda, por ejemplo, un archivo PDF o por ejemplo, un archivo XML. Por lo que necesitamos de alguna manera el back-end para rechazar una solicitud cuando no hay una imagen. Esto lo haremos en la próxima conferencia.
56. Validar los tipos de archivos subidas: De acuerdo, Ahora necesitamos crear nuestra extensión. Pero primero dijimos que necesitamos validar los archivos cargados del usuario. Para ello, necesitamos crear una lista de archivos a los que se les permite que acepte ese backend completo. Por lo que podemos definir una constante. Decimos mapa tipo archivo. Y este mapa de tipo de archivo contendrá una lista de extensiones que se permiten subir a mi back-end. El primer campo será la imagen PNG. Y luego PNG. Por qué lo hice de esa manera. Entonces aquí tenemos la clave como un punto de imagen PNG y el valor es un PNG. Esto necesitamos eso por el tipo mimo. Tipo mimo. Si lo Google, es de tipo inmediato y conocido como extensiones de correo de internet
multipropósito o tipo mime. Y este es un estándar que indica la naturaleza y el formato de un archivo de documento. Toda solicitud se envía al backend. Y el archivo que está conteniendo el archivo de datos o los datos de archivo, tiene también un tipo mime. Un tipo mime tiene un formato como este. Por lo que consigo y PNG documento dxdy. Entonces de esta manera, puedo definir cuál es el tipo de archivo que está llegando al backend. Los tres tipos más importantes que necesitamos en nuestro back-end son éste,
PNG, JPEG, y JPEG. Entonces aquí tendremos esos tipos. Y en Walter, cuando quiero configurar el nombre del archivo, aquí
puedo encontrar algo llamado tipo mime. Por lo que el tipo mime incluirá la información o la información del archivo con la estación de tinta del tipo mime aquí. Entonces para tener la extinción adecuada, lo
haremos de esta manera. Extensión const igual al laboratorio
de tipo de archivo y obtener el valor de Tipo mime de lote de archivo. Entonces aquí irá a esta matriz y tomará el tipo mime, que viene uno de estos, luego asignar la extensión como valor. Y aquí voy a obtener el valor o la extensión al nombre de mi archivo. De acuerdo, hablamos de validación del expediente. Por lo que necesitamos de alguna manera validar el archivo si se permite subir o no. En la devolución de llamada de destino, se
puede definir el error. Entonces cuando hay un error, la devolución de llamada la tirará aquí. Entonces primero podemos hacer una constante es válido archivo por ejemplo. Y usaremos el mismo concepto aquí. Por lo que obtendrá el tipo mimo y lo comprobará si se encuentra en el mapa que asigné en mi back-end. Y en Node.JS, podemos definir un error. Por lo que puedo decir aquí, dejar subir error es igual a nuevo error. Y podemos decir que el error es de tipo de imagen inválido. Y entonces podemos comprobar si hay, es válido. Entonces haz este error de subida como monja. Y luego usa error de subida en la devolución de llamada. Entonces si el archivo es válido, no
hay error y se ejecutará la devolución de llamada. Por lo que recuerdas, subimos con Cartero un archivo y tiene este nombre. Entonces ahora no vamos a tener este JPEG aquí. Lo tendremos al final. A lo mejor se quedará aquí, pero tendremos al menos extensión al final. Vamos a probar eso con un cartero. Ahora, con nuestro formulario, tengo los mismos datos, misma imagen que he subido. Envía esa solicitud, me dieron imagen subida. Y vamos a revisar la extensión. Veremos que tiene la extensión al final y el nombre del archivo. Y aquí está la imagen funcionando bien. Intentemos ahora subir un archivo, pero no la imagen. Podemos decir, por ejemplo, un PDF. Por lo que tengo aquí un PDF de prueba. Yo lo subiré. Y nos dieron el error. Entonces obtuvimos el error, ese tipo de imagen inválida, que creamos aquí. Entonces aquí en el front end, vimos que cuando subimos PDF, nos dieron el tema. Pero lo que por ejemplo, J peg, envíe esa solicitud. No tenemos ningún tema. Tenemos el camino completo y tenemos también la extensión. Y cada vez que hago una solicitud de subida, obtengo un nuevo dato y nueva fecha y el archivo, es el mismo, pero se sube de nuevo con un nombre diferente. ir a nuestra base de datos en Atlas, podemos consultar el archivo o el producto que se crea. Veremos que el producto tiene la imagen y tiene una URL completa. Por lo que esto será accesible desde cualquier lugar de nuestra aplicación. Pero debemos tener algo así como excluido de la autenticación. Porque si recuerdas, toda la API está autenticada. Por lo que no podemos hacer nada sin autenticarnos. Pero necesitamos que eso sea público, lo cual veremos en las próximas conferencias. En la próxima conferencia, veremos si realmente existe el expediente. Entonces si no hay un archivo o imagen para el producto, necesitamos rechazar la solicitud.
57. Sude imágenes con la solicitud de publicación de productos: ¿ Y si el front end me envía su solicitud sin archivo? Entonces ese campo requerido de imagen sería negado a manejar eso. Primero comprobemos si tenemos un archivo en nuestra solicitud. Entonces voy aquí y creo una constante, lo
llamo archivo y le doy a esta constante el valor del archivo de punto de solicitud. Y exactamente con la categoría, podemos hacerlo igual con el archivo. Entonces digo que si no hay archivo, entonces devuelva un error al usuario de que no hay ningún archivo. De esta manera, estaremos seguros de que nuestra solicitud no pasará sin expediente. Cuando vayamos a Cartero y enviemos la solicitud sin archivo, vamos a conseguir que no haya imagen ahí solicitudes. En la siguiente conferencia, veremos cómo utilizar imágenes para subir múltiples imágenes, las cuales serán, por ejemplo, una galería sobre el producto. Por lo que en una solicitud, el usuario enviará múltiples archivos, no sólo un archivo. Y esto sucederá en el campo de las imágenes.
58. Subir imágenes con la solicitud de PUT del producto: Cuando vamos a ir semana a actualizar un producto, también, necesitamos preocuparnos por la imagen. Entonces, ¿qué pasa si el usuario quiere subir una nueva imagen a su producto, como si quisiera actualizar la imagen misma. Para eso, haremos los mismos pasos que hicimos para el puesto. Por lo que necesitamos agregar las opciones de subida también a la solicitud PUT. Entonces lo agregamos aquí y luego vamos a hacer algunos cambios aquí. Entonces primero, si el usuario no sube ninguna imagen, entonces quiero mantener la imagen antigua que está en la base de datos. Pero si sube alguna imagen, entonces necesito enviar y subir de nuevo la imagen a
los archivos y luego agregar la nueva URL a la base de datos. Hagamos que este perro se haga eco. Entonces, en primer lugar, quiero encontrar el producto. Entonces agrego aquí una constante llamada un producto y el producto encontrar por ID, solicito dot powerapps dot ID, y luego reviso si no hay producto, luego devuelto para mí status 400, que es producto inválido, bien, Ahora todo está bien. Entonces garantizamos que el usuario realmente está entrando en un producto específico y llegado. Otra cosa, entonces vamos a conseguir el archivo en sí. Entonces diré archivo const y este archivo, hemos venido con su archivo de punto de solicitud como lo hicimos exactamente con una solicitud de post. Y luego definiré un camino que se llama ruta de imagen. Y esta ruta de imagen está vacía. Voy a usarlo para llenar el camino de la imagen. O será la antigua que ya está en la base de datos, o luego archivas ruta si el usuario subió una nueva imagen ahí solicitud PUT. Entonces como lógica, diré si archiva, entonces exactamente cómo lo hacemos con la solicitud de post. Definiré un nombre de archivo y luego de ruta base. Y diré que el nombre del archivo o la ruta de la imagen será exactamente igual como lo tenemos aquí. Por lo que tendremos la ruta base y también el nombre de archivo juntos como baño de imagen. Y de lo contrario, si no hay baño de imagen o si hay Archivo, entonces yo diría que la ruta de la imagen es la misma la ruta de la imagen antigua que se definió previamente cuando se creó el producto. Entonces yo diría producto, esa imagen, la vieja porque me dieron el año productivo y te garantizo que el producto realmente existe. Por lo que no le estoy lanzando error al usuario. Entonces seguro que el producto tiene un valor aquí. Y entonces diré que si son cinco, entonces sube el archivo y dame el pasado a ella. De lo contrario, dar la ruta de la imagen será la imagen del producto, que fue anterior. Y entonces aquí diré que la imagen será la ruta de la imagen con los datos actualizados. Pero aquí vamos a renombrar ese producto. Por lo que podemos decir un producto aquí por conseguir el producto. Y podemos decir aquí, producto
actualizado y el producto actualizado, lo
encuentro y luego lo reviso y luego mandar esa solicitud de vuelta con los datos actualizados. Por lo que esos son los cambios requeridos para la solicitud de puesto. En este caso, no obtendrás ningún error y vas a tener algún problema cuando vuelvas a subir la imagen o cuando no subas la imagen. Por lo que el usuario aquí tiene opción, puede subir imagen o no en la solicitud PUT.
59. Galería de productos: carga de imágenes: De acuerdo, aquí teníamos un solo archivo, así que cargamos solo un archivo a la API. Pero aquí necesitamos un múltiples archivos para la galería de productos. De la misma manera, podemos cambiar esta solicitud de post para aceptar también un múltiples archivos. Pero hagámoslo un poco más complicado tener un ejemplo práctico real. Normalmente cuando estás actualizando un producto o agregando un producto, lo segundo que haces es subir la galería de imágenes. Y esto sucede normalmente en las tiendas web. Después de crear un producto, todo está bien. Después vas y editas nuevamente el producto para abollar la galería de imágenes. Entonces vamos a crear un ABI específico solo para subir la galería del producto. Esta API será solicitud de actualización, no una solicitud de post. Por lo que necesitamos la solicitud de post. Por lo que copio esta solicitud de post. Vayamos al final y sumémoslo aquí. Y más allá, podemos mantener el ID del producto y también podemos agregar su duda donde actualizaremos solo las imágenes de la galería. Por lo que aquí podemos agregar imágenes de galería. Y luego el ID del producto. Como vimos antes en la solicitud de post del producto, agregamos también la opción Subir imagen única. También podemos agregarlo a la solicitud PUT. Por lo que podemos agregar aquí opciones de subida, pero no solo. Diremos array. Entonces esperaremos del front end nuestra matriz de archivos, llamémoslo emite. Y si notas aquí que el método array me está dando también un recuento máximo. Por lo que puedes permitir el tamaño máximo de carga de archivos. Entonces por ejemplo, diré máximo, necesito 10 archivos o 20 archivos en una sola solicitud. Entonces pongámoslo como 10. Moriremos más nuestro código. Entonces vamos a tener esto en una nueva línea. Entonces no podemos decir que éste está aquí. Y aquí, el método asíncrona. Y aquí tenemos el puerto y tenemos aquí el contenido de nuestra solicitud PUT. Por lo que la solicitud de actualización de su producto se actualizará exactamente estos datos, pero tendremos sólo las imágenes, no todos los datos. Entonces podemos hacer lo mismo que hicimos aquí. Es copiar esta parte para ver si el usuario está pasando la identificación exacta o la correcta. No necesitamos consultar su categoría porque no la estamos actualizados. Entonces vamos a tener este también. Pero como dijimos, teníamos todos los datos. Necesitamos actualizar sólo la imagen. Por lo que campo de imagen será matriz de imágenes. Entonces como vimos aquí, matriz de cadenas de imagen o camino de la imagen. Por lo que necesitamos aquí de alguna manera para construir array de cuerdas. Entonces podemos escuchar, digamos, búferes de imagen. Y este observador de imágenes sería un valioso como array de cuerdas. Entonces, ¿cómo vamos a construir esta matriz primero en esa solicitud, como vimos antes, que podemos tener archivo de punto de solicitud. O si ves que tenemos un expediente también no sólo archivo. Por lo que podemos decir que los archivos serán archivos constantes. Y exactamente como antes, podemos comprobar si hay archivos. Entonces voy a bucle dentro de estos archivos y construir las imágenes molesta matriz. Entonces aquí voy a mover esto hacia arriba y decir archivos mapa de puntos. Y esto tendrá expediente. Y dentro de este método de archivo, podemos decir La ruta de la imagen es puntopush, el nombre de archivo de punto fino. Pero no tenemos que empujar sólo el nombre del archivo. Tenemos que empujar también la URL base y también con la extensión. Entonces si recuerdas, creamos aquí la URL base, que construimos para las solicitudes de post. Por lo que podemos copiar esta parte también e ir
al método put y decir aquí la URL base o la ruta base. Y empujamos la ruta base con el nombre del archivo. Y aquí podemos devolver el producto. Entonces exactamente igual que la solicitud
PUT, podemos comprobar si hay producto, entonces eso es estanques sean los datos del producto. De lo contrario será error. Por lo que copiamos esta parte y la colocamos aquí. Vamos a probar eso con Cartero en lo que tenemos que ver con cartero, que colocamos aquí múltiples archivos. Entonces vamos a crear un campo, llamarlo, por ejemplo, imagen. Y esta imagen será un archivo. Y seleccionamos dos o imagen por ejemplo. Y no olvidamos eso para cambiar la API. Por lo que aquí estará Galería imagen y se pone la solicitud. Y necesitamos también la identificación del producto. Exactamente éste. Consigamos nuestro producto, o el producto es el producto seis, que creamos antes. Y ahora vamos a sumar la identificación aquí. Y enviaremos esa solicitud. Tenemos nuestro error, me olvidé aquí agregar productos. Entonces tendremos el camino correcto. Ahora lo probamos. Y luego veremos que el producto se actualizó. Y tenemos dos imágenes en la galería y la imagen principal, Todavía está ahí. Vamos a revisar nuestra carpeta de subidas. Veremos que tenemos dos imágenes, ésta y ésta. Por lo que en el front end, siempre actualizaremos nuestra galería o actualizaremos un producto y le agregaremos las imágenes de la galería. De eso se trata todo de esta sección. En el siguiente apartado, veremos cómo recuperar la URL de la imagen, que la veamos en el navegador y en el front-end, porque ahora está bloqueado y no tenemos acceso a ella porque está protegida con nuestra API autenticación.
60. Eliminar la carpeta de subidas de la autenticación: Ahora intentemos obtener esta URL y ponerla en el navegador, la URL de la imagen. Por lo que lo ponemos en el navegador y veremos que el usuario no está autorizado. Esto porque si recuerdas, en nuestro JWT, estábamos definiendo el baño es cuáles están permitidos para público. Por lo que necesitamos agregar la ruta de la carpeta de subida a permitir para que cualquiera pueda ver estas imágenes. De lo contrario, tendremos un tema. Por lo que la tienda electrónica no mostrará las imágenes del producto. Entonces vamos a copiar este. Será exactamente el mismo Git y opciones. También necesitamos reemplazar este por la ruta de la carpeta de cargas. La expresión regular para esto es ésta. Tengo slash, público slash subidas en todo viene después de ello. Vamos a guardarlo. Y vayamos a nuestro navegador. Refrescar. Veremos error de que no podemos obtener imagen de subida pública. Por qué esto porque es una carpeta estática. Tenemos que definir estas cargas públicas como una carpeta estática en el middleware de nuestra aplicación. Entonces para hacer eso, necesitamos ir a nuestro app.js. Entonces vamos aquí y decimos arriba uso. Y luego definimos el camino que necesitamos para hacerlo estático. Por lo que público slash sube. Y luego en Express, hay método para decir que esta es una carpeta estática y una palabra clave reservada, que es nombre nefasto devolver para mí la ruta raíz o la ruta raíz de la aplicación. Y más el camino que quería hacerlo como estático. Por lo que ahora esta ruta, cualquier archivo puede ser subido a ella. No será como API. Será como una ruta estática que está sirviendo los archivos. Por lo que de vuelta al navegador y hacemos una actualización. Seguimos obteniendo el error. Esto porque necesito agregar slash detrás del público. Actúa con nuestro navegador y refresca. Veremos la imagen que ya teníamos en el front end sin ninguna autenticación directamente por la URL. Ahora nuestro backend está listo. Hemos creado las rutas, cuatro categorías, pedidos, productos y usuarios, que necesitamos exactamente para nuestra e-shop. Pasaremos ahora a la parte front end y verás más que cosas nuevas y cómo nos reconectamos a este backend y creamos nuestra interfaz de tienda online.
61. Instalación de Heroku y Preparar Git: De acuerdo, En esta sección vamos a desplegar nuestro backend o nuestra Web API a Heroku. Heroku es una de las herramientas que se utiliza para desplegar el proyecto o API web. Y pueden ser públicos y podemos usarlos en tus proyectos. Por lo que no tendrás tu API basada solo en localhost 3000 como vimos, pero lo vamos a poner en alguna URL y podemos conectar nuestras aplicaciones front-end a ella. El primer paso que tenemos que hacer, tenemos que ir a un sitio web llamado Heroku.com y luego se nos pide que nos encerren. Por supuesto, si son unos pocos no tienen cuenta
aquí, también pueden inscribirse. El apuntarse es muy sencillo. Sólo tienes que proporcionar FirstName, apellido, dirección de correo electrónico. ¿ Y cuál es tu papel? ¿ País? Y además, hay que poner algo de lenguaje de desarrollo de dinero Brian. Tenemos que poner NodeJs en nuestro caso y tienes
que verificar que no eres un spam y luego puedes conseguir una cuenta. Después de iniciar sesión, vas a ver un panel como este. Por lo que este dashboard, necesitamos crear una aplicación que la vamos a hacer pública para nuestra API. Por lo que antes que nada, necesitas tener crear una nueva app. Y esta creación de una nueva app, puedes dar cualquier nombre para tu aplicación. En mi caso, le daría un nombre como e-shop, backend por ejemplo. Y tal vez este nombre no pueda estar disponible, por lo que es necesario especificar algún nombre específico. A lo mejor puedes dar como cualquier sufijo aleatorio. Por ejemplo, puedes poner tu apellido. Por ejemplo, pondré mi apellido o el nombre de mi empresa. Ya voy a ver, diría como un pedacitos azules. Entonces en ese caso, tendré e-shop back y bits azules. Y luego eliges tu región es mejor usar la región más cercana donde está más cerca para tus clientes objetivo. Entonces es mejor para mí en este caso, estoy viviendo en Europa. Por lo que voy a poner Europa y luego tienes que hacer clic en crear una app. Por lo que ahora hemos creado una obligación. Hay alguna instrucción que tenemos que hacer primero. En primer lugar necesitamos descargar e instalar Heroku CLI. Vamos a este enlace y comprobarlo. Por lo que en este enlace se pueden ver múltiples opciones para instalar Heroku. Entonces por ejemplo, tienes forma de macOS, puedes usar comentario si tienes Homebrew y también si tienes Windows, puedes instalar un instalador. Y también para abrir A esa manera, que me gusta usar siempre es usar NPM, NPM global instalado. Por lo que puedes hacer npm instalar dash global, Heroku. Entonces vayamos a París y hagamos eso. Entonces iré aquí y abriré mi terminal. Usaré el botón Control J como vimos anteriormente. Y entonces diré npm instalado menos g. Así que de esta manera, instalaré dispositivo de dominio Heroku público, para poder usar comandos de Heroku en mi máquina. Pero lo primero que tengo que hacer es quizá necesitamos tener unos permisos. Entonces los permisos, tal vez no te permitirá instalar público o globalmente. Necesitas prefijar este comentario con sudo. Entonces como ven aquí, no
soy r No
tengo permisos para hacer eso, así que necesito prefijo este comando con sudo. Entonces podemos decir sudo nmap, pero en Windows, creo que no tendrás ningún problema. Y entonces me pedirá mi contraseña. Y luego pondré la contraseña y se instalará con éxito. Ahora, como ven, se instaló, tenemos ahora comando Heroku. que puedas, por ejemplo, poner a Heroku así y obtendrías un comando como opciones que tienes, algunas opciones que puedes usar para tus comentarios de Heroku. Así que vuelve a nuestro navegador. Después de la instalación, volvemos a nuestra aplicación y tenemos que hacer una buena edición. Y además, tenemos que conectar nuestro proyecto Heroku o nuestro proyecto back-end con Heroku git. Pero antes que nada, más importante porque antes de hacer este paso, tienes por supuesto, para crear un archivo gitignore. Entonces, por ejemplo, en Heroku, no
voy a desplegar este archivo final. Este archivo m contiene mi cadena de conexión a base de datos es mi secreto y también URL API. No voy a empujar eso al repositorio de git de Heroku. Entonces de esta manera, necesitamos agregar un archivo que se llama git ignore. Entonces cuando uso un buen comentario de Heroku, entonces no va a empujar esos archivos que especifico. Por lo que también, no tienes que empujar módulos de nodo. Los módulos de Monod vienen normalmente un archivo muy enorme, casi 200 megabytes, porque estamos instalando bibliotecas y sus dependencias. No tienes que usar los módulos Node también. Por lo que crear archivo get ignorado, Es muy sencillo. Basta con crear un archivo en la raíz del proyecto. Por lo que hay que decir git ignore antes de hacer cualquier paso que se menciona ahí. Por lo que primero, es necesario ignorar carpeta de módulos de nodo. Por lo que decimos slash node underscore módulos. Y además tenemos que ignorar el archivo m-y también otros archivos de desarrollo como guapa RC, como ven aquí, tenemos este archivo para que podamos ignorarlo también. Entonces en ese caso, tenemos, estamos,
estamos listos para conectar nuestro proyecto con el repositorio de Heroku. Entonces volvemos a las instrucciones y tenemos que decir mete en ello. Porque si no hemos inicializado nuestro proyecto previamente ya que vimos que no tenemos un bien, No lo conectamos a ningún bien. Entonces en ese caso, tenemos que decir conseguir cualquiera, vale, Después de que sí te
metes en él, verás que hay un archivo creado en este repositorio el cual va o
se llama como punto kid. Y si lo quieres ver, puedes ir aquí a la carpeta backend y verás que esta carpeta y se creó. Por lo que la siguiente instrucción necesitamos conectar Heroku git remote. Pero primero necesitamos usar el login de Heroku. Entonces, primero veamos a Heroku. Entonces usaré el login de Heroku y luego me preguntará, ¿quieres abrir el navegador y puedes iniciar sesión entonces. Por lo que no podemos decir que sí, podemos presionar cualquier tecla y luego se abrirá automáticamente el navegador. Entonces como ven aquí, tengo otra página. Está diciendo mirar a Heroku CLI. Diré buscar y luego iniciar sesión porque estoy previamente conectado en el mismo navegador. Por lo que cuando regrese a la terminal, sabrá
que ya se ha conectado y luego podrá utilizar los comandos de Heroku, como se menciona en la documentación. Después de eso, necesitamos conectar nuestro Heroku o nuestro proyecto al repositorio de git de Heroku. Entonces necesitamos usar este comando, todos estos comandos, puedes usarlos como ves, digamos Heroku, git remote, y luego agregar E sharp back y blue bits. Por lo que es exactamente el mismo nombre de la aplicación. Entonces hagámoslo. Y luego basamos aquí este comentario. Y luego, como veremos eso, está bien, el repositorio de Git está configurado en este camino. Entonces ahora cuando vamos a desplegar nuestro proyecto o subir nuestro código para manejar cool, entonces Heroku obtendrá o leerá todos sus archivos y el código que hemos subido de esta ruta. En la próxima conferencia, vamos a ver cómo podemos crear también una base de datos de producción. No tenemos que usar la misma base de datos que vemos porque tal vez esta base de datos podemos diferenciar entre desarrollo y producción. Como veremos en la próxima conferencia.
62. Base de datos de producción opcional: De acuerdo, en esta conferencia vamos a hablar de crear una base de datos de producción. Entonces cuando estás haciendo un desarrollo o cuando haces alguna aplicación, normalmente tienes una base de datos espacial para ti, para solo desarrollar y probar cosas y hacer un progreso para tu aplicación. Pero después de desplegar el proyecto para vivir, entonces hay que crear una base de datos de producción. En este curso, esto es opcional para que usted cree base de datos en vivo, base datos de
producción o no. Entonces en esta sección o en esta conferencia, vamos a hacer eso. Si recuerdas, hemos instalado MongoDB Compass y esta aplicación MongoDB Compass, podemos ser capaces de crear bases de datos y también podemos importar y exportar datos a ella. Entonces en nuestro curso estábamos usando esta base de datos, que se llama base de datos de e-shop. Ahora vamos a crear uno nuevo. Podemos llamarlo E agudo también, base de datos. Y sería una producción amplia. Entonces podemos tener eso y podemos crear la primera colección, que se llamará, por ejemplo, categorías. Y luego hacemos, creamos para la base de datos, y se crea la base de datos. Entonces como ven aquí, pero sólo tenemos una mesa. Entonces si recuerdas, te adjunto al inicio del curso, algunos archivos, puedes usarlos como datos predeterminados. Es como los datos que estamos insertando hacen la base de datos. Es como sembrar. Por lo que podemos usar también la siembra que así aquí. Entonces lo haré rápidamente. Entonces, ¿cómo importar datos usando una brújula? Solo tienes que ir aquí, click en categorías, por ejemplo, en el nombre de la colección. Y luego se puede decir datos de importación. Y luego navega hasta el archivo donde te di. Entonces te di, por ejemplo, categorías o los ítems y otras tablas. Entonces para eso, puedes usar para estas categorías y tienes que especificar aquí que tienes JSON. Y ahora estamos haciendo importación. Y esta importación se completó. Y veremos que nuestros datos se encuentran aquí. Por lo que haremos lo mismo para todas las mesas. Voy a hacer eso rápidamente frente a ti. Por lo que creé aquí una nueva tabla. Yo lo llamo usuario, o usuarios. Y estos usuarios, voy a importar esos datos también. Entonces tenemos que hacer lo mismo para todas las demás mesas. Por lo que ahora mi producción de base de datos está llena. Entonces vamos a utilizar esta base de datos, pero sólo estamos para su aplicación de producto
o esa aplicación desarrollada en el desarrollo local de Heroku, seguimos usando el tema de la base de datos. Entonces cómo podemos hacer eso dinámicamente, como cuando implemento ISA a la aplicación utiliza base de datos. Pero cuando estoy desarrollando, quiero decirle a la aplicación,
vale, usa esta base de datos. Entonces es bastante simple. Vamos a configurar esas variables de entorno las cuales son preferidas para Heroku porque vamos a usar estas variables y las usamos dentro de la aplicación. Y en el desarrollo, podemos mantener, por ejemplo, esta cadena de conexión. Pero en producción vamos a tener otra cadena de conexión. Pero aquí como ves ese archivo de entorno no se despliega porque agregamos a git ignore. Entonces esto no estará en el despliegue en Heroku porque Heroku no sabrá que tenemos archivo de entorno aquí.
63. Ajustar el desarrollo y las variables del entorno de productos: De acuerdo, ahora cómo podemos decirle a la aplicación que use esa base de datos de producción, no la base de datos del desarrollo. En primer lugar, si recuerdas, agregamos el archivo m-y en el archivo final lo estábamos usando para conectarnos a la base de datos que hemos creado en MongoDB Atlas. Por lo que la cadena de conexión se almacena en el archivo m como se ve aquí, y ya hablamos de eso anteriormente. Por lo que ahora vamos a tener una cadena de conexión diferente para la producción. Entonces en ese caso, de acuerdo, estamos usando esta cadena de conexión aquí en conexiones de proceso para hacer. Pero como les dije que cuando vamos a desplegar esta aplicación, este módulo m-file, más bonito, IC y Node, no se
subirán al servidor. Entonces desde donde se implementó la aplicación sabrá qué cadena de conexión usar. Porque en ese caso cuando
implementa, no sabrá qué cadena de conexión usar porque aquí estará indefinida. Y entonces tendremos un error de conexión. Entonces para eso, cambiemos primero todo lo que tenemos, como dos o en nuestro app.js, todo lo que necesitamos cambiar para estar en producción. Por ejemplo, este nombre, voy a usar una base de datos pero en el extranjero, no esta. Por lo que tenemos que cambiar eso también. También tenemos que usar alguna, otra variable, que podemos llamarla dB nombre, por ejemplo. Y podemos dar este nombre DB en el archivo. Entonces podemos, después de que esa fue una línea, podemos decir nombre DP. Y luego para local, tendré que usar esta base de datos de e-shop. Pero en producción vamos a usar una diferente. De acuerdo, ¿qué más? Por lo que la aplicación también está usando un puerto específico. Entonces cuando inicias la aplicación en producción, como ves aquí, cuando vamos al navegador a nuestra aplicación y usamos,
decimos, por ejemplo, abrir la app aquí en la parte superior. Entonces tendremos una nueva app. Como ven aquí, tenemos el enlace, pero no contiene ningún puerto ni como por ejemplo, 3000 o algo así. Porque antes teníamos como anfitrión local como este y 3000. Entonces no tenemos la pizarra aquí. Entonces cómo también podemos hacer que el tablero sea dinámico. Por lo que necesitamos hacer eso también porque en la producción usará un puerto diferente. Entonces así aquí tenemos que definir una variable. Podemos darle como una constante y decimos puerto. Y este puerto vendrá también de variables de entorno. Y se le llamará puerto. Si no hay puerto, entonces use 3000. Entonces por si acaso si esta parte no viene o viene con indefinido. Entonces entonces usamos esta pizarra aquí. Y en mi archivo puedo definir ese puerto. Por lo que podemos decir también aquí, usar el puerto, podemos decir que el puerto será 3000. Pero recuerda, esto es sólo para el desarrollo local. No tenemos para eso para la producción. Producción lo sustituirá por otro puerto. Pero la palabra clave para eso se comprará así. Por lo que Heroku encontrará o creará un puerto por su cuenta. Normalmente, es el puerto 80, que es el puerto predeterminado para el HTTP. Ok, ahora tenemos un problema. Entonces cómo la producción sin variable de cadena de conexión. Entonces cómo podemos crear eso. Por lo que vamos de nuevo al navegador donde hemos creado nuestra aplicación. Y luego encontraremos en la parte superior algo llamado actividad o ajustes. Y en su configuración encontrarás un revelador config vars. Por lo que esos son los vars de conflicto que se utilizarán en la producción. Entonces en ese caso, necesito decirle a mi aplicación aquí, usa la cadena de conexión, pero somos uno de producción. Por lo que volveré a ir al navegador y luego crear una nueva cadena de conexión clave será lo que será. El enlace se está quedando igual pero con base de datos diferente. Entonces usaré el mismo. Y entonces diré que no use base de datos de e-shop, pero cada uno de eso obedece en el extranjero. Y además, necesitamos también crear otra cosa que se llama nombre DP. Vamos a usar ese nombre agudo, que la base, así que aquí también, e-sharp, que obedece a amplio también. Entonces en ese caso, la aplicación sabrá que hay una cadena de conexión y la leería desde aquí. Entonces no tenemos que preocuparnos por eso. Por lo que también es mejor agregar todas las variables de entorno a la conexión porque de lo contrario nuestra aplicación fallará. De lo que tenemos que usar aquí, API URL, que será lo mismo que teníamos ahí. Será api slash v1 y lo estamos agregando secreto. El mismo. También debe ser las mismas letras mayúsculas o minúsculas porque es sensible a mayúsculas y minúsculas. Y vamos a tener aquí el secreto o puedes usar otro secreto. Entonces cuando despliegue mi aplicación, entonces buscará proceso. Pero nuestro error local no se despliega porque lo tenemos en el buen ignorar. Por lo que no estará en el servidor para que Heroku no sepa por trabajo para conseguirlo. Irá a los vars de conflicto y luego leerá esos valores. Por lo que en este caso, tenemos una base de datos diferente a la producción y una base de datos para el desarrollo local. En la próxima conferencia, vamos a ver cómo podemos usar eso y cómo podemos desplegar la aplicación al servidor.
64. Deploy la aplicación y prueba lo de la aplicación: Ahora volvamos a la instrucción de desplegar la aplicación. Entonces aquí si volvemos a la aplicación y hacemos click en Desplegar, y volveremos a ver nuestra instrucción. Entonces ya hicimos esa conexión y hemos desplegado o hacemos el enlace entre la aplicación y el repositorio Git de Heroku. Ahora vamos a ejecutar esos comentarios. En primer lugar, necesitamos agregar el código al bien, por lo que necesitamos comprometerlo. Entonces si no sabes qué es,
Es como si estuvieras dando información, como en qué código estás comprometiendo con tu repositorio. Entonces cuando hago cambio, digo, vale, cambié este, elimino eso. Por lo que diría en el mensaje de commit que quitar el manejador de errores. Por lo que de esa manera haces un seguimiento de tus cambios en el proyecto. Entonces aquí podemos hacer eso también con Heroku. Entonces tenemos que hacer git add dot y luego git commit dash am, hacerlo mejor o cualquier mensaje. Entonces, antes que nada, hagamos el bien. Significa esto que estamos agregando todos los archivos del proyecto al repositorio
de Git para prepararlos para subirlos al servidor. Y luego después de eso, tenemos que hacer el git commit y luego guiar m. Y luego puedes especificar un mensaje. Entonces por ejemplo, desplegar primero, morir. Por lo que también podemos agregar este mensaje de compromiso. Después de eso, necesitamos empujar el código a la cetera. Nosotros somos como hacemos eso con este comando, git, push, heroku, master. Entonces iré a la terminal y luego pegaré aquí este comando. Y luego va a subir toda la información o todo el código que especifiqué, excepto los archivos o los archivos y carpetas que especificé en git ignoran. Entonces en ese caso, tendremos todos nuestros archivos de desarrollo están ahí. Entonces como ves aquí, es
dardo, no despliegues la aplicación, los archivos terminados, it, empiezan a construirla. Y ahora está mostrando todo el progreso instalando bibliotecas. Hace así npm instalar para la
instalación los paquetes que utilizamos para nuestra aplicación. Y entonces tendrá módulos Node, pero en el servidor, no éste. Entonces después de eso comprimirá la aplicación para un uso más rápido. Y también hay que recordar subir las imágenes que están en la carpeta de carga para que podamos ver las imágenes también en el, en el servidor. Entonces de lo contrario, si no tienes esas imágenes que adjunté como para ti también, porque están en la base de datos también, los enlaces a esos mensajes o imágenes. Necesitas subirlas también a tu servidor. Por lo que ese despliegue terminó, verificando despliegue, hecho. De acuerdo, Volvamos al navegador y vayamos a la aplicación y actualicemos aquí. Bonito. Tenemos mensaje, el usuario no está autorizado. Eso es genial porque si recuerdas, hemos autorizado nuestra API. Entonces si recuerdas en las rutas o en los ayudantes, dijimos JWT que vamos a excluir algunas rutas de la autenticación, por ejemplo, en conseguir un producto o conseguir unas categorías. Entonces intentemos conseguir un producto en el navegador. Entonces diré aquí exactamente si recuerdas cómo lo estábamos haciendo con host
local y 3000 y luego pongo API v1, y luego pongo productos por ejemplo. Entonces esto es como una solicitud de get cuando lo intentas, Vale, Tenemos todos los datos de nuestra base de datos. No puedes probar eso tan bien como Cartero, si recuerdas, tenemos estuvimos trabajando mucho con el cartero y estuvimos probando nuestra API en Cartero. Entonces aquí abriré una nueva pestaña para una nueva solicitud GET, y luego pondré este enlace. Por lo que el enlace de mi aplicación API, producto v1. Entonces será exactamente como lo estoy haciendo de anfitrión local. Por lo que se ve que toda esta información se almacena y estamos usando la base de datos de producción. No estamos usando la base de datos que teníamos para local. Entonces para demostrar eso, Hagamos un cambio en la base de datos usando brújula. Por lo que iré a mi solicitud,
seguiré a la base de datos de producción. Daré click en esto y abriré los productos. Y voy a ir al que empieza con, me acuerdo como mol, algo así. Entonces aquí lo pequeño, se ve aquí lo pequeño y esto es. Entonces cambiemos eso. Podemos decir cambiar esta frase. Vamos a la, por lo que hacemos click en la pequeña aquí y podemos decir, por ejemplo, en el extranjero. Entonces podemos hacer esto más grande y decir producción. Por lo que podemos añadir aquí esta palabra producción. Entonces después de actualizar, y luego vamos a Cartero, y luego hacemos click en Enviar. De acuerdo, tenemos aquí producción. Entonces esta es la prueba de que estoy usando la amplia base de datos, pero en mi host local, Vamos a tratar de ejecutar la aplicación en local. Entonces podemos decir npm start como estábamos ejecutando la aplicación localmente, ok, El localhost 3000, todo está bien. Ahora vamos a solicitud GET, pero en el anfitrión local. Entonces tenemos aquí, por ejemplo, localhost 3000 productos API. Y luego si lo llamamos, veremos que
estamos llamando a la base de datos, que está en el host local. Y si revisamos esta base de datos, iré aquí. Y revisaré este número de base de datos. Ir a productos. Tendré muchos productos ficticio que estuvimos utilizando durante el desarrollo. Entonces en ese caso, estamos diferenciando cada vez que despliegué a mi aplicación cosa pulgar, ¿
puede entonces va a utilizar una base de datos de su producción. Por ejemplo, voy a cambiar algo aquí. Voy a añadir un registro de consola. Qué ejemplo de registro de consola. Al igual que usar, estamos usando. Por ejemplo, puedes poner adicional y luego puedes usar el nombre de DB aquí. Entonces cuando guarde, vale, en mi local, diré que estamos usando base de datos de e-shop, pero necesitamos desplegar eso. Por lo que aquí, nuestro anfitrión local, local, tenemos base de datos de e-shop, como sabemos para el desarrollo. Pero si desplegamos esto, obtendríamos, estamos usando el tema de base de datos traído té o producto. Entonces de esta manera, cómo podemos empujar cambios, de nuevo, necesitamos poner git add y luego agregamos un mensaje. Entonces por ejemplo, comentarios, podemos decir cambio, y luego presionamos enter, y luego usamos nuevamente push common. Entonces git, empuja heroku master, se desplegará de nuevo. Entonces como ven aquí, se está desplegando de nuevo. El mismo proceso que vimos en el primer paso. Ahora está terminado el despliegue. Cómo podemos ver que, por ejemplo, este mensaje que estamos usando, como la base de datos, usted, me refiero a cómo podemos ver el registro de la consola o los errores que vemos en el desarrollo. Para ver que puedes ir fácil Dos más aquí, y puedes consultar aquí un registro de vista. Por lo que cuando haga clic en él, verá todos los registros como se están desarrollando localmente. Entonces decimos aquí, estamos usando base de datos de e-shop en el extranjero. Entonces eso muy grandioso y exactamente cómo estábamos teniendo la aplicación en local y así, hará como el monitoreo para nuestra API. Entonces cuando llamo a esta API, entonces voy a los registros. Ya lo veré, vale, tenemos información Obtener productos API v1 y alguna otra información sobre la solicitud y devolución y cuánto tiempo tardó. Pero si vamos a la base de datos, necesitamos, por ejemplo, revisar una imagen. Entonces iré aquí e iré a la base de datos y tengo productos. Tendremos un problema con las imágenes. Entonces si recuerdas, hemos subido algunas imágenes con nuestro e-sharp. Entonces cuando vaya aquí, veré que en el producto, aún
tienen este localhost 3000. Desafortunadamente, esto no es posible reemplazarlo. Por lo que necesita reemplazar todas esas cadenas que están relacionadas con el host local. Es necesario reemplazarlos anualmente con el enlace que se proporciona para su solicitud. Entonces en ese caso, voy a ir aquí a mi solicitud y luego copiar esta parte que es de aquí to.com. Entonces copiaré todo esto. Y luego volveré a ir a ese campus. Y que juegue de HTTP a localhost. También el puerto no es necesario y luego añadiré actualizar o actualizar esta parte aquí. Por lo que hacemos click en Actualizar y luego se actualizará. Entonces cuando vaya ahora a la aplicación y pegue la URL de la imagen, entonces podré ver la imagen con éxito. De lo contrario, todas las imágenes, desafortunadamente, siguen en localhost 3000. Por el momento que en base a tu nombre de tu aplicación, necesitarás reemplazar todo esto para la base de datos. Por supuesto, después de usar esta base de datos, por ejemplo, en algún front-end o cuando vamos a usar Postman por ejemplo, cuando voy a publicar un producto usando esta URL API, subirá la imagen en base a esa URL, por lo que se almacenará en la base de datos así. Pero debido a que estábamos usando esta base de datos en desarrollo, hay
que hacerlo manualmente. Porque también, estábamos usando cuando estamos publicando un producto. Si recuerdas, si vamos a publicar el producto y en el post producto estábamos haciendo como la imagen usando el host. Obtengo el host actual y luego pongo el resto aquí para almacenar la ruta de la imagen. Por lo que el host será tomado del host que está utilizando y llamando a la API desde. Entonces en ese caso, no tienes que preocuparte por los enlaces que queremos subir para los archivos subidos. Por lo que ahora tenemos una API totalmente funcional en el servidor. Se desplegó la aplicación. Por supuesto, si quieres eliminar este Heroku.com y crear tu propio dominio, no
es de forma gratuita. Tienes que pagar por eso. Y por supuesto, puedes tenerlo bajo tu propio dominio. Entonces en la aplicación front-end o cualquier aplicación front-end, cuando se va a implementar la aplicación front-end, no su Web API. Se puede decir que para mi aplicación en el front end en producción, use esta URL API para todos como la aplicación. Y luego cuando tu aplicación se despliegue, se conectará a esta API y agarrará los datos desde ahí.