🚀 Cómo desplegar Express.js en Vercel paso a paso

¿Tienes una aplicación en Express.js y quieres desplegar Express.js en Vercel sin complicarte con servidores, configuraciones complejas o gastos innecesarios? Entonces Vercel puede ser tu mejor aliado.

En esta guía te explico cómo desplegar tu proyecto Express en Vercel paso a paso, aprovechando las ventajas del entorno serverless. Además, repasaremos por qué Express.js sigue siendo una opción potente y flexible para construir APIs y aplicaciones web modernas.

Índice

[hide]

🌐 ¿Qué es Vercel y por qué deberías conocerlo?

Vercel es una plataforma de despliegue pensada para desarrolladores modernos. Fue creada por el equipo detrás de Next.js, pero no se limita a ese framework: puedes usarla con proyectos en React, Vue, Svelte, e incluso con tus propias APIs en Express.js.

Lo que hace especial a Vercel:

Despliegue instantáneo: subes tu proyecto y en segundos tienes una URL pública.
Escalado automático: no tienes que preocuparte por el tráfico, Vercel se adapta.
Serverless por defecto: tus funciones se ejecutan solo cuando se necesitan, lo que ahorra recursos.
Integración con Git: cada push puede generar una versión de prueba (preview) para revisar antes de publicar.

🧩 ¿Qué significa “serverless”?

El término serverless no quiere decir que no haya servidores, sino que tú no tienes que gestionarlos. En lugar de mantener un servidor encendido 24/7, tu código se ejecuta como una función que responde a cada petición de forma independiente.

Este modelo es ideal si quieres desplegar Express.js en Vercel sin preocuparte por la infraestructura.

Esto implica:

No hay procesos persistentes.
Las funciones deben responder rápido.
Ideal para APIs, microservicios y tareas puntuales.
No se recomienda para websockets ni procesos que requieran conexión continua.

En Vercel, cada archivo dentro de /api se convierte en una función serverless. Express.js puede adaptarse a este modelo si se configura correctamente.

⚡ Ventajas de usar Express.js en tus aplicaciones

Express.js es uno de los frameworks más populares para Node.js, y no es por casualidad:

Simplicidad y rapidez: su API minimalista permite construir desde cero con total libertad.
Curva de aprendizaje baja: si ya conoces JavaScript, aprender Express es pan comido.
Flexibilidad total: puedes usarlo para crear desde una simple API REST hasta una aplicación web completa.
Ecosistema rico: miles de middlewares disponibles para autenticación, logging, manejo de errores, etc.
Ideal para entornos serverless: puedes adaptar tu app Express para funcionar como función serverless sin grandes cambios.
Integración con Git y despliegue continuo: al combinar Express con Vercel, puedes tener despliegues automáticos cada vez que haces push a tu repositorio.

🧱 Antes de empezar: instala Node.js y npm

Para seguir esta guía, necesitas tener instalado Node.js y npm. Aquí te explico cómo hacerlo en Windows y Linux:

🪟 En Windows

Descarga el instalador desde la página oficial de Node.js (elige la versión LTS).

Ejecuta el instalador y marca la opción para añadir Node.js al PATH.

Verifica la instalación en PowerShell o CMD:

node -v 
npm -v

🐧 En Linux (Debian/Ubuntu)

Abre la terminal y actualiza los paquetes:

sudo apt update

Instala Node.js y npm:

sudo apt install nodejs npm

Verifica la instalación:

node -v
npm -v

💡 También puedes usar nvm para gestionar múltiples versiones de Node.js.

🛠️ Paso a paso para desplegar Express.js en Vercel

1. Crea tu proyecto Express

mkdir mi-app-express
cd mi-app-express
npm init -y
npm install express

2. Estructura tu app para Vercel

Vercel espera que tus funciones estén en una carpeta llamada /api. Dentro de esa carpeta, crea tu archivo principal index.js o index.ts.

📁 Estructura recomendada:

mi-app-express/
├── api/
│   └── index.js
├── vercel.json
├── package.json

Ejemplo en JavaScript:

const express = require("express");
const app = express();

app.get("/", (req, res) => res.send("Express en Vercel"));

module.exports = app;

🔍 Importante: No uses app.listen() en Vercel. La plataforma ejecuta tu función como handler, no como servidor persistente.

3. Configura Vercel con `vercel.json`

Este archivo le dice a Vercel cómo manejar las rutas:

{
  "version": 2,
  "rewrites": [
    { "source": "/(.*)", "destination": "/api" }
  ]
}

4. Prueba tu app localmente

Para simular cómo se comportará tu app en Vercel antes de desplegarla, puedes usar su CLI. Aquí te explico cómo hacerlo paso a paso:

