Liveblocks Collaboration

Real-time collaboration features with presence, cursors, and shared state.

Quick Setup

1

Install the CLI: npx @integrateapi/cli add liveblocks

2

Create a Liveblocks account at liveblocks.io

3

Add API keys to .env.local: LIVEBLOCKS_SECRET_KEY, NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY

4

Wrap collaborative components with RoomProvider

5

Customize presence types in lib/liveblocks/client.ts

What You Can Build

Show real-time cursors of other users

Display online user presence

Sync shared state across users

Build collaborative text editors

Installation Command

npx @integrateapi/cli add liveblocks