TWA-App für Android mit Bubblewrap erstellen
Manchmal wollen Kunden ihre Website oder eine Teilanwendung ihrer Website im App Store veröffentlichen. Hierfür benötigt man eine TWA-App (Trusted Web Activity), die dann die Webseite oder den gewünschten Teilbereich aufruft. In diesem Artikel zeigen wir Dir, wie Du eine TWA-App für Android erstellst und im Google Play Store veröffentlichen kannst.
Voraussetzungen schaffen
Bevor es losgehen kann, müssen wir ein paar Vorbereitungen treffen.
1. Java installieren
Stelle sicher, dass Du Java auf Deinem Computer installiert hast. Die neuste Version findest Du auf der offiziellen Java-Website.
2. Android Studio installieren, SDK herunterladen und Android Emulator einrichten
Das SDK ist das Android Software Development Kit. Dies ist ein Kit, welche eine Menge an Entwicklungstools enthält. Darunter Debugger und Bibliothek. Die aktuelle Version findest Du auf der offiziellen Seite der Android Developer SDK.
3. NodeJS Installieren
Da wir für die Generierung der App Bubblewrap verwenden, muss noch NodeJS installiert werden. Die aktuelle Version findest Du auf der offiziellen Seite.
4. Bubblewrap installieren
Je nach Bedarf kannst Du Bubblewrap global oder lokal installieren. Führe dazu einen der folgenden Befehle in der CMD aus:
Für eine lokale Installation:
npm i bubblewrap
Für eine globale Installation:
npm i -g bubblewrap
5. Manifest für die Website
Für die Webseite, die dargestellt werden soll, muss eine manifest.json verfügbar sein.
Hier ist ein Beispiel eines simplen Manifests:
{ "short_name": "App shortname", "name": "App name", "description": "App description", "icons": [ { "src": "AppIcons/android-icon-192x192.png", "type": "image/png", "sizes": "192x192" }, { "src": "AppIcons/app_icon.png", "type": "image/png", "sizes": "512x512" } ], "start_url": ".", "display": "standalone", "theme_color": "#000000", "background_color": "#ffffff" }
6. Keystore für Google Play erstellen
Um die App im Play Store zu veröffentlichen, benötigt sie eine Signatur. Hierfür muss ein Keystore für die App generiert werden. Den Keystore kannst Du mit folgendem Kommando erstellen:
keytool -genkey -v -keystore <my-release-key>.keystore -alias <alias_name> -keyalg RSA -keysize 2048 -validity 10000
Wenn Du später die App updaten möchtest, benötigst Du denselben Keystore und das dazugehörige Passwort, merke die Daten also gut.
Erstellen der App
1. TWA-App initialisieren
Führe den folgenden Befehl aus, um die TWA mit Bubblewrap zu initialisieren:
bubblewrap init
Du wirst durch einige Eingabeaufforderungen geleitet, in denen Du die URL des Manifests, den Pfad zum Keystore, den Namen und einige andere Details angeben musst. In den meisten Fällen kannst Du die Standardwerte verwenden.
2. TWA bauen
Gehe ins Wurzelverzeichnis Deines Projekts und führe diesen Befehl aus:
bubblewrap build
Das Passwort ist das für Deinen Keystore. Wenn alles korrekt läuft, sollten die folgenden Dateien erstellt werden:
app-release-bundle.aab
app-release-signed.apk
app-release-signed.apk.idsig
app-release-unsigned.aligned.apk
Veröffentlichung in der Play Console
Um Deine App in der Play Console zu veröffentlichen, benötigst Du ein Entwicklerkonto, das eine einmalige Gebühr von 25 USD erfordert.
Klicke in der Play Console oben rechts auf „App erstellen“.
Gib den App-Namen, die Standardsprache, den App-Typ sowie die Monetarisierung ein und akzeptiere die Nutzungsbedingungen von Google.
Starte die Tests im Dashboard.
Richte Deine App-Kategorien ein.
Wähle im Dashboard die Länder aus, in denen Deine App veröffentlicht werden soll.
Erstelle einen neuen Release für Deine App und lade das bundle.aab hoch.
Überprüfe und bestätige den Release.
Sende die App an Google und warte auf die Überprüfung.
Innerhalb von etwa 7 Tagen solltest Du informiert werden, ob die Tests erfolgreich waren. Danach kannst Du mit der Veröffentlichung Deiner App starten.
Fazit
Die Erstellung einer TWA ist ein unkomplizierter Prozess, der es Dir ermöglicht, Deine Webanwendung als Android-App zu veröffentlichen. Viel Erfolg!
