React

import { InstallPackage } from "@/components/docs/InstallPackage";

Getting Started

See the React quickstart guide for getting started.

Install

Minimal Client

Stateless vs Stateful

Getting Actors

Connection Parameters

Subscribing to Events

Connection Lifecycle

Low-Level HTTP & WebSocket

Use the JavaScript client for raw HTTP and WebSocket access:

import { createClient } from "rivetkit/client";

const client = createClient();
const handle = client.chatRoom.getOrCreate(["general"]);

const response = await handle.fetch("history");
const history = await response.json();

const ws = await handle.webSocket("stream");
ws.addEventListener("message", (event) => {
  console.log("message:", event.data);
});
ws.send("hello");

Calling from Backend

Use the JavaScript client on your backend (Node.js/Bun). See the JavaScript client docs.

Error Handling

Concepts

Keys

Keys uniquely identify actor instances. Use compound keys (arrays) for hierarchical addressing:

Don't build keys with string interpolation like "org:${userId}" when userId contains user data. Use arrays instead to prevent key injection attacks.

Environment Variables

createRivetKit() (and the underlying createClient() instance) automatically read:

• RIVET_ENDPOINT
• RIVET_NAMESPACE
• RIVET_TOKEN
• RIVET_RUNNER

Defaults to http://localhost:6420 when unset. RivetKit runs on port 6420 by default.

Endpoint Format

Endpoints support URL auth syntax:

https://namespace:[email protected]

You can also pass the endpoint without auth and provide RIVET_NAMESPACE and RIVET_TOKEN separately. For serverless deployments, use your app's /api/rivet URL. See Endpoints for details.

API Reference

Package: @rivetkit/react

• createRivetKit - Create hooks for React
• useActor - Hook for actor instances