Mobile Apps

Erstelle mobilfreundliche Web-Apps in Proyecta. PWAs funktionieren sofort; native iOS/Android-Wrapper über PWA Builder.

Proyecta erstellt Web-Apps. Der schnellste Weg zu „einer App auf dem Handy“ ist eine responsive Web-App – optional als Progressive Web App (PWA) erweitert, damit Nutzer sie auf ihrem Homescreen installieren und (auf unterstützten Plattformen) Push-Benachrichtigungen, Offline-Support und eine Vollbildansicht erhalten können.

Für die native Verteilung über den App Store, Google Play oder den Microsoft Store verpackst du die veröffentlichte PWA mit einem Tool wie PWA Builder.

Was du direkt bekommst

Responsiver Viewport-Umschalter im Builder — wechsle beim Bearbeiten zwischen Desktop-, Tablet- und Mobile-Vorschauen
Mobile-first-KI-Prompts — die KI weiß, wie sie responsive Layouts erstellt, wenn du danach fragst
Mobile-Dashboard-Tab — ein dediziertes Mobile-Panel mit den Schritten Appearance, Test und Publish, um deine App in eine installierbare Mobile-App zu verwandeln
Push-Benachrichtigungen — siehe Push Notifications
Mobile Builder UI — Proyecta selbst funktioniert auf Smartphones, sodass du auch unterwegs entwickeln kannst

Der Mobile-Tab

Öffne das Dashboard und wechsle zum Mobile-Tab für einen geführten dreistufigen Ablauf:

Appearance — überprüfe App-Icon, Name und Designfarbe. Falls Mobile-Support noch nicht eingerichtet ist, klicke auf Set up mobile support und Proyecta richtet alles in einem Schritt für dich ein – kein Prompt nötig.
Test — scanne einen QR-Code, um deine veröffentlichte App auf einem echten Smartphone zu öffnen (siehe Test on Mobile).
Publish to App Store — eine Schritt-für-Schritt-Anleitung zum Paketieren und Einreichen in den App Stores (siehe Publish to App Stores).

Das Webapp-Template liefert bereits ein Web-App-Manifest (site.webmanifest) und einen Service Worker (sw.js) mit, sodass die Grundlage für eine installierbare, offlinefähige PWA vom ersten Build an vorhanden ist – der Mobile-Tab und die KI passen sie lediglich an deine App an.

Der PWA-Weg

Der schnellste Weg ist der Set up mobile support-Button im Mobile-Tab. Wenn du es lieber selbst steuern möchtest, kannst du die KI auch direkt ansprechen:

Add PWA support to my app:
- Web app manifest with name, icons, theme color
- Service worker with offline cache for the app shell
- Service worker with update toast on new version

In beiden Fällen werden Manifest und Service Worker eingerichtet. Sobald du veröffentlichst, können Nutzer:

deine App in jedem mobilen Browser öffnen
das Browsermenü antippen und Add to Home Screen (iOS) bzw. Install app (Android) auswählen
sie wie eine native App vom Homescreen aus starten

PWAs unter iOS 16.4+ unterstützen auch Web Push, sodass Benachrichtigungen funktionieren – siehe Push Notifications für die Einrichtung.

Tiefer gehen: native Wrapper

Wenn du im App Store oder bei Google Play veröffentlichen möchtest, empfiehlt sich das Verpacken deiner veröffentlichten PWA:

Veröffentliche auf deiner *.proyecta.live-Subdomain (oder einer eigenen Domain)
Öffne pwabuilder.com und gib deine URL ein
Generiere native Pakete — Android (AAB), iOS (Xcode-Projekt), Windows (MSIX)
Reiche das Paket beim jeweiligen Store ein

Details findest du unter Publish to App Stores.

Wichtige Einschränkungen

Apple lehnt möglicherweise reine WebView-Apps ab, die keine native Funktionalität hinzufügen. Bedenke das, bevor du den App Store anvisierst.
Push-Benachrichtigungen unter iOS erfordern, dass der Nutzer die PWA zuerst über Safari installiert (nicht über einen Wrapper).
Kamera, GPS, Kontakte funktionieren alle über Web-APIs – nativer APIs (HealthKit, ARKit) sind von einem PWA-Wrapper aus nicht erreichbar.

Demnächst verfügbar

Native React Native / Expo-Templates für Projekte, die echte native Shells benötigen
Capacitor-Integration als alternativer Wrapping-Pfad
In-Builder-App-Store-Publishing-Assistent (Icons, Splash Screens, Store-Beschreibungstext)
App-Store-Metadatenverwaltung synchronisiert mit dem Builder