Automerge-Repo Quickstart

This is an example local-first app using Automerge.

It demonstrates:

• Modeling data as Automerge Documents
• Managing Documents with an Automerge Repo:
  • Storing Documents in a client-side IndexedDb
  • Synchronizing Documents over Web Sockets
• Working with Automerge in React:
  • Using a RepoContext to expose a repo to UI components
  • Reading & updating documents with the useDocument hook

Installation

Clone the project, install its dependencies, and run yarn dev to start the local dev server.

$ git clone https://github.com/automerge/automerge-repo-quickstart.git
# Cloning into automerge-repo-quickstart...
$ cd automerge-repo-quickstart
$ yarn
# Installing project dependencies...
$ yarn dev
# Starting Vite dev server...

Navigate to http://localhost:5173 to see the app running.

You'll notice the URL change to append a hash with an Automerge document ID, e.g.:

http://localhost:5173/#automerge:8SEjaEBFDZr5n4HzGQ312TWfhoq

Open the same URL (including the document ID) in another tab or another browser to see each client's changes synchronize with all other active clients.