Saltar al contenido
supastack
Explorar la documentación
WebNext.js

For AI agents: fetch the complete documentation index at /llms.txt, the full documentation corpus at /llms-full.txt, the agent skill at /skill.md, or this page as Markdown at /es/docs/web/provider-keys.md (or send Accept: text/markdown).

Reunir las claves de proveedor restantes

Recorridos cortos para los servicios que quedan: proveedores de IA, Trigger.dev, almacenamiento S3, Sentry o PostHog, Turnstile y tu dominio.

Cómo usar esta página

Cada sección de abajo es un recorrido de configuración completo: crea la cuenta, encuentra la clave, configura los nombres env, verifica. Toma solo las secciones de los servicios que tu producto lance — un sitio sin funciones de IA nunca necesita la primera, y el kit sigue corriendo con todas las secciones de aquí saltadas.

Las mismas reglas de secretos que en todas partes: las claves de API y los secretos de webhook quedan solo en el servidor, solo los valores con prefijo NEXT_PUBLIC_/EXPO_PUBLIC_ pueden llegar al cliente, los secretos de producción viven en el almacén de secretos del hosting, y el servidor de desarrollo relee el env solo al reiniciar.

Claves de proveedores de IA

El AI_PROVIDER del kit acepta openai, anthropic, openai-compatible y openrouter — más fake, el sustituto local por defecto. Elige uno; la clave del proveedor es la única cuenta necesaria, porque los ids de modelo y los precios vienen del catálogo de base de datos del kit, no de variables env.

OpenAI: platform.openai.com → API keys → Create new secret key → copia sk-… → OPENAI_API_KEY. Anthropic: console.anthropic.com → API Keys → Create Key → sk-ant-… → ANTHROPIC_API_KEY. Ambos facturan por token — unos pocos dólares de crédito cubren el desarrollo.

OpenRouter enruta cada modelo del catálogo a través de una sola clave: openrouter.ai → Keys → Create Key → sk-or-… → AI_PROVIDER=openrouter más OPENROUTER_API_KEY; los opcionales OPENROUTER_APP_NAME/OPENROUTER_SITE_URL envían cabeceras de atribución. openai-compatible cubre cualquier endpoint con forma OpenAI: OPENAI_COMPATIBLE_API_KEY más OPENAI_COMPATIBLE_BASE_URL.

Verifica: reinicia, ejecuta una tarea de IA y espera una respuesta de modelo real en lugar del fake determinista. Un error de arranque que nombra la clave significa que el flag del proveedor está activo sin su clave. Una respuesta real también necesita JOB_PROVIDER=trigger de la sección de Trigger.dev de abajo más un modelo habilitado en el catálogo del kit — Configurar la IA cubre ese montaje.

# apps/web/.env.local — pick ONE provider
AI_PROVIDER=openai
OPENAI_API_KEY=sk-…

# or AI_PROVIDER=anthropic
# ANTHROPIC_API_KEY=sk-ant-…

# or AI_PROVIDER=openrouter
# OPENROUTER_API_KEY=sk-or-…

# or AI_PROVIDER=openai-compatible
# OPENAI_COMPATIBLE_API_KEY=…
# OPENAI_COMPATIBLE_BASE_URL=https://your-endpoint/v1

Trigger.dev

Sáltalo salvo que el producto necesite ejecuciones reales de jobs en segundo plano — JOB_PROVIDER=local encola los jobs en memoria sin ejecutarlos, que es lo correcto para desarrollo.

1. Abre app.trigger.dev → Sign up → crea un proyecto.

2. Copia dos valores: el project ref proj_… desde la configuración del proyecto o la URL del panel → TRIGGER_PROJECT_REF, y la secret key de la página de API keys del proyecto (tr_dev_… para el entorno dev, tr_prod_… para producción) → TRIGGER_SECRET_KEY. Ambos quedan solo en el servidor.

3. Las tareas del kit ya viven en apps/web/trigger y apps/web/trigger.config.ts lee TRIGGER_PROJECT_REF. Desde apps/web ejecuta npx trigger.dev@latest dev — registra las tareas con tu proyecto y las ejecuta en local contra la clave dev.

Verifica: el comando dev registra las tareas en el log; encola una en la app y mírala ejecutarse en la lista Runs del panel. Los entornos desplegados ejecutan corepack pnpm --filter @supastack/web trigger:deploy para publicar el conjunto de tareas.

# apps/web/.env.local
JOB_PROVIDER=trigger
TRIGGER_PROJECT_REF=proj_…
TRIGGER_SECRET_KEY=tr_dev_…   # tr_prod_… in production

