Construiste una aplicación web que se conecta con las APIs de OpenAI y Anthropic, pero mientras viva solo en tu computador, nadie más podrá usarla. Llevarla a internet es el paso que transforma un proyecto local en un producto real, accesible desde cualquier parte del mundo con un simple link. Y lo mejor: solo necesitas tres pasos para lograrlo con Vercel.
¿Por qué configurar límites de gasto antes del despliegue?
Antes de poner cualquier aplicación en producción, hay una precaución que no puedes ignorar. Las APIs de inteligencia artificial cobran por uso [0:18]. Si tu app se viraliza entre amigos o simplemente la dejas corriendo sin control, la factura puede llenarse de ceros muy rápido.
- Configura los límites de uso en cada proveedor de API.
- Activa alertas de gastos para recibir notificaciones antes de que el consumo se dispare.
- Dedica unos minutos a esta configuración; puede ahorrarte un dolor de cabeza enorme.
Este paso aplica tanto para OpenAI como para Anthropic, y también para Gemini si aceptaste el reto de conectarlo en clases anteriores.
¿Qué es Vercel y por qué es ideal para proyectos Next.js?
Vercel es la plataforma creada por el mismo equipo detrás de Next.js [0:48]. No es casualidad que sea la opción preferida para este tipo de proyectos: es simple, rápida y gratuita para comenzar. Para iniciar el despliegue necesitas dos cosas:
- Tu proyecto publicado en GitHub.
- Una cuenta creada en vercel.com.
¿Cómo importar tu repositorio en Vercel?
Desde el panel principal de Vercel, selecciona Agregar nuevo proyecto [1:19]. La plataforma permite pegar la URL de un repositorio Git o, si ya vinculaste tu cuenta de GitHub, simplemente hacer clic en Importar. Vercel detecta automáticamente que se trata de un proyecto Next.js y lo marca con su ícono correspondiente.
¿Cómo manejar las variables de entorno en producción?
El archivo .env.local que usaste durante el desarrollo no sube al repositorio [1:41]. Ese archivo queda en tu máquina por seguridad. Las variables de entorno, como las claves de OpenAI y Anthropic, deben copiarse manualmente en el panel de Vercel antes del despliegue.
- Pega cada variable una por una en la sección de Environment Variables.
- También puedes importar el archivo directamente desde la interfaz de Vercel.
- Si agregaste una variable de más, puedes eliminarla fácilmente desde el mismo panel.
Una vez configurado todo, haz clic en Deploy [2:14]. Vercel ejecuta el proceso, muestra los logs en tiempo real, presenta un summary al completarse y asigna un dominio temporal a tu aplicación. Si ya compraste un dominio personalizado, puedes asignarlo después desde el panel.
¿Qué sucede después del despliegue exitoso?
Cuando todos los checks pasan, Vercel te lleva a una página de felicitaciones [2:38]. Ahí puedes ver tu nombre de usuario registrado, un screenshot de la primera página visible y los próximos pasos disponibles:
- Instant Preview: cada vez que publiques una nueva branch, el preview se actualiza automáticamente.
- Dominio personalizado: puedes conectar tu propio dominio.
- Analítica y rendimiento: Vercel ofrece herramientas de performance y analítica integradas.
Desde el dashboard obtienes el link de preview que puedes compartir con cualquier persona [3:06]. Al hacer clic, la aplicación se abre en el navegador completamente funcional. Puedes escribir un mensaje y recibir respuesta de OpenAI, cambiar a Anthropic y verificar que los controles se ajustan según lo configurado, mostrando solo las opciones de texto.
Tres pasos fueron suficientes para llevar la aplicación de tu computador a internet [3:40]. Sí, el MVP puede crecer: un sistema de registro, historial de chats guardados, modo claro y oscuro... Las posibilidades de expansión son infinitas. Pero eso no le quita mérito a lo que ya lograste.
Construiste una aplicación web completa, la conectaste a las APIs de los proveedores de IA más relevantes del mundo y la pusiste en producción. ¿Cuántas personas en tu entorno pueden decir lo mismo? Ese logro tiene valor real, tanto para tu perfil profesional como para todo lo que puedas construir a partir de aquí. Comparte tu experiencia y cuéntanos cómo te fue con tu despliegue.