No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

POST: método para crear

11/27
Recursos

Aportes 43

Preguntas 30

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Si estan usando Postman, para que de aca en adelante les sea mas facil utilizar las rutas puden crear sus Variables de Entorno.

Si apretan en ese ojito pueden agregar un nuevo grupo de varibles. En variable le damos el nombre de url y como initial value le ponemos

http://localhost:3000/api/v1

Luego para usarla en el campo de url hacemos {{url}}/products y listo 💪

Middleware:
⠀⠀
El término middleware se refiere a un sistema de software que ofrece servicios y funciones comunes para las aplicaciones. En general, el middleware se encarga de las tareas de gestión de datos, servicios de aplicaciones, mensajería, autenticación y gestión de API.
⠀⠀⠀
Ayuda a los desarrolladores a diseñar aplicaciones con mayor eficiencia. Además, actúa como hilo conductor entre las aplicaciones, los datos y los usuarios.

Para poder hacer los request en insomnia, primero deben tocar el botón “Create” y luego “Request Collection”. Luego pueden seguir todos los pasos de la clase 😄

Que rico que es aprender 🤩

Por qué versionar tu API?

La razón de versionar nuestras API es para que no haya conclicto del servicio con las distintas plataformas que puedan usarlo ( Mobile nativo, IoT, Web).

Supongamos que haces un cambio de la API para mobile, simplemente le asignas un router con la v2 y dejas lo demás con la versión v1

Ejemplo

function routerApi(app) {
  const router = express.Router();
  router.use('/products', productsRouter);
  router.use('/users', usersRouter);
  router.use('/categories', categoriesRouter);
  app.use('/api/v1', router)
}

Enviar datos (POST)

Para esta clase necesitaremos un API development enviroment pueden ser Insomnia o Postman.

Lo primero que debemos hacer es crear la forma en como el servidor tratará la petición de tipo POST, en este caso lo hicimos en el endpoint de products de esta manera:


const express = require('express');
const router = express.Router();

router.post('/', (req, res) => {
  const body = req.body;
  res.json({
    message: 'created',
    data: body
  })
})

Luego usamos insomnia y le enviamos los datos que queremos testear:

{
	"name": " New Product",
	"price": 1209
}

Veremos que nos aparece el json de respuesta pero solamente con el valor de message: 'created'.

Esto es porque necesitamos aplicar un midleware nativo de express.

//index.js
app.use(express.json())

A mi se me ocurrió la siguiente forma de solucionar el reto:

