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 40

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.

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

Para poder hacer los request en insomnia, primero deben tocar el bot贸n 鈥淐reate鈥 y luego 鈥淩equest Collection鈥. Luego pueden seguir todos los pasos de la clase 馃槃

Que rico que es aprender 馃ぉ

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

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())

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
![](

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)

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 鈥淏ody鈥, en la secci贸n 鈥淩aw鈥, seleccionando JSON como formato de entrada.

Pueden encontrar m谩s en la documentaci贸n oficial: Enlace

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

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 鈥樷榖ody鈥欌 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.
鈥淣o 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.

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

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.