Explorar el mundo del desarrollo web implica entender la importancia de las rutas. En cualquier sitio web que visites, notarás la presencia de múltiples rutas como /contacto, /categorías, o /productos. Estas rutas son esenciales para la organización y funcionamiento de una aplicación web. Utilizando Express, un popular framework para Node.js, podemos manejar y definir fácilmente estas rutas para nuestra aplicación.
¿Cómo crear una ruta básica en Express?
El punto de partida al trabajar con Express es establecer nuestras rutas de forma clara y sencilla. Cuando accedes a localhost:3000 o al puerto que hayas configurado, te encuentras con la ruta principal, que en nuestro caso muestra "Hola Mi Server en Express", debido a la configuración por defecto. ¿Qué sucede si queremos crear una nueva ruta? Supongamos que deseamos definir una ruta llamada /nueva-ruta. Podemos hacerlo de la siguiente manera:
app.get('/nueva-ruta',(req, res)=>{ res.send('Hola soy una nueva ruta');});
Añadir una ruta como /productos es igual de sencillo:
app.get('/productos',(req, res)=>{ res.send('Queremos los productos');});
¿Cómo responder con diferentes tipos de formatos?
En desarrollo de servidores, no solo es importante la creación de rutas, sino también el tipo de respuesta que enviamos a nuestros usuarios. Aunque inicialmente podríamos responder con un simple string, lo más útil y común es hacerlo en formato JSON (JavaScript Object Notation).
Al responder con JSON, facilitamos la comunicación con aplicaciones front-end o móviles. Por ejemplo, podríamos definir una respuesta en JSON en nuestra ruta /productos como:
Esta estructura permite que nuestros datos sean más comprensibles y estructurados, especialmente al manejar APIs.
¿Cómo visualizar mejor los JSON?
Trabajar con JSON complejos puede ser un desafío si no empleamos herramientas adecuadas para su visualización. Por lo tanto, te recomendamos instalar una extensión que te ayude a ver los JSON de manera organizada. Para usuarios de Google Chrome, JSON Viewer es una excelente opción. Sin embargo, si usas otro navegador, busca extensiones semejantes que optimicen tu experiencia.
Una vez instalada la extensión, recargar las páginas con JSON se vuelve una experiencia más fácil de manejar, ya que permiten ver detalles de las peticiones de forma clara.
¿Cómo practicar la creación de rutas?
La mejor forma de aprender es practicando. Te desafío a que en tu aplicación crees rutas adicionales como /categorías o /inicio. Experimenta con las respuestas, ya sea en texto plano o en formato JSON. Además, comparte en los comentarios cómo fue tu experiencia al instalar el plugin para JSON.
Toma estos conceptos básicos para avanzar en tu dominio de Express y sigue explorando nuevas posibilidades en el desarrollo de aplicaciones web robustas y eficientes. Y recuerda, ¡este es solo el inicio de un fascinante viaje en el mundo de las APIs RESTful!
¿Quieres compartir tu servidor con tu familia pero no lo pueden ver en sus celulares? :/ :/
Traté de compartir esto como comentario pero era un poco largo xd, aquí dejo un mini turorial en platzi para que despliegues tu servidor en tu red LAN y puedas compartir tus hello worlds con tu familia :D :D :D
excelnte!
Excelente para refrescar conocimientos...
Express ocupa el metodo get, para recibir las rutas en el servidor
Se puede responder con un mensaje
res.send('Contenido de respuesta');
O una respuestas en formato JSON
res.json({name:'Producto 1',price:1000});
Se recomienda instalar el plugin
JSON Viewer
Buen resumen
req y res
req es un objeto que contiene información sobre la solicitud HTTP que provocó el evento. En respuesta areq, usa respara devolver la respuesta HTTP deseada.
REQuest >> peticion
RESponse >> respuesta
el routing se se refiere a determinar cómo una aplicación responde a una solicitud de cliente a un punto final en particular) y un método de solicitud HTTP específico.
La definición de la ruta adopta la siguiente estructura:
app.METHOD(PATH,HANDLER)
app es una instancia de express.
METHOD es un método de solicitud HTTP, en minúsculas.
PATH es una ruta en el servidor.
HANDLER es la función ejecutada cuando la ruta coincide.
Para los que gustamos un poquito mas del estilo Dark, acá un pequeño aporte sobre JSON Viewer:
Vamos a la configuración de la extension:
En el selectTheme tenemos una sección de estilos Dark a escoger:
Por último, a disfrutar de su nuevo dark theme... 🤗🤗🤗
Nice one!!
Checa la documentación de Express.js relacionada con Routing y así entender qué es. cómo funciona y cómo puedes usarlo para desarrollar tus apps
en firefox no es necesario instalar ningun tipo de plugin, se abre automaticamente, adjunto foto:
!resultado de json nativamente en firefox
aunque si les molesta ver ese formato pueden bajarse esta extension: https://addons.mozilla.org/es/firefox/addon/jsonview/ para que se vea de la siguiente manera:
!resultado de json con la extension jsonview firefox
Amando este curso!! :)
Genial compañera!
Sólo un detalle, las palabras referidas a categoría en ingles son category & subcategory
Yo uso Opera y funcion la misma extension que para Google Chrome
Les comparto esta explicación sobre express que me parecion interesante:
Linea 2: Inicializamos el app express en la variable app
Linea 3: .get decidira que cuando obtiene esa ruta en especifico ´´./´´ debe dar la respuesta que se especifica en la funcion. Esta toa dos argumentos 1: la URL y 2: a función que le dice a express qué enviar a la persona que hace la solicitud ´´hello express´´.
Linea 4: .listen vinculará la aplicación al puerto de nuestra máquina.
Así me gustan los videos, al grano sobre el tema y cortos.
Aspectos básicos del routing en Express.js
La definición de ruta tiene la siguiente estructura:
app.METHOD(PATH, HANDLER)
Donde:
app es una instancia de express.
METHOD es un método HTTP, en minúsculas.
PATH es una ruta en el servidor.
HANDLER es la función que se ejecuta cuando la ruta coincide.
Con Brave también funciona la extensión:
Yo uso firefox developer edition y me formatea el json en automatico.
Solicitudes REST con Curl
Conocido como "Cliente URL" es una utilería para hacer solicitudes y tranferir información.
.
Ejemplo, tenemos que:
curl localhost:3000
Salida
Hola a mi server de express
y ese json lo obtendríamos de un db? es decir puedo conectar una rest api hecha con node express a una db? hay algun curso especifico para eso? Gracias por la respuesta de antemano
Claro, y no solo con express, casi siempre, sin importar el framework o lenguaje de programación tendrás una manejera de conectarte a una base de datos para consultar y enviar la respuesta como un JSON desde tu API.
Nodejs MySQL REST API, Desde cero a Despliegue en Railway
Nodejs & PostgreSQL REST API
Nodejs Mongodb CRUD (Desarrollo y Despliegue), Aplicación web desde Cero
Gracias Pedro, estoy impaciente por tomar ese curso que mencionas
Alguien sabe si hay algunas convenciones para llamar a las rutas?
Si hay y las vemos en este curso, sin embargo, este artículo: Best practices for REST API design con las buenas prácticas del equipo de StackOverflow.
Hola Platzinautas, si alguien puede ayudarme porque cuando ejecuto en el navegador: localhost:3000/nueva-ruta el resultado es un error Cannot GET /nueva-ruta ? Yo he revisado todo el código 2 veces y no descubro el porqué. Help me please!!!
¡Hola! Eso es porque en tu router no tienes definida ninguna ruta que se llame "nueva-ruta". ¿Puedes poner tu código? Así puedo tener más contexto y darte una respuesta más exacta :D
Si por su puesto lo comaprtiré: Gracias
const express =require('express');const app =express();const port =3000;app.get('/',(req, res)=>{ res.send('Hola mi server en Express');});app.get('/nueva-ruta',(req, res)=>{ res.send('Hola, soy una nueva ruta');});app.listen(port,()=>{console.log('My port: '+ port);});
