Saltar al contenido principal

📋 Prerrequisitos

Requisitos del Sistema​

Software Necesario​

  • Node.js >= 20.0

    • Descargar desde nodejs.org
    • Verificar: node --version

  • pnpm >= 8.0 (recomendado) o npm >= 9.0

    • Instalar pnpm: npm install -g pnpm
    • Verificar: pnpm --version

  • Git

Editor de Código (Recomendado)​

  • VS Code con extensiones:
    • ESLint
    • Prettier
    • Prisma
    • TypeScript

Cuentas y Servicios Requeridos​

1. Clerk (Autenticación)​

Requisito: Cuenta gratuita de Clerk

Pasos:

  1. Crear cuenta en clerk.com
  2. Crear nueva aplicación
  3. Configurar providers (Email, Google, GitHub)
  4. Obtener keys:
    • NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
    • CLERK_SECRET_KEY

Plan: Free tier es suficiente para desarrollo

2. Supabase (Base de Datos)​

Requisito: Cuenta gratuita de Supabase

Pasos:

  1. Crear cuenta en supabase.com
  2. Crear nuevo proyecto
  3. Obtener connection string:
    • DATABASE_URL (connection pooling)
    • DIRECT_URL (direct connection)
  4. Obtener keys para Realtime:
    • NEXT_PUBLIC_SUPABASE_URL
    • NEXT_PUBLIC_SUPABASE_ANON_KEY

Plan: Free tier incluye:

  • 500 MB database
  • 2 GB bandwidth
  • Realtime habilitado

3. Sentry (Monitoreo - Opcional)​

Requisito: Cuenta gratuita de Sentry

Pasos:

  1. Crear cuenta en sentry.io
  2. Crear nuevo proyecto (Next.js)
  3. Obtener SENTRY_DSN

Plan: Free tier es suficiente para desarrollo

4. Vercel (Deployment - Opcional para desarrollo local)​

Requisito: Cuenta gratuita de Vercel

Pasos:

  1. Crear cuenta en vercel.com
  2. Conectar repositorio Git
  3. Configurar variables de entorno

Plan: Free tier incluye:

  • Deployments ilimitados
  • 100 GB bandwidth
  • Cron jobs

Variables de Entorno​

Archivo .env.local​

Crea un archivo .env.local en la raíz del proyecto:

# Clerk Authentication
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_...
CLERK_SECRET_KEY=sk_test_...

# Database (Supabase)
DATABASE_URL=postgresql://postgres:[PASSWORD]@[HOST]:5432/postgres?pgbouncer=true
DIRECT_URL=postgresql://postgres:[PASSWORD]@[HOST]:5432/postgres

# Supabase Realtime
NEXT_PUBLIC_SUPABASE_URL=https://[PROJECT_ID].supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...

# Sentry (Opcional)
SENTRY_DSN=https://...@sentry.io/...

# Cron Job Secret
CRON_SECRET=tu-secret-super-seguro-aqui

Obtener Variables​

Clerk​

  1. Ve a Clerk Dashboard
  2. Selecciona tu aplicación
  3. Ve a API Keys
  4. Copia Publishable Key y Secret Key

Supabase​

  1. Ve a Supabase Dashboard
  2. Selecciona tu proyecto
  3. Ve a Settings → API
  4. Copia Project URL y anon public key
  5. Ve a Settings → Database
  6. Copia Connection string (usando connection pooling)
  7. Para DIRECT_URL, usa la misma string pero sin ?pgbouncer=true

Sentry​

  1. Ve a Sentry Dashboard
  2. Selecciona tu proyecto
  3. Ve a Settings → Client Keys (DSN)
  4. Copia el DSN

Verificación de Instalación​

1. Verificar Node.js​

node --version
# Debe mostrar >= 20.0

2. Verificar pnpm​

pnpm --version
# Debe mostrar >= 8.0

3. Verificar Git​

git --version
# Debe mostrar cualquier versión

4. Verificar Variables de Entorno​

# En la raíz del proyecto
cat .env.local
# Debe mostrar todas las variables configuradas

Configuración Adicional​

Prisma Studio​

Prisma Studio está incluido y se ejecuta con:

pnpm db:studio

Supabase Realtime​

Después de configurar Supabase, necesitas habilitar Realtime:

  1. Ve a Supabase Dashboard
  2. Database → Replication
  3. Habilita Realtime para:
    • Hackathon
    • Submission
    • Score
    • ChallengeEvaluation
    • Notification
    • Team

Ver Supabase Realtime Configuration para detalles.

Troubleshooting​

Error: "Cannot find module"​

Solución: Instalar dependencias

pnpm install

Error: "Database connection failed"​

Solución: Verificar DATABASE_URL y DIRECT_URL en .env.local

Error: "Clerk authentication failed"​

Solución: Verificar que las keys de Clerk sean correctas y del mismo proyecto

Error: "Supabase Realtime not configured"​

Solución:

  1. Verificar NEXT_PUBLIC_SUPABASE_URL y NEXT_PUBLIC_SUPABASE_ANON_KEY
  2. Verificar que Realtime esté habilitado en Supabase Dashboard

Siguiente Paso​

Una vez configurados todos los prerrequisitos:

→ Quick Start

¿Problemas? → Troubleshooting