Hosting Frontend
Despliega cualquier frontend — React, Vite, Next.js o cualquier SPA — en una red global de edge. Cada proyecto incluye gratis un subdominio tu-proyecto.dypai.app con HTTPS automático. En el plan Pro también puedes conectar tu propio dominio personalizado.
Hecho para desarrollo con IA
La forma más rápida de desplegar es desde tu IDE. Solo dile a tu asistente IA "despliega mi app" y se encarga del resto a través del MCP de HeroMate.
Navegación del dashboard de Frontend
El área Frontend del grupo Ship tiene cuatro sub-secciones:
- Overview — URL del sitio, vista previa por dispositivo, botón de deploy, descarga de ZIP, enlace a GitHub y la barra de uso.
- Deployments — historial completo de deploys, logs de build y rollback en un clic. Mira Deploys, Versiones y Rollback.
- Variables — variables de build del frontend (públicas) y Backend Secrets cifrados.
- Domains — conecta un dominio personalizado (Pro) con SSL automático. Mira Dominios Personalizados.
Qué incluye
Red global de edge
Tu app se sirve desde cientos de localizaciones en todo el mundo. Carga rápida desde cualquier lugar.
HTTPS automático
Certificados SSL emitidos y renovados automáticamente en cada dominio.
Dominios personalizados (Pro)
Conecta tu propio dominio con un solo registro CNAME. Requiere el plan Pro; en Free solo hay subdominio.
Variables y secretos
Variables públicas de build para el navegador, más Backend Secrets cifrados para el runtime.
Versiones y rollback
Cada deploy queda versionado en la sub-sección Deployments. Vuelve a cualquier versión anterior en un clic.
Builds automáticos
Sube tu código y tu app se compila y va live en aproximadamente un minuto.
Cómo desplegar
1. Desde tu IDE (recomendado)
Si instalaste el MCP de HeroMate (Cursor, Claude Code, Windsurf, Codex, entre otros), basta con pedir:
"Despliega mi app"
Tu asistente IA empaqueta el proyecto, lanza el build y te devuelve la URL en vivo.
¿Primera vez?
Ejecuta npx @dypai-ai/install en la carpeta de tu proyecto. Te guía para elegir tu IDE, conecta tu cuenta HeroMate por navegador, instala el SDK y añade el archivo de instrucciones para el agente.
2. Desde el dashboard
Abre la pestaña Frontend en el dashboard de tu proyecto. Desde la sub-sección Overview puedes:
- Subir un ZIP con el output del build
- Ver la vista previa en tamaños móvil, tablet y escritorio
- Ver la URL del sitio, descargar un ZIP, abrir el enlace a GitHub y consultar la barra de uso
Para gestionar versiones y hacer rollback, abre la sub-sección Deployments — mira Deploys, Versiones y Rollback.
3. Desde tu propio flujo de GitHub
Si tu repo de proyecto está conectado, cada push a main lanza un build automático. Tú gestionas el código — HeroMate se encarga del build y el deploy.
Proceso de build
Subir o pushear
Envías el código fuente de tu app (desde el IDE, un ZIP o un push de Git).
Build automático
HeroMate detecta tu framework (Vite, Next.js, Create React App, estático, etc.), instala dependencias y ejecuta tu comando de build. No necesitas configurar nada.
Deploy global
El output del build se distribuye por la red de edge. Tu sitio está en vivo en tu-proyecto.dypai.app en aproximadamente un minuto.
Health check
HeroMate verifica que la nueva versión responde correctamente. Si algo falla, el deploy se reintenta automáticamente.
Plantillas starter
Al crear un proyecto puedes partir de una plantilla lista:
| Plantilla | Qué incluye |
|---|---|
| Landing + admin | Landing pública + formulario de contacto + panel admin para leads |
| App con registro | Sign up, login, recuperar contraseña, dashboard con rutas protegidas |
| App privada | Solo login — el admin crea usuarios, sin registro público |
| Vacío | SDK preconectado. Construye lo que quieras desde cero |
Todas las plantillas incluyen React + Vite + TypeScript + Tailwind CSS, @dypai-ai/client-sdk y la configuración MCP para tu IDE.
También puedes navegar el marketplace de plantillas dentro del dashboard para partir de proyectos de la comunidad — gestión de clínicas, CRMs, e-commerce y más.
Límites
| Subdominio gratuito | tu-proyecto.dypai.app (HTTPS automático) en todos los planes |
| Dominios personalizados | Solo plan Pro — hasta 5 por proyecto (en Free solo subdominio) |
| Tiempo de build | Timeout generoso por build; los builds muy largos se cortan |
| Tamaño del deploy | Se soportan outputs grandes; los bundles enormes pueden rechazarse |
| Minutos de build | Se descuentan del plan de tu workspace — mira Uso |
¿Necesitas dominios personalizados o más capacidad? Consulta Precios y Planes y Créditos IA.