Infos
PWA Workshop
Beschreibung
Stellen Sie sich vor, Sie schreiben Ihre moderne Businessanwendung genau einmal – und sie läuft auf Windows, macOS, Linux, Android, iOS und im Browser. Diese Anwendungen werden per Fingertippen aus dem Browser auf dem Gerät installiert, können Pushbenachrichtigungen empfangen und funktionieren auch dann, wenn das Wi-Fi im Zug gerade mal wieder nicht funktioniert. Das klingt fantastisch? Dank Progressive Web Apps (PWA) wird all das Wirklichkeit. Mit Hilfe moderner Webtechnologien wird aus einer Webanwendung eine App, die einer nativen App in nichts nachsteht. In diesem Workshop zeigen wir anhand eines durchgängigen Beispiels die Grundlagen der PWA-Entwicklung mit Googles Single Page App Framework Angular, bei denen Sie aktiv mitentwickeln können. Jeder geht mit einer PWA nach Hause!
Inhalt & Ablauf
Inhalt & Ablauf:
Der Workshop ist in vier Blöcke aufgeteilt:
1. Einführung in die Welt der Progressive Web Apps
2. Web App Manifest
3. Service Worker
4. Advanced: Push-Benachrichtigungen & Tools
Jeder Block besitzt sowohl theoretische als auch praktische Abschnitte. Der Teilnehmer wird anhand verschiedener Aufgaben an Progressive Web Apps herangeführt und geht am Ende des Workshops mit einer eigenen PWA nach Hause.
Zielgruppe & Anforderungen
Der Workshop richtet sich an Entwickler, die schon Einblicke in die Welt der Webentwicklung gewonnen haben und wissen wollen wie man seine Webanwendung auch als App nutzen und nativer gestalten kann. JavaScript/TypeScript-Grundkenntnisse sind erforderlich. Zudem gibt es noch folgende Anforderungen:
Geräte
· Notebook mit aktueller Windows/macOS/Linux-Version
· Optional: Android-Smartphone oder -Tablet mit aktueller Android- und Chrome-Version
· Optional: iPhone oder iPad – Achtung: iOS-Geräte unterstützen derzeit (noch?) nicht alle Technologien, die eine „echte" PWA ausmachen
Browser (Desktop)
· Google Chrome, Version 73 oder neuer ( https://www.google.com/chrome/browser/desktop/index.html )
· Optional: Firefox Developer Edition, Version 67 oder neuer ( https://www.mozilla.org/en-US/firefox/developer/ )
· Optional: Google Chrome Canary, Version 75 oder neuer ( https://www.google.com/chrome/browser/canary.html )
Entwicklertools
· Git Source Control Management, aktuelle Version ( https://git-scm.com/downloads )
· Optional: Git-Benutzeroberfläche (z.B. kostenfrei: TortoiseGit, SourceTree, … oder kommerziell: Tower, GitKraken, …)
· ngrok ( https://ngrok.com/download ) – für einfache und sichere TCP/HTTP/HTTPS-Tunnel zur Entwicklungszeit
· Node.js, empfohlene Version 10.15.3 LTS oder neuer ( https://nodejs.org/en/ )
Quellcode-Editor Ihrer Wahl
· JetBrains WebStorm, Version 2018.3 oder neuer (kommerziell, kostenfreie Testversion: https://www.jetbrains.com/webstorm/)
· Microsoft Visual Studio Code, aktuelle Version ( https://code.visualstudio.com/ )
· Notepad, vi, …