- Frontend is Vite + React + TypeScript. Entry is
src/main.tsx, global styles live insrc/index.scss. - UI is split into
src/components(board, dice, players, notices) with shared exports insrc/components/index.ts. - Game state uses Redux Toolkit-esque patterns in
src/data(actions.ts,reducer.ts,selectors.ts,store.ts) plus JSON fixtures insrc/data/checkers-*.json. - Game logic utilities sit in
src/helpers(click handling, move validation, win checks). - Types live in
src/types; SVG assets insrc/icons; tests insrc/tests(integration, helpers, data). - Built assets output to
dist/; public HTML shell isindex.html.
- Install deps:
pnpm install(pnpm lockfile committed). Usenvm use(Node 20.12.2) first. - Local dev server with HMR:
pnpm dev. - Production build:
pnpm build(type-check viatsc, then Vite build). - Preview build locally:
pnpm preview. - Unit/integration tests:
pnpm test(Vitest, jsdom, coverage via v8 reporter). Watch mode:pnpm test:watch. - Lint and format:
pnpm lint(ESLint) andpnpm format(Prettier, WordPress config).
- Prettier (
@wordpress/prettier-config, 80-char print width) controls formatting; use tabs, single quotes, and Trailing commas as emitted. - ESLint extends
eslint:recommended,@typescript-eslint, and React Hooks; fix warnings before PRs. - Components, React files:
PascalCasefilenames and exports (e.g.,GameState.tsx); helpers and selectors:camelCase; Redux action/type constants: uppercase snake where applicable. - Keep components functional; prefer typed props and typed selectors/actions from
src/types. - Co-locate small styles in
index.scss; avoid inline global overrides unless necessary for board layout.
- Tests live in
src/testswith.test.tsnaming; integration suites cover game flow, rules, and dice behavior. Add new tests alongside the code they cover. - Use Vitest globals (
describe/it/expect) with jsdom environment; prefer deterministic fixtures using the JSON boards insrc/data. - Aim to extend coverage (v8 reporter) for new reducers, helpers, and components; include a failing test before fixing regressions when possible.
- Commit messages should be concise, present tense, and scoped (e.g.,
Add pip count helper,Fix dice roll validation). Avoid WIP in shared branches. - PRs should include: brief summary of changes, key commands run (tests/lint), and visual notes or screenshots if UI changes affect the board, dice, or notices.
- Link related issues/tasks when available; highlight any state shape changes in
src/typesorsrc/data/store.tsso reviewers can focus migrations.