Desplegar una aplicación frontend nunca fue tan accesible como con Vercel, una de las plataformas más populares para alojar proyectos web de forma rápida y gratuita. Si ya tienes tu código en GitHub, el proceso toma apenas unos minutos y no requiere configuraciones complejas. A continuación, se explica cada paso para llevar tu sitio a producción usando esta herramienta.
¿Qué es Vercel y por qué elegirlo para tu frontend?
Vercel es una plataforma de despliegue que ha evolucionado a lo largo de los años. Anteriormente se conocía como Now.sh, después pasó a llamarse Sage y finalmente adoptó el nombre Vercel [00:14]. Su principal ventaja es la integración directa con repositorios de GitHub, lo que permite publicar proyectos con muy pocos clics.
Para comenzar, accede a Vercel.com y crea una cuenta de usuario. Una opción recomendada es conectarte directamente con tu cuenta de GitHub [00:27]. Al hacerlo, autorizas a Vercel para acceder a tus repositorios y facilitar la importación del código.
Durante la configuración inicial puedes personalizar tu nombre y username. Una buena práctica es mantener el mismo nombre de usuario en todas las plataformas y redes sociales [00:53], lo que facilita tu identificación profesional.
¿Cómo importar un repositorio de GitHub a Vercel?
Una vez creada la cuenta, el siguiente paso es importar el repositorio. El flujo es sencillo:
- Ve a GitHub.com y copia la URL del repositorio que deseas desplegar [01:17].
- Regresa a Vercel, pega la URL y selecciona continuar [01:28].
- Confirma que se trata de tu cuenta personal y autoriza a Vercel frente al repositorio [01:36].
Vercel verificará la conexión, se conectará al repositorio y mostrará la estructura del proyecto [01:48]. A continuación, te pedirá el nombre del proyecto, que puedes dejar en el formato sugerido.
También preguntará si utilizas algún framework. En el caso de una aplicación básica con JavaScript puro, no es necesario seleccionar ninguno [02:02]. Igualmente, existe la opción de configurar variables de entorno o comandos de compilación personalizados con NPM, aunque para proyectos simples no se requiere [02:10].
Finalmente, presiona el botón de desplegar y espera unos segundos.
¿Qué opciones ofrece Vercel después del despliegue?
Cuando el despliegue finaliza, Vercel genera automáticamente una URL con el formato tu-proyecto.vercel.app [02:26]. Al hacer clic en "Visitar", se abre una nueva pestaña con tu aplicación ya en producción.
Desde el dashboard de Vercel tienes acceso a información valiosa:
- Historial de despliegues: cada vez que actualizas tu repositorio, queda registrado.
- Logs de construcción: útiles para diagnosticar errores cuando el proyecto utiliza frameworks o librerías y falla al compilar [02:42].
- Gestión de dominios: puedes agregar o cambiar dominios desde la sección View Domains [02:52].
¿Cómo configurar subdominios personalizados?
Una funcionalidad interesante es la posibilidad de usar múltiples subdominios para un mismo proyecto. Vercel ofrece dos opciones de subdominio gratuito:
- tu-proyecto.vercel.app — el dominio estándar.
- tu-proyecto.now.sh — una alternativa más corta y fácil de recordar [03:08].
Por ejemplo, podrías crear un subdominio como platsinautas.now.sh y Vercel validará si está disponible. Si lo está, queda configurado de inmediato [03:00]. Esto resulta práctico para compartir enlaces más amigables con clientes o colaboradores.
¿Qué ventajas tiene Vercel frente a otras opciones?
El proceso de despliegue en Vercel destaca por ser rápido y sencillo [03:22]. La capacidad de manejar varios subdominios sin costo adicional, junto con la integración nativa con GitHub, lo convierte en una opción sólida para proyectos frontend que no requieren backend.
Con este paso se completa el flujo de despliegue de aplicaciones de tipo frontend. El siguiente reto será trabajar con aplicaciones que incluyen backend y base de datos [03:36], donde las configuraciones se vuelven más interesantes.
¿Ya probaste Vercel para alguno de tus proyectos? Comparte tu experiencia en los comentarios.
