Skip to content

Repository files navigation

PWA Skeleton

A runnable, purpose-agnostic Progressive Web App shell.

Live: https://dotmonk.github.io/pwa_skeleton/

Use it as the starting point for a new local-first PWA: swap branding, replace the demo Items domain, and ship.

Features

  • Installable PWA — manifest with stable id, custom service worker, user-triggered update on deploy
  • Install UXbeforeinstallprompt button, iOS Add-to-Home-Screen hints, welcome splash
  • Local-only data — IndexedDB with revision guards, cross-tab sync, export/import backup, reset
  • Resilience — ErrorBoundary with export + cache clear, read-failure and stale-tab banners
  • App shell — fixed header, bottom tabs, safe-area insets, light/dark theme
  • Demo domain — simple Items CRUD so the shell is runnable out of the box
  • Quality gates — ESLint (hooks), Vitest, headless Chrome smoke (offline / deploy / two-tabs)
  • Deploy — GitHub Actions → GitHub Pages; SW cache version + asset list stamped at build time

Section navigation is in-memory only (not restored across reloads).

Develop

npm install
npm run dev
npm run build
npm run preview
npm test
npm run lint
npm run test:smoke   # needs a prior build + Chrome

Customize

What Where
App name / base path package.json, vite.config.ts (base), index.html, manifest.json, public/sw.js cache prefix
Brand mark / icon src/components/AppMark.tsx, public/icon.svg
Theme tokens src/styles/global.css
Domain model src/types.ts, src/context/AppContext.tsx, src/components/sections/
Tabs src/components/BottomNav.tsx, src/App.tsx

About

A skeleton for PWA apps based on my preferences

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages