/setup-vercel.es

description: "Lesson command"
duration: "~10 min"
prerequisites: ["Node.js 18 o superior instalado", "Navegador disponible"]
level: "beginner"
tags: ["setup", "vercel", "deploy", "hosting"]
nonInteractiveMode: incompatible

Configuración de Vercel CLI

Step 0: Verificar progreso de configuración

**Lo que la IA ejecuta automáticamente:** 1. Ejecutar `uv run python tools/setup_progress.py show --current setup-vercel` para mostrar el progreso 2. Detectar automáticamente el estado de instalación existente:

• Ejecutar `vercel --version` para verificar si el CLI está instalado
• Ejecutar `vercel whoami` para verificar si ya inició sesión
• Si ambos tienen éxito, saltar al Step 4 (prueba)

3. **Esta configuración es opcional.** Vercel CLI se usa en la Lección 15-5 (Producción de LP - Deploy en Vercel). Puede omitirla si no la necesita de inmediato.

Lo que hará en esta sesión

| Elemento | Contenido | |----------|-----------| | Objetivo | Instalar Vercel CLI, iniciar sesión y estar listo para desplegar y publicar sitios web | | Duración | ~10 minutos | | Requisitos previos | Node.js 18 o superior instalado, navegador disponible | | Nivel de operación | Se requiere entrada de comandos CLI (la instalación la ejecuta la IA automáticamente + autenticación del navegador) | | Precio | Plan gratuito (Hobby) con proyectos personales ilimitados. El nivel gratuito es suficiente para la capacitación |

**Flujo de la sesión:** 1. Crear una cuenta de Vercel (registro en el navegador) 2. Instalar Vercel CLI (la IA lo ejecuta automáticamente) 3. Iniciar sesión en Vercel (autenticación del navegador o autenticación con token) 4. Prueba de operación (la IA la ejecuta automáticamente)

> **Consejo**: Si la IA deja de responder a mitad del proceso, escriba "por favor continúa" o "se detuvo" para reanudar.

---

Verificación de preparación

**Configuración de AskQuestion:**

{
  "title": "Confirmación previa a la sesión",
  "questions": [{
    "id": "readiness",
    "prompt": "¿Está listo? (Esta configuración es opcional. Se usa en la Lección 15-5)",
    "options": [
      {"id": "ready", "label": "¡Listo! Comencemos"},
      {"id": "chrome", "label": "Automatizar operaciones del navegador con /chrome"},
      {"id": "check_prereq", "label": "Quiero verificar los requisitos previos"},
      {"id": "skip", "label": "No lo necesito ahora, omitir"},
      {"id": "different_lesson", "label": "Ir a otra lección"}
    ]
  }]
}

(ready -> Ir al Step 1) (chrome -> Después de abrir el navegador en Step 1, seguir la sección "Automatización con integración Chrome") (check_prereq -> Indicar: "Se requiere Node.js 18 o superior. Puede verificarlo con `node --version`") (skip -> Indicar: "Omitido. Puede configurarlo nuevamente más tarde con `/setup-vercel` cuando sea necesario" y finalizar) (different_lesson -> Mostrar lista de módulos)

---

Step 1: Crear cuenta de Vercel

**Lo que hace la IA:** 1. Detectar automáticamente el sistema operativo (Mac / Windows / Linux) 2. Ejecutar el siguiente comando para abrir el navegador automáticamente:

# Mac:
open https://vercel.com/signup
# Windows:
start https://vercel.com/signup
# Linux:
xdg-open https://vercel.com/signup

**Una vez que se abra el navegador, mostrar el siguiente AskQuestion:**

{
  "title": "Step 1: Crear cuenta de Vercel",
  "questions": [{
    "id": "account_status",
    "prompt": "¿Se abrió el navegador? Siga estos pasos para crear una cuenta:\n\n1. Haga clic en 'Continue with GitHub' (recomendado)\n   - Puede registrarse directamente con su cuenta de GitHub\n   - O elija 'Continue with GitLab' o 'Continue with Email'\n2. Complete la autenticación / verificación de correo\n3. La creación de cuenta está completa\n\nIndíqueme el estado de su cuenta:",
    "options": [
      {"id": "created", "label": "¡Cuenta creada!"},
      {"id": "already_have", "label": "Ya tengo una cuenta"},
      {"id": "no_github", "label": "No tengo cuenta de GitHub"},
      {"id": "browser_not_open", "label": "El navegador no se abrió"}
    ]
  }]
}

(created -> Ir al Step 2) (already_have -> Ir al Step 2) (no_github -> Indicar: "También puede registrarse con Email. Seleccione 'Continue with Email' en la página de registro. O también puede primero crear una cuenta de GitHub con `/setup-github`") (browser_not_open -> Indicar: "Abra esta URL directamente en su navegador: https://vercel.com/signup")

---

Automatización con integración Chrome (modo `/chrome`)

**Requisitos previos:** La extensión "Claude in Chrome" (v1.0.36+) está instalada en Chrome, y se inició con `claude --chrome` o se ejecutó `/chrome` dentro de la sesión.

**Lo que la IA ejecuta automáticamente con la integración Chrome:** 1. Abrir https://vercel.com/signup en el navegador 2. Usar la integración Chrome para ejecutar:

• Hacer clic en "Continue with GitHub"
• Si aparece la pantalla de autenticación de GitHub, solicitar al usuario que apruebe

3. Una vez confirmado el registro, ir al Step 2

Si la integración Chrome no está disponible, siga los pasos manuales del Step 1.

---

Step 2: Instalar Vercel CLI

**Lo que la IA ejecuta automáticamente:** 1. Verificar la versión de Node.js:

   node --version

• Si es inferior a Node.js 18: Indicar "Se requiere Node.js 18 o superior. Configure con `/start-0-1`" y detener

2. Instalar Vercel CLI:

   npm i -g vercel

• En caso de error de permisos (`EACCES`): Indicar `sudo npm i -g vercel`

3. Verificar la instalación:

   vercel --version

**Al tener éxito en la instalación:**

¡Vercel CLI ha sido instalado! (Versión: XX.X.X)
A continuación, iniciaremos sesión en su cuenta de Vercel.

**AskQuestion en caso de fallo en la instalación:**

{
  "title": "Ocurrió un error de instalación",
  "questions": [{
    "id": "install_error",
    "prompt": "Ocurrió un error al instalar Vercel CLI.",
    "options": [
      {"id": "retry", "label": "Intenta