# Project

Webcam pose detection app using MediaPipe Tasks Vision. Vite + React 19 + TypeScript.

## Commands

- `npm run dev` - start dev server
- `npm run build` - typecheck then build (`tsc -b && vite build`)
- `npm run lint` - eslint
- `npm run preview` - preview production build

## Workflow

- Commit on your own after completing a reasonable chunk of work. Don't wait to be asked.

## Deploy

1. `npm run build` — typecheck + vite build
2. `npx vercel build --prod` — prepare Vercel output in `.vercel/output`
3. Copy output outside git repo and deploy from there (avoids commit author verification):
   ```
   rm -rf /tmp/vercel-deploy && mkdir -p /tmp/vercel-deploy/.vercel
   cp .vercel/project.json /tmp/vercel-deploy/.vercel/
   cp -r .vercel/output /tmp/vercel-deploy/.vercel/output
   cd /tmp/vercel-deploy && npx vercel deploy --prebuilt --prod
   ```
- Site: https://hackhackrevolution.xyz
- Vercel project: `project-zcx72` under `jorqsrazes-projects`

## Song Sources

- Fraxtil's Beast Beats [SM5] — 20 songs bundled with the game
- Just Dance (Lady Gaga) — simfile from https://zenius-i-vanisher.com/v5.2/viewsimfile.php?simfileid=35263

## Code guidelines

- **Modular architecture**: each file should have a single, clear responsibility. Extract logic into separate modules rather than growing large files.
- **Good abstractions**: group related logic into custom hooks, utility modules, or components. Keep rendering, state management, and business logic in separate layers.
- **Easy to maintain**: prefer small, focused functions and components. Name things clearly so intent is obvious without comments.
- Keep types in dedicated files (e.g. `types.ts`), not scattered across components.
- Use `type` imports for type-only imports (`import type { ... }`).
- No default exports for non-page components; use named exports.
