Progressive Web Apps to temat, który za parę lat może nieźle zamieszać w świecie aplikacji webowych. Wysyłanie powiadomień, obsługa offline, błyskawiczna instalacja ze sklepu to opcje, które wkrótce będą dostępne dla web developerów.
Wszechobecne “apki” coraz częściej nie wymagają od nas instalowania ich na naszych urządzeniach. Progresywne web aplikacje wychodzą na przeciw temu trendowi i starają się jeszcze bardziej zniwelować różnicę między aplikacjami natywnymi, a webowymi. Wysyłanie powiadomień, obsługa offline, instalacja ze sklepu te opcje zawsze kojarzyły się z rozwiązaniami natywnymi, a już wkrótce staną się dostępne dla web developerów. Oczywiście nie wszystko jesteśmy w stanie zrobić z PWA. W tym podcaście staramy się odpowiedzieć na pytanie kiedy warto sięgnąć po tę technologię.
- 0:00 - Intro, ogłoszenia
- 2:30 - Przedstawienie gościa, rozgrzewkowe pytania
- 5:00 - Zainteresowanie PWA
- 7:20 - Uczelnia vs. Aplikacje PWA
- 8:20 - Do jakich rozwiązań PWA się nadaje?
- 11:00 - Zachowanie aplikacji w offline, aplikacje desktopowe
- 12:10 - Dodanie ikonki strony do pulpitu / ekranu startowego
- 13:20 - Wysyłanie powiadomień z aplikacji
- 14:30 - Wsparcie różnych przeglądarek (Safari, Edge, Chrome)
- 15:00 - Wdrażanie aplikacji PWA do sklepów
- 16:40 - Do jakich aplikacji PWA się NIE nadaje?
- 18:30 - Rady dla junior developerów osób
- 20:20 - Frameworki i biblioteki wspierające tworzenie progresywnych web aplikacji
- 22:00 - Service workery - po co i jak użyć?
- 25:00 - Testowanie swojego kodu
- 26:30 - Jak może wyglądać przyszłość aplikacji PWA
- 29:20 - Ciekawy projekt open-soruce Hospital Run (PWA używane do zbierania danych medycznych)
Linki, materiały do tego odcinka:
Podstawy:
ServiceWorker
https://developers.google.com/web/fundamentals/primers/service-workers
https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API)
FetchAPI
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
Książki:
-"Progresywne aplikacje webowe. Potęga aplikacji natywnych w przeglądarce" Tal Ater, O'reilly
-"Progressive Web Apps with Angular" Majid Hajian, Apress
Codelabs:
- PWA Fire's Codelabs: https://pwafire.org/developer/codelabs/index.html
- Your first PWA by Google (https://codelabs.developers.google.com/codelabs/your-first-pwapp/#0)
- Developing PWA 02: Offline quickstart: https://codelabs.developers.google.com/codelabs/pwa-offline-quickstart/#0
- Build PWA using workbox: https://codelabs.developers.google.com/codelabs/workbox-lab/index.html?index=..%2F..index#0,
Narzędzia:
- JavaScript Library for Service Worker - workbox (JS https://developers.google.com/web/tools/workbox),
- Chrome DevTools, Lighthouse (audit tests),
- Web Manifest Generator: https://pwafire.org/developer/tools/get-manifest/
- PWA Image (Icons) Generator: https://www.pwabuilder.com/imageGenerator
Youtube: Progressive Web App Training (Playlist)
Gość: Marta Wiśniewska (LinkedIn, Twitter)
Rozmawiał: Artur Chmaro (LinkedIn, Twitter)
Podobał Ci się ten materiał? Daj nam znać co o nim sądzisz!