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
# For the frontend
npm install @pluv/client
Define a frontend PluvClient
// frontend/io.ts
import { createClient } from "@pluv/client";
// Import the type from your PluvServer instance.
import { type AppPluvIO } from "server/io";
const client = createClient({
infer: (i) => ({ io: i<AppPluvIO> }),
// Optional. Defaults to ({ room }) => `/api/pluv/room/${room}`
wsEndpoint: ({ room }): string => {
// Specify the ws endpoint to connect to
return `ws://localhost:3000/api/room?room=${room}`;
},
});