Skip to main content

Getting Started


npm add replicache replicache-react-util

Serve Wasm Module#

Replicache uses Wasm internally. Most bundlers don't deal with this well yet, so it's easiest to just serve it as a static asset.

Copy the Replicache Wasm module to your static assets directory:

cp node_modules/replicache/out/*.wasm public/

You should add a postinstall script to do this in your app, so that it will stay up to date when you update Replicache.

Client Setup#

import {Replicache} from 'replicache';
import {useSubscribe} from 'replicache-react-util';
const rep = new Replicache({
// Put the correct path to on your server here.
wasmModule: '/replicache.wasm',
mutators: {
createTodo: (tx, args) => {
tx.put(`/todo/${}`, args);
function MyComponent() {
const todos = useSubscribe(
tx => tx.scan({prefix: '/todo/'}).toArray(),
const handleClick = () => {
id: Math.random().toString(32).substr(2),
order: todos.length,
text: 'new todo!',
// ...

Server Setup#

In order to sync, you will need to implement push an pull endpoints on your server.

For detailed information, see the integration guide, or the push/pull reference docs.