Shared collaborative state for Redux

Liveblocks empowers developers to embed performant collaborative features to any product in just days.

Companies of all sizes and industries use Liveblocks

Presence

Show who’s in a document

Add presence features to your product to make people feel like they’re together in the same room.

import { createStore } from "redux";import { createClient } from "@liveblocks/client";import { enhancer } from "@liveblocks/redux";
const client = createClient({ /* ... */ });
const initialState = {  cursor: { x: 0, y: 0 }}
const store = createStore(  (state = initialState, action) => { /* ... */ },  enhancer({    client,    // cursor is shared to other users in the room    presenceMapping: { cursor: true }  }));
// Get others people in the roomconst others = store.getState().liveblocks.others;
// And get their cursorsconst othersCursors = others  .map(user => user.presence?.cursor);

Storage

Shared real‑time document state

Use conflict‑free data types to enable people to edit the same document in real‑time.

Learn more

import { createStore } from "redux";import { createClient } from "@liveblocks/client";import { enhancer } from "@liveblocks/redux";
const client = createClient({ /* ... */ });
const initialState = {  scientist: {    firstName: "Ada",    lastName: "Lovelace"  }}
export const store = createStore(  (state = initialState, action) => { /* ... */ },  // Enhance your store and controls which parts  // of your states are synced and persisted  enhancer({    client,    // scientist is synced across clients    storageMapping: { scientist: true }  }));

Shared collaborative state for Redux

Companies of all sizes and industries use Liveblocks

Presence

Show who’s in a document

Storage

Shared real‑time document state

Start making your product collaborative with the Liveblocks toolkit today