Apps móviles Webview y PWA
Un proyecto Webview / PWA es una aplicación web mobile-first. Cadrant la genera con el mismo pipeline React que una app web, pero diseña las pantallas para el teléfono y abre la vista previa en un marco de teléfono por defecto.
Usa este modo cuando quieras lanzar rápido una experiencia móvil, compartir una URL, permitir la instalación desde el navegador y, opcionalmente, encapsular la app en vivo en una carcasa de App Store más adelante.
Qué obtienes
- UI mobile-first generada para pantallas táctiles y layouts de teléfono.
- Vista previa en marco de teléfono dentro de Cadrant (mismas pestañas que una app web: preview, editor, código, data).
- Backend Supabase: auth, base de datos, storage y Edge Functions.
- Sync GitHub e historial de versiones.
- Dos vías de publicación: Web / PWA, o App Store (carcasa WebView).
Crear un proyecto Webview / PWA
- Crea un proyecto nuevo y abre la pestaña Aplicación móvil.
- Selecciona « Webview / PWA » (no « Nativa »).
- Describe pantallas, navegación y funciones en tu prompt.
- Itera en la vista previa del marco de teléfono hasta que la UX sea la adecuada.
Vista previa
A diferencia de los proyectos nativos, Webview / PWA no usa Metro ni Expo Go. La vista previa es tu app web en vivo renderizada en un marco de teléfono. También puedes cambiar al viewport de escritorio si lo necesitas.
Publicar
Desde la cabecera del proyecto, abre Publicar. Tienes dos opciones:
1. Web / PWA
Publica como un proyecto web clásico:
- URL gratuita de Cadrant (slug) o tu dominio personalizado.
- HTTPS incluido — comparte el enlace con los usuarios de inmediato.
- Los usuarios abren la URL en el navegador, o la añaden a la pantalla de inicio (instalación tipo PWA desde el menú del navegador).
- Actualiza en cualquier momento republicando — la última versión sustituye a la anterior.
Detalles sobre slug y dominios: Publicar tu proyecto y Dominios personalizados.
2. App Store (carcasa WebView)
Cuando eliges la publicación App Store, Cadrant encapsula tu URL publicada en vivo en una carcasa Expo WebView, luego compila y sube un binario iOS a tu cuenta de App Store Connect.
- Tu producto sigue siendo una app web por debajo — la app de la store carga la URL en vivo en una WebView nativa.
- Sigues el inicio de sesión de Apple Developer, los detalles de la app, el certificado y el build (el mismo flujo guiado que en nativo).
- Finaliza ficha, capturas y revisión en App Store Connect.
Flujo Apple paso a paso: Publicar en App Store Connect.
Flujo de trabajo recomendado
Construir y previsualizar
Itera en el marco de teléfono hasta que la navegación y los flujos clave funcionen.Publicar Web / PWA
Pon una URL online y compártela. Prueba la instalación en la pantalla de inicio en un teléfono real.Opcional: carcasa App Store
Cuando estés listo para la store, usa Publicar App Store y completa App Store Connect.