PWA - Progressive Web Application

Seminarziel

Nach dem Seminar kennen Sie die Merkmale einer Progressive Web App (PWA) und können mit Hilfe moderner Web-Technologien Progressive Web Apps (PWA) entwickeln.

Inhalt

• Progressive Web Apps (PWA) Grundlagen
  • Abgrenzung Hybrid Mobile Apps und PWAs
  • Progressive Web Apps (PWA)-Technologie im Überblick
  • Checkliste für eine Progressive Web App
  • Aufbau einer Testumgebung
  • Anspruch an das Layout
  • Browserunterstützung und Feature-Tests
• Document Object Model
  • Zugriff HTML Elemente und Attribut
  • Elemente erstellen
  • DOM Baum modifizieren
• Startseite und Web Manifest
  • Manifest Eigenschaften
  • Homescreen Prompt
• Service Worker
  • Browser Support
  • Service Worker shell
  • Caching
  • Web Notification / Push Notification
  • Synchronisation im Hintergrund
  • Service Worker Lifecycle
• Application Cache
  • Fetch API
  • Cashes Object
• Service Worker Anwendungsfälle
  • Worker Events
  • Pre-Caching
  • Cache aktualisieren
  • Ressourcen abrufen
  • Caching Szenarien
  • Client-Kommunikation
• Kommunikations APIs
  • Web Sockets
  • Messaging
  • WebRTC
• Data Management
  • File API
  • File System API
  • Indexed DB
  • Local Storage und Session Storage
• Grafik und Medien
  • Video und Audio
  • Web Audio
• Debugging
  • Einrichtung von Android Images im Android Studio
  • Aufruf der PWA in Android Studio
  • Hinzufügen der PWA auf dem Homescreen des Android Images
  • Debugging in den Developer Tools des Browsers
  • Auditing mit Google Lighthouse
• Tools
  • PWA Builder
  • Auditing mit Google Lighthouse
  • PWA erstellen mit Google Workbox mit JavaScript oder TypeScript
  • Projekte erstellen mit Vite
  • Erstellung einer PWA mit Framework am Beispiel von Vue oder Svelte in Vite mit Plugin
  • und Workbox
  • JS Frameworks mit PWA-Unterstützung