# run the worker alongside the app, from apps/web:
cd apps/web
npx trigger.dev@latest dev

Almacenamiento compatible con S3 (Cloudflare R2)

Sáltalo salvo que el producto almacene archivos — STORAGE_PROVIDER=memory mantiene las subidas dentro del proceso para desarrollo.

Cualquier bucket compatible con S3 funciona; Cloudflare R2 es la opción amigable con el nivel gratuito. 1. Abre dash.cloudflare.com → R2 Object Storage → Create bucket, ponle nombre y deja la indicación de ubicación por defecto.

2. De vuelta en la vista general de R2 abre Manage R2 API Tokens → Create API token → permiso Object Read & Write, limitado a ese bucket → Create. Copia el Access Key ID, el Secret Access Key y el endpoint S3 que se muestra — https://<account-id>.r2.cloudflarestorage.com.

3. Configura los nombres env de abajo. STORAGE_REGION=auto es la convención de R2 — el kit trae por defecto us-east-1, que R2 también acepta. STORAGE_FORCE_PATH_STYLE ya viene activado por defecto para endpoints personalizados, que es lo que quiere R2. Servir archivos públicos necesita además STORAGE_PUBLIC_BASE_URL o cableado de CDN; los archivos privados no necesitan nada más.

Verifica: reinicia y sube a través de la app — el objeto aparece en el navegador del bucket de R2. Un error de firma o 403 significa que al token le falta lectura/escritura de objetos en ese bucket; crea un token nuevo con el alcance correcto.

# apps/web/.env.local
STORAGE_PROVIDER=s3
STORAGE_ENDPOINT=https://<account-id>.r2.cloudflarestorage.com
STORAGE_REGION=auto
STORAGE_BUCKET=your-bucket
STORAGE_ACCESS_KEY_ID=…          # server-only
STORAGE_SECRET_ACCESS_KEY=…      # server-only
# STORAGE_PUBLIC_BASE_URL=       # optional public-URL base

Sentry o PostHog (opcional)

Totalmente opcional: cada valor de observabilidad viene vacío por defecto y el kit funciona bien sin ninguno — añade esto cuando quieras informes de errores y analítica en producción.

Sentry para errores: sentry.io → crea un proyecto → elige la plataforma Next.js → la pantalla de configuración muestra el DSN https://…@….ingest.sentry.io/… → SENTRY_DSN. Las excepciones llegan entonces a Sentry etiquetadas con ids de correlación; el nivel gratuito basta para empezar.

