Getting started with Trystero

Install

npm i trystero

Join a room

Use a unique, stable appId for your app. Peers need the same app ID, room ID, and signaling strategy to discover each other. A room ID can be a document ID, lobby code, or any string you agree on.

import {joinRoom, selfId} from 'trystero'

const room = joinRoom(
  {appId: 'com.example.notes'},
  'project-42'
)

console.log('my peer id is', selfId)

room.onPeerJoin = peerId => {
  console.log(peerId, 'joined')
}

room.onPeerLeave = peerId => {
  console.log(peerId, 'left')
}

Open your app in two tabs. Wait for onPeerJoin before sending data to a peer. Joining returns a room immediately; connections happen asynchronously. Calling joinRoom() again with the same namespace returns the existing room.

Send your first action

Create the same named action in each tab. Actions serialize objects for you and also accept strings, files, and typed arrays. Here, editor and updateNote() belong to your app.

const note = room.makeAction('note')

note.onMessage = ({id, text}, {peerId}) => {
  updateNote(id, text, peerId)
}

editor.oninput = () => {
  note.send({
    id: currentNoteId,
    text: editor.value
  })
}

Clean up when you leave

Call await room.leave() when the user leaves the room or your component unmounts. Peer handlers are assignable callback properties: replace them by assignment, or clear them with null.

The default package uses public Nostr relays for signaling. You can choose another strategy or configure TURN for peers that cannot connect directly.