Despliegue y dominios
Video coming soon
El vídeo del despliegue está en camino. Mientras tanto, esta lección cubre el grupo Ship de principio a fin: despliega tu frontend, revisa los deployments, configura variables y conecta un dominio propio.
Cuando tu app ya funciona, toca publicarla. Todo lo relacionado con el frontend vive en Ship → Frontend, dividido en cuatro sub-apartados: Overview, Deployments, Variables y Domains. Esta lección recorre cada uno.
Despliega tu frontend
Tu app se sirve en un subdominio gratuito *.dypai.app. Desde Ship → Frontend → Overview ves la URL del sitio en producción, una vista previa por dispositivo, un botón de deploy, la descarga en ZIP, el enlace a GitHub y una barra de uso.
Abre Ship → Frontend
En la barra lateral del proyecto, despliega Ship → Frontend y quédate en la pestaña Overview. Verás la URL de tu sitio en *.dypai.app y una vista previa en vivo.
Despliega
Lanza un deploy desde el overview (o publica desde Studio / tu cliente de IA). HeroMate compila el frontend y lo sirve desde el subdominio — comparte esa URL con quien quieras al instante.
Comprueba que está en vivo
Abre la URL *.dypai.app y confirma que la app carga. Tu app desplegada sigue en vivo independientemente de tu saldo de AI Credits — los créditos solo cubren el trabajo de construir/editar, nunca las apps en marcha.
Deployments y rollback
Cada deploy queda guardado. El sub-apartado Deployments (ruta /deployments) — distinto del overview de Frontend — lista tus builds anteriores con sus logs, así puedes revisar qué se publicó y volver atrás a una versión anterior en un clic si algo se rompe.
El historial completo y el rollback son funciones Pro
El historial completo de deploys y el rollback en 1 clic forman parte del plan Pro. En Free puedes desplegar en tu subdominio, pero el historial extenso y el rollback están con Pro.
Variables: Backend Secrets vs variables de Frontend
La pestaña Variables (ruta /variables) tiene dos pestañas — y la diferencia importa por seguridad:
- Backend Secrets (la pestaña por defecto) — secretos de ejecución cifrados por nombre (Fernet, por proyecto). Son solo de escritura y nunca se envían al navegador. Los referencias en tus workflows y endpoints como
ctx.secrets.Xo${ secrets.X }. Aquí es donde van las claves de API y los tokens. - Frontend (Build) — variables públicas de tiempo de build que quedan dentro del bundle del cliente. Todo lo que pongas aquí se envía al navegador, así que úsalo solo para valores no secretos (el nombre público del sitio, un feature flag).
Nunca pongas secretos en Frontend (Build)
Las variables de Frontend acaban dentro del bundle del cliente y son visibles para cualquiera. Los secretos de verdad — claves de API, secretos de firma — van en Backend Secrets y se leen en el servidor con ctx.secrets.X. Mira Backend Secrets.
Conecta un dominio propio
Por defecto tu app vive en *.dypai.app. Para usar tu propio dominio con SSL, abre Ship → Frontend → Domains y añádelo. Los dominios propios requieren el plan Pro (en Free solo hay subdominio).
Sube a Pro (si hace falta)
Los dominios propios y el SSL son una función Pro. En Free tu app se queda en su subdominio *.dypai.app.
Añade tu dominio
En Ship → Frontend → Domains, escribe el dominio que tengas y sigue las instrucciones de DNS que te muestra HeroMate. El SSL se provisiona automáticamente para el dominio exacto que añadas.
Añade el apex y el www
Añadir el apex (example.com) no adjunta automáticamente www.example.com, ni al revés. Si quieres que ambos resuelvan, añade los dos registros.
Verifica que resuelve
Espera a que el DNS se propague y abre tu dominio. Una vez verificado, el certificado cubre el dominio exacto que añadiste.
apex ≠ www
Cada forma es independiente: el apex y el subdominio www son entradas separadas. Añade las dos si quieres que las visitas lleguen a tu sitio por cualquiera de las dos direcciones.
Comprar un dominio está próximamente
La pestaña Domains tiene un buscador donde puedes consultar dominios, pero la compra dentro de la app está "próximamente" (bloqueada hasta conectar la facturación). De momento, registra tu dominio en otro sitio y conéctalo aquí.
Qué aprenderás
- Desplegar tu frontend en su subdominio
*.dypai.app - Revisar Deployments y usar el rollback en 1 clic (función Pro)
- Las dos pestañas de Variables — Backend Secrets (cifradas,
ctx.secrets.X) vs variables de Frontend (públicas) - Conectar un dominio propio con SSL en Pro, incluido el detalle de apex/www
- Que las apps desplegadas siguen en vivo independientemente de tu saldo de AI Credits