Back to the catalog

vue-pwa-starter knowledge

Bundle OKF 0.2 · 0 conceitos · alexanderop/workoutTimer

Open source Repository Open in the app JSON README (API)

About

# vue-pwa-starter knowledge

## What this is

A local-first Vue 3 PWA workout timer, built on this repo's starter template. Data lives in the browser (Dexie/IndexedDB) — no backend, no accounts. Mobile-first: the app shell, safe-area handling, and keyboard-aware sheets are the product. The `timer` feature (`src/features/timer/`) is the worked example every convention below points at.

When in doubt about a design call: does it keep interactions instant and the data on-device?

## How to read this

This file is the entry point. It holds the rules; the concept files it links hold the reasoning behind them, as an [Open Knowledge Format](https://github.com/GoogleCloudPlatform/knowledge-catalog/blob/main/okf/SPEC.md) v0.2 bundle — one concept per markdown file, YAML frontmatter (`type`, `title`, `description`, `tags`, `status`), relative links between them. Follow a link when your task touches it; do not read the tree top to bottom.

There is no `CLAUDE.md` and no `AGENTS.md`. A `SessionSta

Details

Kind
OKF bundles
Topic
AI, RAG & memory
Publisher
alexanderop
Origin
okf_github
Category
dados
Version
0.2
Open pull requests
1
Last push
2026-08-27T20:07:13Z
Repository state
ativo
Language
TypeScript
License
MIT
Added
2026-09-09 19:04:11
Updated
2026-09-09 19:04:11
Origin id
alexanderop/workoutTimer:docs/index.md

README

# Workout Timer

A local-first interval timer PWA for AMRAP, For Time, EMOM, and Tabata workouts. It is built from this repository's Vue starter and follows its Effect, Dexie, testing, accessibility, and offline-first patterns.

The product specification and source reference archive live in [`spec/smartwod-timer-clone`](spec/smartwod-timer-clone/). The archived Google Play images are design references only; the implemented interface and brand are original.

## Features

- Four configurable workout modes with an authoritative timestamp-based timer
- Countdown, pause/resume, round tracking, sound, vibration, and screen wake lock
- Crash and reload recovery for the single active workout
- Reusable presets with duplicate, edit, and delete actions
- Workout history, result notes, round splits, and session details
- English and German UI with light, dark, and system themes
- On-device IndexedDB storage plus validated JSON backup and restore
- Installable PWA that works offline with no account or backend

## Quickstart

```bash
pnpm install
pnpm dev
```

## Quality gates

```bash
pnpm check
pnpm test
pnpm test:a11y
pnpm test:visual
pnpm test:e2e
pnpm test:mutation
pnpm build
pnpm size-limit
```

`pnpm check` runs formatting, linting, type checking, dead-code analysis, unit tests, and architecture tests. The browser suites cover the timer journey, persisted recovery, accessibility, visual baselines, and the production service worker.

## Project map

```text
spec/smartwod-timer-clone/  Product specification and reference archive
src/features/timer/         Timer domain, feedback, and mode UI
src/db/                     Dexie schema, repositories, converters, and backup
src/stores/                 Shared reactive timer data
src/views/                  Route-level timer, history, preset, and settings pages
src/__tests__/              Unit, browser, a11y, architecture, and visual tests
test/e2e/                   Production-build BDD scenarios
```

The architectural boundaries are enforced by tests and lint rules. Feature code owns product behavior, the database layer owns storage, and views compose both without bypassing those seams. More detail is available in [`docs/`](docs/index.md).

## Stack

Vue 3.5 · TypeScript · Vite · Tailwind CSS · Effect · Dexie · Vue Router · vue-i18n · Zod · Vitest · Playwright · vite-plugin-pwa

## Privacy

Workout data stays on the device unless the user explicitly exports a backup. There are no accounts, analytics, advertisements, or network-dependent product features.

## License

[MIT](LICENSE)

More