Ben Blum

Case study

D&D party notebook

A static campaign notebook. The design uses Supabase as the sync coordinator, with row-level security and a synthetic demo seed.

The live URL is a placeholder until that app is deployed. It is not a running site.

Stack

  • Vite
  • Supabase Postgres
  • Supabase Realtime
  • Supabase Auth

Screenshots

Placeholder screenshot of the D&D party notebook surface. Not a capture of the running app.
Placeholder. Not a capture of the running app. Intended view: campaign notebook.
Placeholder screenshot of the D&D party notebook sync path. Not a capture of the running app.
Placeholder. Not a capture of the running app. Intended view: sync path between the browser and Supabase.

Problem

Players and a DM need a shared campaign notebook. Notes for one table should not be readable from another table.

Architecture

The low-level design specifies a Vite app served as static files, with Supabase as the sync coordinator.

  • Schema dnd holds campaigns, members, and sync_ops.
  • Row level security uses dnd.is_member. Anonymous sign-in is the demo auth mode.
  • Each campaign has a Realtime channel. RLS authorizes that channel.
  • The documented demo seed is a synthetic campaign named "The Lost Lantern". Personal dnd_* content is not seed data.

Decisions

  • Apps share one Supabase project, with a schema per app, because the free tier allows two active projects. The dnd schema is the isolation boundary for this app.
  • The tables above are a baseline. The design says the final schema has to match the existing sync coordinator, and that a later pass checks the code against that protocol.
  • A public copy is a new squashed repository. The design does not flip the private repository to public.

Tests

The finish spec names CI with lint, a suite it describes as 45 tests, the production build, and an end-to-end smoke test. This page did not run that suite.

Sources

The benforcapita/dnd-party-notebook README was not available while this page was written (the GitHub API responded not found). The sections above follow the portfolio low-level design.

All projects