Intro: What is a PWA?
The three pillars (capable, reliable, installable), HTTPS, and Lighthouse. Start →
PWA — From Zero to Hero
A standalone, beginner→advanced course on Progressive Web Apps. Learn the manifest, service workers, caching, and offline — with runnable examples in StackBlitz — then apply PWAs in React, Astro, and Svelte.
What you’ll learn
Section titled “What you’ll learn”Web App Manifest
manifest.webmanifest, icons & maskable, display/theme, the install prompt. Learn →
Service Workers
Registration, lifecycle, the fetch event, and updates. Dive in →
Caching Strategies
Cache Storage API, cache-first/network-first, SWR, Workbox. Cache →
Offline & App Shell
Offline fallback, the app-shell model, IndexedDB, background sync. Go offline →
Push & Advanced
Notifications, the Push API, badging, share target, periodic sync. Engage →
PWA with React
vite-plugin-pwa, registerSW, an update-prompt UI. React →
PWA with Astro
@vite-pwa/astro, manifest config, SSG/SSR strategies. Astro →
PWA with Svelte
@vite-pwa/sveltekit, the $service-worker module, update flow. Svelte →
How this course works
Section titled “How this course works”Runnable in StackBlitz
“Open in StackBlitz” launches a real PWA — service worker + manifest, installable — no local setup.
Diagrams that explain
Service-worker lifecycle, caching flows, and push sequences as Mermaid diagrams.
Framework sessions
Apply everything in React, Astro, and Svelte with the current PWA plugins.
Bilingual + read mode
English and ไทย, quizzes with saved progress, and a distraction-free read mode.