PostHog para analítica de producto en su lugar: posthog.com → crea un proyecto → copia la clave de API del proyecto phc_… → NEXT_PUBLIC_POSTHOG_KEY más NEXT_PUBLIC_POSTHOG_HOST (https://us.i.posthog.com, o tu host de la UE). Esos dos son valores públicos de navegador por diseño; SENTRY_DSN queda en el servidor. ALERT_WEBHOOK_URL publica opcionalmente alertas de fallos en un endpoint compatible con Slack.

Verifica: reinicia, lanza una excepción de prueba (o repite el evento de muestra de Sentry) y confirma que aterriza en la lista Issues del proyecto.

# apps/web/.env.local — all optional
SENTRY_DSN=https://…@….ingest.sentry.io/…

NEXT_PUBLIC_POSTHOG_KEY=phc_…
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com

# ALERT_WEBHOOK_URL=https://hooks.slack.com/services/…

Cloudflare Turnstile

Protección contra bots para los formularios públicos y los endpoints de credenciales — CAPTCHA_PROVIDER=off por defecto, así que añádelo antes de abrir el registro a desconocidos. Gratis.

1. Abre dash.cloudflare.com → Turnstile → Add widget → ponle nombre y lista los hostnames: localhost para desarrollo más tu dominio real → Create.

2. Copia ambos valores: la Site Key — pública por diseño, se renderiza dentro del widget → NEXT_PUBLIC_TURNSTILE_SITE_KEY — y la Secret Key, que el servidor usa para verificar → TURNSTILE_SECRET_KEY.

3. CAPTCHA_PROVIDER=turnstile lo activa; el arranque falla nombrando la clave que falte. La guía de captcha lista exactamente qué superficies protege el widget.

Verifica: abre /auth o el formulario de contacto — el widget se renderiza; los envíos sin un desafío resuelto se rechazan. Si el widget nunca carga, el hostname que estás navegando no está en la lista del widget.

# apps/web/.env.local
CAPTCHA_PROVIDER=turnstile
NEXT_PUBLIC_TURNSTILE_SITE_KEY=0x…   # public by design
TURNSTILE_SECRET_KEY=0x…             # server-only

Un dominio propio

Una compra en cualquier registrador — Cloudflare Registrar, Porkbun, Namecheap, todos funcionan. Nada de aquí se copia al env; el dominio aparece en la Services ID, el DNS de Resend, los hostnames de Turnstile y las return URL de OAuth que configuraste por el camino.

Dos formas de apuntarlo a la app: para Cloud Run usa el mapeo de dominio de la guía de despliegue — unos pocos clics de consola más los registros DNS que lista Google. O mueve el DNS a los nameservers de Cloudflare (el registrador cambia dos registros) — opcional, pero también es la forma ordenada de gestionar los buckets públicos de R2 y los hostnames de Turnstile en un solo lugar.

Si quieres continuar la configuración, lee Configurar la base de datos.

Preguntas frecuentes

14 preguntas

¿Qué es supastack?

supastack es una base modular para construir productos SaaS con IA. Reúne la infraestructura común para que puedas centrarte en las funciones propias de tu producto.

¿Soporta web y móvil?

Sí. supastack incluye apps Next.js y Expo como puntos de partida para experiencias web y móviles.

¿Qué autenticación incluye?

Better Auth cubre correo/contraseña, OTP e inicio social. Los espacios de trabajo personales se aprovisionan con la cuenta para que los registros permanezcan delimitados desde el primer día.

¿Cómo se soporta la IA?

supastack incluye IA multi-proveedor configurable, seguimiento de uso, presupuestos y soporte cifrado de claves propias (BYOK).

¿Cómo se gestionan las suscripciones?

Para productos construidos sobre el kit, la facturación Stripe, las suscripciones y los permisos forman la base del acceso de pago. Los secretos de proveedor permanecen en el servidor.

¿Dónde vive el código propio de mi producto?

Las funciones propias del producto permanecen en un codebase separado, mientras el producto configura e integra los módulos base de supastack.

¿Cómo funciona el precio de supastack?

El kit es una compra única con actualizaciones de por vida: Un framework a 249 $ (precio de lanzamiento temporal — 100 $ de descuento sobre el precio habitual de 349 $) o Todos los frameworks (Next.js, iOS, Android) a 499 $ (precio de lanzamiento temporal — 100 $ de descuento sobre el precio habitual de 599 $), más 75 $ por plaza de desarrollador adicional. Sin suscripción al kit. El pago en este sitio entrega tu clave de licencia por correo, con acceso al repositorio por invitación de GitHub.

¿Cómo delimitan los espacios de trabajo mis datos?

Los registros del usuario se delimitan por workspaceId. Identidad, permisos, uso de IA, eventos de facturación y entradas de auditoría permanecen dentro del límite del espacio personal.

¿Cómo funcionan los jobs en segundo plano?

Trigger.dev es el runtime de jobs explícito. El contrato JobRunner solo promete enqueue, status y cancel — la semántica de workflow sigue siendo específica y explícita de Trigger.dev.

¿En qué se diferencia el email de la divulgación?

El email transaccional cubre flujos de producto como avisos de finalización de tareas. La divulgación en frío y las campañas pertenecen al producto, fuera del módulo de email de este kit.

¿Cómo funcionan las compras móviles?

La app móvil incluye compras nativas y restauración con RevenueCat, con acceso verificado por tu servidor. Configura las cuentas de las tiendas y completa las pruebas en dispositivos antes de publicar. La facturación web es independiente.

¿Dónde residen las claves de los proveedores de IA?

Las credenciales BYOK están cifradas y permanecen en el servidor. Las claves se saneen en los logs; el uso y los presupuestos siguen visibles a nivel de espacio de trabajo.

¿Qué métodos de pago acepta el checkout?

El checkout alojado en Stripe acepta tarjetas y, una vez activadas las billeteras en la cuenta de Stripe, también puede ofrecer Alipay y WeChat Pay — muy útil para compradores en China. Las autorizaciones de billetera se confirman de forma asíncrona, por lo que la página de la licencia se actualiza en cuanto se liquida el pago.

¿Puedo obtener un reembolso?

Una vez que tienes acceso al repositorio, supastack es tuyo para siempre, por lo que no se puede reembolsar. Pero no te preocupes: obtienes el código fuente completo con actualizaciones de por vida para crear y lanzar productos ilimitados para ti o tus clientes. Solo no puedes revender el código ni redistribuir el repositorio como plantilla o starter kit.

ES
Tema