Webview- & PWA-Mobile-Apps
Ein Webview- / PWA-Projekt ist eine mobile-first Webanwendung. Cadrant generiert sie mit derselben React-Pipeline wie eine Web-App, gestaltet die Screens aber fürs Telefon und öffnet die Vorschau standardmäßig im Telefonrahmen.
Nutzen Sie diesen Modus, wenn Sie schnell eine mobile Erfahrung ausliefern, eine URL teilen, die Installation aus dem Browser ermöglichen und die Live-App später optional in eine App-Store-Hülle packen möchten.
Was Sie erhalten
- Mobile-first-UI für Touchscreens und Telefon-Layouts.
- Telefonrahmen-Vorschau in Cadrant (gleiche Tabs wie eine Web-App: Preview, Editor, Code, Data).
- Supabase-Backend: Auth, Datenbank, Storage und Edge Functions.
- GitHub-Sync und Versionsverlauf.
- Zwei Publish-Wege: Web / PWA oder App Store (WebView-Hülle).
Ein Webview- / PWA-Projekt erstellen
- Erstellen Sie ein neues Projekt und öffnen Sie den Tab Mobile Anwendung.
- Wählen Sie « Webview / PWA » (nicht « Nativ »).
- Beschreiben Sie Screens, Navigation und Features in Ihrem Prompt.
- Iterieren Sie in der Telefonrahmen-Vorschau, bis die UX stimmt.
Vorschau
Anders als bei nativen Projekten nutzt Webview / PWA weder Metro noch Expo Go. Die Vorschau ist Ihre Live-Web-App im Telefonrahmen. Bei Bedarf können Sie auch zum Desktop-Viewport wechseln.
Veröffentlichen
Öffnen Sie in der Projektkopfzeile Veröffentlichen. Sie haben zwei Optionen:
1. Web / PWA
Veröffentlichen wie ein klassisches Web-Projekt:
- Kostenlose Cadrant-URL (Slug) oder Ihre eigene Domain.
- HTTPS inklusive — teilen Sie den Link sofort mit Nutzern.
- Nutzer öffnen die URL im Browser oder fügen sie zum Startbildschirm hinzu (PWA-Installation über das Browser-Menü).
- Jederzeit erneut veröffentlichen — die neueste Version ersetzt die vorherige.
Details zu Slug und Domains: Ihr Projekt veröffentlichen und Eigene Domains.
2. App Store (WebView-Hülle)
Wenn Sie App-Store-Publish wählen, verpackt Cadrant Ihre live veröffentlichte URL in eine Expo-WebView-Hülle, baut dann ein iOS-Binary und lädt es in Ihr App-Store-Connect-Konto hoch.
- Ihr Produkt bleibt unter der Haube eine Web-App — die Store-App lädt die Live-URL in einer nativen WebView.
- Sie durchlaufen weiterhin Apple-Developer-Anmeldung, App-Details, Zertifikat und Build (derselbe geführte Flow wie beim Nativen).
- Listing, Screenshots und Review finalisieren Sie in App Store Connect.
Schrittweiser Apple-Flow: Auf App Store Connect veröffentlichen.
Empfohlener Workflow
Bauen und Vorschau
Iterieren Sie im Telefonrahmen, bis Navigation und Kernflows funktionieren.Web / PWA veröffentlichen
Stellen Sie eine URL online und teilen Sie sie. Testen Sie die Startbildschirm-Installation auf einem echten Telefon.Optional: App-Store-Hülle
Wenn Sie bereit für den Store sind, nutzen Sie App-Store-Publish und schließen Sie App Store Connect ab.