# TaskMate PWA zu APK - Vollständige Anleitung ## Überblick Diese Anleitung zeigt, wie Sie aus der TaskMate PWA eine Android APK erstellen, die im Google Play Store veröffentlicht werden kann. ## Voraussetzungen - TaskMate PWA ist online verfügbar (https://taskmate.aegis-sight.de) - Web App Manifest und Service Worker sind implementiert - PWA Icons in allen erforderlichen Größen vorhanden ## Methode 1: PWABuilder (Einfachste Methode) ### Schritt 1: PWA Score prüfen 1. Öffnen Sie https://www.pwabuilder.com 2. Geben Sie Ihre PWA URL ein: `https://taskmate.aegis-sight.de` 3. Klicken Sie auf "Start" 4. PWABuilder analysiert Ihre App und zeigt den Score ### Schritt 2: Package für Android generieren 1. Klicken Sie auf "Package for stores" 2. Wählen Sie "Android" 3. Konfigurieren Sie die Einstellungen: - **Package ID**: `de.aegissight.taskmate` - **App Name**: TaskMate - **Display Mode**: Standalone - **Orientation**: Any - **Fallback URL**: `https://taskmate.aegis-sight.de` ### Schritt 3: Erweiterte Optionen - **Signing Key**: - "None" für Test-APK - "New" für Play Store (speichern Sie den Key sicher!) - **Maskable Icon**: Upload des 512x512 Icons - **Splash Screen**: Automatisch generiert - **Settings**: - Enable notifications: Yes - Location permissions: No - WebView settings: Standard ### Schritt 4: Download und Test 1. Klicken Sie auf "Download" 2. Extrahieren Sie die ZIP-Datei 3. Die APK befindet sich im Ordner 4. Installieren Sie zum Testen auf einem Android-Gerät ## Methode 2: Bubblewrap (Für Entwickler) ### Installation ```bash # Node.js und npm müssen installiert sein npm install -g @bubblewrap/cli ``` ### Projekt initialisieren ```bash # Neues Verzeichnis erstellen mkdir taskmate-android cd taskmate-android # Bubblewrap init bubblewrap init --manifest https://taskmate.aegis-sight.de/manifest.json ``` ### Konfiguration (twa-manifest.json) ```json { "packageId": "de.aegissight.taskmate", "host": "taskmate.aegis-sight.de", "name": "TaskMate", "launcherName": "TaskMate", "display": "standalone", "themeColor": "#000000", "navigationColor": "#000000", "backgroundColor": "#000000", "enableNotifications": true, "startUrl": "/", "iconUrl": "https://taskmate.aegis-sight.de/assets/icons/icon-512x512.png", "maskableIconUrl": "https://taskmate.aegis-sight.de/assets/icons/icon-512x512.png", "appVersion": "1.0.0", "signingKey": { "alias": "taskmate-key", "path": "./taskmate-key.keystore" }, "splashScreenFadeOutDuration": 300, "enableSiteSettingsShortcut": false, "shortcuts": [ { "name": "Neue Aufgabe", "shortName": "Neue Aufgabe", "url": "/?action=new-task", "chosenIconUrl": "https://taskmate.aegis-sight.de/assets/icons/add-task-96x96.png" } ], "fallbackType": "customtabs", "webManifestUrl": "https://taskmate.aegis-sight.de/manifest.json" } ``` ### Build-Prozess ```bash # Keystore erstellen (nur einmal) bubblewrap build --skipPwaValidation # APK erstellen bubblewrap build # Signed APK für Play Store bubblewrap build --skipPwaValidation ``` ## Methode 3: Android Studio mit TWA ### Projekt Setup 1. Erstellen Sie ein neues Android-Projekt 2. Minimum SDK: API 19 (Android 4.4) 3. Wählen Sie "No Activity" ### Dependencies (app/build.gradle) ```gradle dependencies { implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.5.0' } ``` ### AndroidManifest.xml ```xml ``` ### Digital Asset Links Erstellen Sie auf Ihrem Server die Datei: `https://taskmate.aegis-sight.de/.well-known/assetlinks.json` ```json [{ "relation": ["delegate_permission/common.handle_all_urls"], "target": { "namespace": "android_app", "package_name": "de.aegissight.taskmate", "sha256_cert_fingerprints": [ "YOUR_APP_SIGNING_KEY_FINGERPRINT" ] } }] ``` ## Icon-Generierung Falls Icons fehlen, nutzen Sie diese Tools: 1. **Android Asset Studio**: https://romannurik.github.io/AndroidAssetStudio/ 2. **Maskable.app**: https://maskable.app/editor Benötigte Größen: - 48x48, 72x72, 96x96, 144x144, 192x192, 512x512 - Adaptive Icons für Android 8+ ## Testing ### Lokaler Test 1. Aktivieren Sie "Unbekannte Quellen" in Android-Einstellungen 2. Übertragen Sie die APK aufs Gerät 3. Installieren und testen ### Play Console Test Track 1. Laden Sie die APK in die Google Play Console 2. Erstellen Sie eine interne Testversion 3. Fügen Sie Tester hinzu 4. Testen Sie Installation und Updates ## Veröffentlichung im Play Store ### Vorbereitung 1. Google Play Developer Account ($25 einmalig) 2. App-Beschreibung und Screenshots 3. Datenschutzerklärung 4. Altersfreigabe-Fragebogen ### Store Listing - **Titel**: TaskMate - Aufgabenverwaltung - **Kurzbeschreibung**: Einfache und effiziente Aufgabenverwaltung mit Kanban-Board - **Kategorie**: Produktivität - **Screenshots**: Mindestens 2, idealerweise 8 ### APK Upload 1. Signierte APK erstellen 2. In Play Console hochladen 3. Rollout starten (gestaffelt empfohlen) ## Wartung und Updates ### Version Updates 1. Erhöhen Sie `versionCode` und `versionName` 2. Erstellen Sie neue APK 3. Laden Sie in Play Console hoch 4. Beschreiben Sie Änderungen ### PWA Updates - Service Worker Updates werden automatisch geladen - Manifest-Änderungen erfordern App-Update - Cache-Versionierung beachten ## Häufige Probleme ### "Not a valid PWA" - Prüfen Sie HTTPS - Validieren Sie manifest.json - Service Worker muss registriert sein ### "Digital Asset Links validation failed" - assetlinks.json muss öffentlich erreichbar sein - SHA256 Fingerprint muss stimmen - Content-Type: application/json ### Icon-Probleme - Alle Größen müssen vorhanden sein - PNG-Format erforderlich - Transparenz vermeiden für adaptive Icons ## Empfehlungen 1. **Verwenden Sie PWABuilder** für den Anfang 2. **Bubblewrap** für mehr Kontrolle 3. **Android Studio** nur bei speziellen Anforderungen 4. Testen Sie auf verschiedenen Geräten 5. Behalten Sie die Keystore-Datei sicher auf! ## Nächste Schritte 1. Icons generieren (falls noch nicht vorhanden) 2. PWABuilder Test durchführen 3. Test-APK erstellen und installieren 4. Bei Erfolg: Play Store Konto einrichten 5. Produktions-APK mit Signing Key erstellen 6. Im Play Store veröffentlichen Bei Fragen oder Problemen können Sie die offizielle Dokumentation konsultieren: - [PWABuilder Docs](https://docs.pwabuilder.com/) - [Bubblewrap GitHub](https://github.com/GoogleChromeLabs/bubblewrap) - [TWA Documentation](https://developers.google.com/web/android/trusted-web-activity)