@happylinks/roomservice-browser
    TypeScript icon, indicating that this package has built-in type declarations

    0.4.8 • Public • Published

    @roomservice/browser

    Room Service helps you add real-time collaboration to your app. It's a real-time service with a built-in CRDT that automatically merges multiple people's state together without horrifying nightmare bugs. To learn more, see roomservice.dev.

    This is the official, javascript SDK.

    Install

    npm install --save @roomservice/browser

    Usage

    To get started, create a client with your Auth Endpoint.

    import RoomService from "@roomservice/browser";
    
    const client = new RoomService({
      authUrl: "https://mysite.com/auth/roomservice"
    });

    Next, we'll create a room client and try to connect to the room:

    const room = client.room("my-room");
    const { doc } = await room.init();

    Then, you can publish changes to the room:

    room.publishDoc(doc => {
      doc.title = "LaTeX: a Method of Obscuring Redundancy";
    });

    And listen for any incoming changes:

    room.onUpdate(newDoc => {
      console.log(newDoc);
    });

    Server Side Rendering

    To render on the server, you must include any headers that should be passed along to your auth endpoint. In most cases, this is just your session cookie.

    For example, in Next.js:

    const room = client.room("my-room");
    
    MyComponent.getInitialProps = async ctx => {
      const { doc } = await room.init({
        headers: {
          cookie: ctx.req.headers
        }
      });
    
      return { doc };
    };

    Keywords

    none

    Install

    npm i @happylinks/roomservice-browser

    DownloadsWeekly Downloads

    1

    Version

    0.4.8

    License

    MIT

    Unpacked Size

    260 kB

    Total Files

    24

    Last publish

    Collaborators

    • michielwesterbeek