Agregar rutas
Haz que tu servidor responda a distintas URLs
⏱ Estim. ~8 min
01 · Leer
Por ahora tu servidor solo responde a una URL: la raíz /. Si entras a localhost:3000/about o localhost:3000/anything-else, te sale un error.
Los sitios web reales tienen muchas páginas — inicio, acerca de, contacto, páginas de producto y más. Cada página tiene su propia ruta — una ruta de URL que el servidor sabe manejar.
Agregar rutas es como le enseñas al servidor a responder con distinto contenido para distintas URLs. Cada llamada a app.get() crea una nueva ruta.
💡 Imagínalo asíImagínate las rutas como la recepcionista de una oficina. Alguien pide ventas y la recepcionista lo manda a una sala. Pide soporte y lo manda a otra. Tu servidor es la recepcionista, y las rutas son los caminos.
Puntos clave
- Cada app.get('/path', ...) crea una nueva ruta
- La ruta es la parte de la URL después de localhost:3000
- Distintas rutas pueden devolver contenido completamente distinto
- Así es como cada sitio web sirve páginas diferentes
02 · Práctica real
Abre tu app.js con un editor de texto y agrega estas dos rutas nuevas. Ponlas después de la ruta app.get('/') existente, pero antes de la línea app.listen().
app.get('/about', (req, res) => {
res.send('This is the about page. I built this server myself!');
});
app.get('/contact', (req, res) => {
res.send('Contact me at: hello@mysite.com');
});03 · Práctica real
Tu servidor sigue corriendo el código viejo. Para ver los cambios, tienes que detenerlo y reiniciarlo. Vuelve a la terminal donde corre el servidor, presiona Ctrl+C para detenerlo, y arráncalo de nuevo.
node app.js
04 · Quiz
En app.get('/about', handler), ¿qué representa /about?
- El nombre del archivo que se va a enviar
- La ruta de URL que dispara este handler
- Una carpeta en la computadora
- El nombre de una variable
05 · Completar
En Express, app.get('/about', ...) crea una ruta que responde a la ruta _____.
06 · Práctica real
¡Ahora prueba tus rutas nuevas! Abre el navegador y entra a estas dos URLs: 1. http://localhost:3000/about — debería mostrar el texto de tu página About 2. http://localhost:3000/contact — debería mostrar el texto de tu página Contact También prueba http://localhost:3000 para confirmar que la ruta original sigue funcionando.
http://localhost:3000/about
http://localhost:3000/contact
07 · Quiz
Tu servidor tiene rutas para /, /about y /contact. Un usuario visita http://localhost:3000/pricing. ¿Qué pasa?
- Express crea automáticamente la página de pricing
- El servidor falla y se cae
- El servidor responde con un error "Cannot GET /pricing" porque no hay ninguna ruta que haga match
- La petición se redirige a la ruta /
Otras lecciones de este capítulo
⚠ La experiencia interactiva completa necesita JavaScript. Actívalo y vuelve a cargar la página.
※ Este es un proyecto educativo independiente — no es un producto oficial de Anthropic. Claude™ es una marca registrada de Anthropic, PBC.