Skip to content

README.md

Latest commit

 

History

History
73 lines (54 loc) · 1.81 KB

README.md

File metadata and controls

73 lines (54 loc) · 1.81 KB
Raw

PerplexImage

Puzzle game built with Nuxt 3. Players complete image puzzles fetched from Supabase with drag-and-drop gameplay, timers, and move counters.

Quick Start

pnpm install
pnpm dev

Open http://localhost:3000

Features

  • Three difficulty levels: 9×13, 15×23, 20×30 tiles
  • Drag-and-drop gameplay: Move puzzle pieces to complete the image
  • Real-time stats: Timer and move counter
  • Responsive design: Works on mobile, tablet, and desktop
  • Image selection: Browse and select
  • Game controls: Pause, reset, and view progress

Tech Stack

  • Nuxt 3 + Vue 3 Composition API
  • TypeScript for type safety
  • Pinia for state management
  • Tailwind CSS for styling
  • Playwright for E2E testing
  • Vitest for unit testing
  • Supabase for puzzle images

Commands

pnpm dev              # Start dev server
pnpm build            # Build for production
pnpm test             # Run unit tests
pnpm test:e2e         # Run E2E tests
pnpm test:e2e:ui      # Interactive test UI
pnpm lint             # Check code quality
pnpm lintfix          # Auto-fix linting issues
pnpm typecheck        # TypeScript validation

Project Structure

/modules
  /core        - Shared utilities, store, types
  /game        - Game pages, components, logic
  /ui          - Generic UI components
/tests
  /e2e         - Playwright E2E tests
  /units       - Vitest unit tests
/server/api    - Backend API routes (Supabase proxy)

Development

See CLAUDE.md for detailed architecture, testing patterns, and development workflow.

Testing

All changes must pass:

  • TypeScript: pnpm typecheck
  • Unit tests: pnpm test
  • E2E tests: pnpm test:e2e
  • Linting: pnpm lint

Pre-commit hooks (Husky) enforce linting automatically.