npm i -g vercel
vercel login
vercel dev

Durante el proceso, verás algo parecido a esto:

Se instalarán los paquetes necesarios. Puede aparecer una advertencia como:npm warn deprecated path-match@1.2.4: This package is archived and no longer maintained. No te preocupes, no afecta el funcionamiento de tu app.
Se abrirá una ventana para autenticarte con el medio de autenticación que prefieras. Una vez completado verás, por ejemplo: Success! GitHub authentication complete for correo@jdiaz90.org.es
Vercel te preguntará si quieres configurar el proyecto. Puedes aceptar los valores por defecto:
- Nombre del proyecto: mi-app-express
- Directorio del código: ./
- Framework detectado: ninguno (lo cual está bien para Express)
- Comando de build: npm run build (si lo necesitas)
- Directorio de salida: public o raíz
Al final verás algo como:🔗 Linked to jdiaz90s-projects/mi-app-express (created .vercel and added it to .gitignore) > Ready! Available at http://localhost:3000

Tu aplicación Express estará corriendo localmente en http://localhost:3000, lista para probar antes de desplegar.

💡 Consejo: si usas Git, Vercel creará automáticamente una carpeta .vercel y la añadirá a .gitignore para evitar subir configuraciones locales.

5. ¡Despliega tu app!

Una vez que hayas probado tu aplicación localmente, puedes desplegarla con el siguiente comando:

vercel

Durante el proceso, verás cómo Vercel compila y sube tu proyecto. El flujo típico incluye:

Inspección del proyecto:🔍 Inspect: https://vercel.com/jdiaz90s-projects/prueba/7v9xuSM164m3AAftVTfPFe3yaPUo
Despliegue en producción: ✅ Production: https://mi-app-express-cvgcq5eln-jdiaz90s-projects.vercel.app
Información del entorno de compilación: Running build in Washington, D.C., USA (East) – iad1 Build machine configuration: 2 cores, 8 GB
Instalación de dependencias y compilación: added 67 packages in 1s Build Completed in /vercel/output
Despliegue final: 📝 Deployed to production. Run `vercel --prod` to overwrite later

💡 Puedes gestionar el dominio, comandos de build o configuración del proyecto desde tu panel de Vercel.

Cada vez que ejecutes vercel, obtendrás una versión de prueba. Si tienes el proyecto vinculado a Git, los cambios en la rama principal se publicarán automáticamente.

También puedes clonar el template oficial de Express.js para Vercel si prefieres empezar desde una base ya configurada.

⚠️ Cosas a tener en cuenta en entornos serverless

WebSockets: No funcionan bien aquí porque requieren una conexión continua, y las funciones serverless son efímeras. Si necesitas datos en tiempo real, usa servicios externos como Pusher, Ably o Socket.IO con un backend dedicado.
Bases de datos: Usa conexiones breves y eficientes. Plataformas como MongoDB Atlas o PlanetScale están pensadas para este tipo de arquitectura.
Motores de plantillas: Cachea los resultados para evitar renderizados innecesarios en cada petición.
Errores: Maneja bien las excepciones para evitar estados inconsistentes o fallos silenciosos.

🧠 ¿Y qué pasa con las bases de datos?

Una de las limitaciones importantes de los entornos serverless como Vercel es que no permiten alojar bases de datos directamente dentro de la plataforma. Esto significa que no puedes guardar datos de forma persistente en el servidor, como lo harías en un entorno tradicional.

Sin embargo, puedes conectar tu aplicación Express a bases de datos externas, como MongoDB Atlas, que están diseñadas para funcionar bien en este tipo de arquitectura.

👉 En una próxima entrada del blog, te mostraré cómo conectar tu app Express desplegada en Vercel a una base de datos MongoDB, crear un modelo básico y realizar operaciones sencillas como leer y guardar datos.

✅ Conclusiones

Desplegar una aplicación Express.js en Vercel es mucho más sencillo de lo que parece. No necesitas modificar demasiado tu código, solo entender cómo funciona el entorno serverless y adaptar tu estructura a él. Con unos pocos ajustes —como evitar app.listen() y usar una carpeta /api— puedes tener tu API corriendo en minutos.

Además, Vercel te ofrece despliegue automático, escalado sin esfuerzo y una integración perfecta con Git. Eso lo convierte en una opción ideal para proyectos personales, prototipos rápidos o incluso aplicaciones en producción si sabes cómo manejar sus limitaciones.

En próximas entradas, seguiré explorando cómo extender esta base con bases de datos externas como MongoDB, y cómo estructurar proyectos Express más complejos en este entorno.