pluv.io
DocsQuickstart
GitHubNpm

Create Client

Generally, it is recommended to use framework-specific bindings for your particular UI framework such as @pluv/react. However, if your selected framework isn't yet supported, you can create a framework-agnostic pluv.io client to add automatic type-safe real-time to any app.

Creating a PluvClient

Note: These examples assume that you've already created a backend pluv.io instance. Refer to the quickstart to learn more.

Install dependencies

 
1# For the frontend
2npm install @pluv/client
3# Frontend peer-dependencies
4npm install react react-dom yjs zod

Define a frontend PluvClient

 
1// frontend/io.ts
2

3import { createClient } from "@pluv/client";
4// Import the type from your backend @pluv/io instance.
5import { type AppPluvIO } from "server/io";
6

7const client = createClient<AppPluvIO>({
8    // Optional. Defaults to (room) => `/api/pluv/room/${room}`
9    wsEndpoint: (room: string): string => {
10        // Specify the ws endpoint to connect to 
11        return `http://localhost:3000/api/room?room=${room}`;
12    },
13});

Next steps