Reference

Examples

What each example app in the Jazz monorepo uniquely demonstrates.

The examples/ folder in the Jazz monorepo contains runnable apps that each highlight a different facet of Jazz — auth strategies, runtimes, framework bindings, server-side usage, or a specific product pattern. Use this table to jump straight to the example that covers the technique you need.

If you just want a bare-bones skeleton to build on, the starters/ folder ships minimal templates for Next.js, React, and SvelteKit, each in localfirst, betterauth, and hybrid flavours. You can also scaffold a new app from one of these templates with:

npm create jazz

Reach for the examples/ apps below when you want to see a specific pattern worked through end-to-end.

At a glance

ExampleStackUniquely demonstrates
auth-betterauth-chatNext.js + Better AuthBetter Auth tables stored in Jazz via jazz-tools/better-auth-adapter; Better Auth's jwt plugin issues the ES256 tokens and JWKS that the sync server verifies; demonstrates exposing user attributes (e.g. the admin plugin's role) as JWT claims that drive Jazz authorization
auth-simple-chatReact + Vite + ExpressBring-your-own JWT auth server: local Express issuing ES256 tokens, JWKS verified by the sync server, session.claims.role driving UI gating
auth-workos-chatReact + Vite + WorkOSHosted OAuth/SSO with no local auth server — sync server points at the WorkOS JWKS, getAccessToken() is passed straight to JazzProvider
chat-reactReact + VitePublic vs private rooms with invite links via ephemeral session.claims.join_code; emoji reactions; collaborative drawing canvases; chunked file attachments
cloudflare-worker-runtime-tsCloudflare WorkersBooting Jazz inside Workers by passing a precompiled WebAssembly.Module via runtimeSources.wasmModule — no browser asset URLs
file-upload-reactReact + ViteUploading and rendering images using the files / file_parts chunked-binary pattern
moon-lander-reactReact + ViteMultiplayer game state — player positions, fuel deposits, inventory, and chat — synced through Jazz with no custom networking code
nextjs-csr-ssrNext.js (App Router)The canonical SSR/RSC story: a Server Component reading via jazz-tools/backend alongside a Client Component using jazz-tools/react hooks, wired by withJazz
todo-client-localfirst-expoExpo (React Native)The React Native / Expo bindings end-to-end, with native Fjall storage and ExpoAuthSecretStore (backed by expo-secure-store) for local-first identity
todo-client-localfirst-reactReact + ViteFully client-side React app with local-first (anonymous, locally generated secret) auth; useAll with composable where(), useDb writes, OPFS persistence, attachDevTools
todo-client-localfirst-svelteSvelte 5 + ViteThe Svelte bindings: JazzSvelteProvider, QuerySubscription live queries, getDb writes
todo-client-localfirst-tsVanilla TypeScript + ViteThe low-level client API with no framework bindings: createDb, db.subscribeAll, db.onAuthChanged, BrowserAuthSecretStore
todo-server-rsRust (axum) + jazz-toolsUsing Jazz directly from Rust as the embedded database for an axum REST + SSE service — no browser, no WASM, no Node bindings
todo-server-tsNode + ExpressJazz as a server-side backend via jazz-tools/backend and NAPI Fjall storage; context.forSession(userId) for per-user policy; SSE live snapshots; wait({ tier }) durability
wequencerReact + Vite + Tone.jsClock-synchronised collaborative playback — ClockSync aligns peers to server epoch time, BPM nudged on drift; instrument samples stored as Jazz files
world-tourVue + Vite + MapLibre GLThe Vue bindings end-to-end in a non-trivial app (tour management with maps)

How the examples group together

  • The todo-client-localfirst-* family (-react, -svelte, -ts, -expo) all implement the same schema and feature set, so the diff between them is the framework binding. They cover the local-first baseline: anonymous identity, reactive queries, synchronous writes, OPFS persistence, optional server sync. See also Framework Patterns.
  • The auth-*-chat family (auth-betterauth-chat, auth-simple-chat, auth-workos-chat) all implement a role-gated chat against three different JWT-issuing auth setups, so the diff between them is the auth integration.
  • The server-side examples (todo-server-ts, todo-server-rs, nextjs-csr-ssr, cloudflare-worker-runtime-ts) show Jazz used as the database from a server runtime — Node, Rust, Next.js App Router, and Cloudflare Workers respectively.
  • The product-shaped examples (chat-react, moon-lander-react, wequencer, world-tour, file-upload-react) are full apps that lean on Jazz for a specific real-world pattern: real-time chat with invites and canvases, multiplayer game state, clock-synchronised collaborative playback, Vue + maps, and chunked binary uploads.

On this page