A small, offline-first practice tracker for putting + chipping sessions, built to be installed on an iPhone from Safari via Share → Add to Home Screen. No accounts, no backend, no analytics — everything is stored on-device in IndexedDB.
Live app: https://dpiganell.github.io/golf-practice/
Plain HTML/CSS/JS (ES modules), zero dependencies, no build step. Hosted on GitHub
Pages, served straight from the main branch — every push to main redeploys the
site automatically.
| File | Purpose |
|---|---|
index.html |
App shell + bottom tab bar |
styles.css |
Mobile-first styles, light + dark via prefers-color-scheme |
app.js |
Screens, session flow, steppers/segments, autosave |
templates.js |
Practice template registry + metrics, comparisons, summary text |
db.js |
IndexedDB wrapper (sessions + prefs stores) |
charts.js |
Dependency-free SVG trend charts for the Progress tab |
sw.js |
Offline cache (bump VERSION on each deploy) |
Add an entry to TEMPLATES in templates.js. Drills are declarative:
kind: 'info'— instructions onlykind: 'form'—fieldsof{type: 'stepper' | 'segment'}, optionalsumconstraint (max,exact) andlivederived statskind: 'holes'— n score-entry rows with a three-putt flag
The drill UI, autosave, resume, history and summary all render from that shape. To
surface a new template's numbers in Progress/History, extend computeMetrics and
PROGRESS_METRICS.
python3 -m http.server 8000
# open http://localhost:8000Service workers require HTTPS or localhost. After changing any cached file, bump
VERSION in sw.js so installed clients pick up the update.