Amigos le quería recomendar esta extension de VS code, que sirve igual que Postman y esta en el mismo editor, la verdad vale la pena probarlo, además que tiene la función de mostrarte el tiempo de la respuesta y guarda el historial de todas las peticiones que haya realizado, se llama Thunder Client
![](

Para llevar a cabo el proceso en postman, la configuración en el código es el mismo. En cuanto al cliente(postman) el POST se crea desde “Body”, en la sección “Raw”, seleccionando JSON como formato de entrada.

Pueden encontrar más en la documentación oficial: Enlace

express.json()
  • es un método incorporado en express para reconocer el objeto de solicitud entrante como objeto JSON. Este método se llama como middleware en su aplicación usando el código:
app.use(express.json());

Fuente aca (dame click)

Si ponen el app.use(express.json()) despues del routerApi(app), no les va a funcionar, tiene que ir antes

Hola a todos.

Para los que tengan el siguiente error:

Deben de tener cuidado de la estructura de su JSON. NO ES UN OBJETO DE JAVASCRIPT. Por lo tanto, no deben dejar comas al final. Ni caracteres extraños:

Puede ser desde:

{
	"name": "Nuevo Producto",
	"price": 250
}

Hasta:

{
	"message": "Hola"
}

Incluso lo pueden enviar vacio y funcionara:

{ }

Diferencias Principales

  • El método GET coloca los parámetros dentro de la URI mientras que el método POST los agrega al cuerpo.
  • GET se utiliza esencialmente para obtener la información. En cambio, el objetivo del método POST es actualizar los datos.
  • Los resultados de la consulta POST no pueden marcarse, mientras que los resultados de la consulta GET pueden marcarse porque existen en forma de URL.
  • En el método GET la información es visible en la URL lo que aumenta las vulnerabilidades y el riesgo de hacking. Por el contrario, el método POST no muestra variables en la URL y también se pueden utilizar múltiples técnicas de codificación, lo que lo hace resistente.
  • Cuando se utiliza el método GET en el formulario, sólo se aceptan caracteres ASCII en los tipos de datos. Por el contrario, el método POST no enlaza tipos de datos de formulario y permite caracteres binarios y ASCII.
  • El tamaño variable en el método GET es de aproximadamente 2000 caracteres. A la inversa, el método POST permite hasta 8 Mb de tamaño variable.
  • Los datos del método GET se pueden almacenar en [caché], mientras que los datos del método POST no.

Este curso esta brutal. Estoy llenando lagunas mentales que tenía desde hace tiempo.

Middleware o lógica de intercambio de información entre aplicaciones, o Agente Intermedio, es un software que asiste a una aplicación para interactuar o comunicarse con otras aplicaciones, o paquetes de programas, redes, hardware o sistemas operativos.

Lo hice de la siguiente manera:

  1. Usando el fs (FileSystem), lei todos los archivos creados en el folder de routes
  2. Iteré sobre todos los archivos creados
  3. Importé cada archivo de rutas
  4. Hice un split para tomar el nombre del archivo (que luego será el path de dicha cada ruta)

Con esta estrategia, cada que se agregue un nuevo archivo de rutas, automáticamente se creará la ruta sin necesidad de agregarlo manualmente

const express = require('express');
const fs = require('fs');

function apiRouter(app) {
  const router = express.Router();
  app.use('/api/v1', router);

  fs.readdirSync('./src/routes').forEach(function (file) {
    const routeFile = require(`./${file}`);
    const fileName = file.split('.')[0];
    router.use(`/${fileName}`, routeFile);
  });
}

module.exports = apiRouter;

Por alguna razón con postman me devuelve la data vacía. Funciono con otros programas. Recomiendo la extensión de VSCode que publicó otra persona abajo Thunder Client

yo me descargue una extensión en vscode que se llama Thunder client, hace lo mismo que posman sin abrir nada adicional.

También se pueden recibir solamente los atributos que deseo renderizar y no todo el objeto:

El profe trae en el método post el objeto ‘‘body’’ y lo renderiza nuevamente todo ```
----> const body = req.body

Pero si no deseo todo el objeto puedo desestructurar el objeto y traer solo los parametros que necesito

------> const { name, price } = req.body;

Esto es importante debido a que no siempre voy a requerir renderizar  o tomar todo lo que me ingresan por body sino algo en expecifico

Recomiendo usar Chance en lugar de Faker, parece que algo pasó con esa librería.
“No les cuento más…”

puede ser tonto pero por esto perdí casi 20 minutos, al agregar el middleware, asegurense de que sea ANTES del routerApi, si se agrega después, no va a funcionar. `app.use(express.json());` `routerApi(app);`
El insomnia que yo baje no está de acuerdo con el que el profesor muestra

Buenas les muestro una alternativa, de postman, es una extension para vscode
te permite hacer tambien consultas de todo tipo.

Yo use para esta clase la extensión rapidApi de VS

Se ve tan pro usar postman

> "Hola, Recomiendo mucho usar la extensión de **Thunder Client **en Vs code. Permite hacer todos los métodos de REST sin necesidad de salír del editor. Es muy recomendable. Pueden hecharle un ojito yendo al link. O(∩_∩)O
Link: https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client "
BUENISIMA RECOMENDACION!!!

Otra que pueden usar es la extensión de Thunder Client para VSCode y funciona igual que Postman o Insomnia.

Me llegaba vacío el body pero tuve que agregar esto y me funcionó `app.use(``express``.urlencoded({ extended: ``true ``}));`
El middleware `express.json()` es fundamental para procesar cuerpos de solicitud en formato JSON. Este middleware permite que tu aplicación Express reconozca y maneje automáticamente las solicitudes con contenido JSON. Al usarlo, los datos del cuerpo de la solicitud se parsean y se asignan a `req.body`, facilitando así el acceso a esos datos en tus rutas. Por ejemplo: ```javascript const express = require('express'); const app = express(); // Usa el middleware para parsear JSON app.use(express.json()); app.post('/productos', (req, res) => { const nuevoProducto = req.body; // Accede a los datos JSON res.status(201).json({ message: 'Producto creado', data: nuevoProducto }); }); ``` Esto es esencial para trabajar con APIs RESTful, como se explicó en la clase del curso de Backend con Node.js.
Aqui les dejo mi hoja de rutas: ```js import settings from '../config/settings.js'; import { Router } from 'express'; // App routes import paymentMethodRoutes from './paymentMethods.routes.js'; import userRoutes from './users.routes.js'; import productRoutes from './products.routes.js'; const prefix = settings.API_PREFIX; const routes = { v1: [ { path: '/payment-methods', routes: paymentMethodRoutes, }, { path: '/users', routes: userRoutes, }, { path: '/products', routes: productRoutes, }, ], } function setRoutes() { Object.entries(routes).forEach(([version, routes]) => { const router = Router(); // Set routes this.use(`/${prefix}/${version}`, router); for (const route of routes) { router.use(route.path, route.routes); } }); } export default setRoutes; ```
Va tres veces que repito el curso y es muy mala la explicación entre tantos archivos ,se pierde uno mucho

Un detalle importante a la hora de crear el POST con json en insomnia es de usar las comillas dobles (" ") y no las simples (’ ') porque sino les arrojara un error!

Al momento de hacer get me aparace un error de typeerror: cannot read properties of undefined (reading 'productName') en la línea 12 de products.router, sin embargo al revisar la línea y comparar tengo el mismo código: name: faker.commerce.productName() Sin embargo si me deja hacer post. Le ha pasado a alguien más?? Muchas gracias.
**¿Como crear variables de entorno en Insomnia?** Damos click al engrane ![](https://static.platzi.com/media/user_upload/image-16de34ef-6db8-423c-b4db-a7c471ac0c23.jpg) Se nos abre una ventana asi ![](https://static.platzi.com/media/user_upload/image-412f81e6-758d-45ba-81a2-59a38b744e48.jpg) Agregamos la ruta que queremos guardar en una variable ![](https://static.platzi.com/media/user_upload/image-0934ea61-7672-40c2-b7a7-82a05edc1042.jpg) Finalmente para usarla dentro de nuestras peticiones, damos a *crtl + esapcio* y vemos la variable ![](https://static.platzi.com/media/user_upload/image-1001e917-028d-42e3-9e10-20c20dbdbe93.jpg) Ahora la peticion quedara asi ![](https://static.platzi.com/media/user_upload/image-c231095f-c124-4ea9-9b88-55d4b3d05d8b.jpg)
Thunder client funciona genial!!

deberían reorganizar el curso de tal forma que se expliquen primero los middlewares antes que estos otros temas.

hola no he podido continuar con el taller error 768 no puede traer el schema para package json gracias por su ayuda

Excelente explicación sobre las rutas maestras y el path global para poder dar de manera sencilla mantenimiento a nuestra aplicación

Solucione el reto de la siguiente manera, pensando en más adelante poder agregar una base de datos.

Con vs code también se pueden hacer request yo uso Postcode

😲 Que util es la composición de routers. No sabia que esto era posible

En mac en el centro superior tiene 3 opciones, debug para la clase.