Data Puzzles Lab

Solve detective-style SQL cases directly in the browser. Everything runs locally with sql.js (SQLite in WASM).

Demo

• https://data-puzzles-lab.netlify.app/

Run locally

npm install
npm run dev

Build

npm run build

Add a new case

1. Add assets:
   • Shared suspect image: public/assets/suspect.png
   • Evidence images per case: public/assets/cases/<case-id>/Evidence_1.png (add Evidence_2.png, Evidence_3.png, etc.)
2. Add a new case object in src/cases.js with:
   • id (must match the assets folder name)
   • title, difficulty, description
   • story
   • objectives (array of strings)
   • starterQueries (array of SQL strings)
   • solutionFields (array of { key, label, placeholder })
   • checkSolution(values) (returns { ok, message })
   • seedSql (SQL string to create + populate tables)
   • suspectImage (path to the shared suspect image)
   • evidenceImages (array of evidence image paths)

Notes

• SQL runs in-memory in the browser using sql.js.