A comprehensive boilerplate for building real-time collaborative editing applications with Automerge, React, tRPC, and more.

Website incl. explanation videos: https://www.automerge-jumpstart.com/

pnpm install
docker-compose up

# in another tab
cd apps/backend
cp .env.example .env
npx @serenity-kit/opaque@latest create-server-setup
# copy the string value as OPAQUE_SERVER_SETUP .env
pnpm prisma migrate dev
pnpm prisma generate
pnpm dev

# in another tab
cd apps/frontend
pnpm dev

1. Make changes
2. Run pnpm prisma migrate dev
3. Run pnpm prisma generate
4. Restart the TS server in your editor

cd apps/backend
pnpm prisma studio

cd apps/backend
pnpm prisma migrate reset

see docs/setup-production-environment-and-ci.md

fly postgres connect -a automerge-jumpstart-db

# list dbs
\list;
# connect to a db
\c automerge_jumpstart;
# list tables
\dt
# query a table
SELECT * FROM "Document";

Note: Automerge version is pinned in the root package.json file to avoid issues arising from different automerge versions.

pnpm up --interactive
cd apps/app
pnpm up --interactive
cd apps/server
pnpm up --interactive

Users use OPAQUE to authenticate with the server. After Login the server creates a session in the database which includes Opaque's sessionKey. The sessionKey is used as bearer token to authenticate the user for authenticated requests and also to connect to the Websocket.