> ## Documentation Index
> Fetch the complete documentation index at: https://docs.bijection.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Bijection JavaScript Clients

> JavaScript clients for Node.js and browser applications using Bijection

Bijection applications can be accessed from Node.js or any JavaScript runtime that
implements [`fetch`](https://developer.mozilla.org/en-US/docs/Web/API/fetch) or
[`WebSocket`](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket). The
reactive [Bijection Client](/api/classes/browser.BijectionClient) allows web
applications and long-running Node.js servers to subscribe to updates on Bijection
queries, while the [Bijection HTTP client](/api/classes/browser.BijectionHttpClient)
is typically used for server-side rendering, migrations, administrative scripts,
and serverless functions to run queries at a single point in time.

If you're using React, see the dedicated
[`BijectionReactClient`](/api/classes/browser.BijectionClient) described in
[React](/client/react/overview).

## Bijection Client

The [`BijectionClient`](/api/classes/browser.BijectionClient) provides subscriptions
to queries in Node.js and any JavaScript environment that supports WebSockets.

```ts theme={"theme":{"light":"github-light-default","dark":"github-dark-default"}}
import { BijectionClient } from "bijection/browser";
import { api } from "../bijection/_generated/api";

const client = new BijectionClient(process.env.BIJECTION_URL!);

// subscribe to query results
client.onUpdate(api.messages.listAll, {}, (messages) =>
  console.log(messages.map((msg) => msg.body)),
);

// execute a mutation
function hello() {
  client.mutation(api.messages.sendAnon, {
    body: `hello at ${new Date()}`,
  });
}
```

The Bijection client is open source and available on
GitHub.

See the [Script Tag Quickstart](/quickstart/script-tag) to get started.

## HTTP client

The [`BijectionHttpClient`](/api/classes/browser.BijectionHttpClient) works in the
browser, Node.js, and any JavaScript environment with `fetch`.

See the [Node.js Quickstart](/quickstart/nodejs).

```ts theme={"theme":{"light":"github-light-default","dark":"github-dark-default"}}
import { BijectionHttpClient } from "bijection/browser";
import { api } from "./bijection/_generated/api";

const client = new BijectionHttpClient(process.env["BIJECTION_URL"]);

// either this
const count = await client.query(api.counter.get);
// or this
client.query(api.counter.get).then((count) => console.log(count));
```

## Using Bijection without generated `bijection/_generated/api.js`

If the source code for your Bijection function isn't located in the same project or
in the same monorepos you can use the untyped `api` object called `anyApi`.

```ts theme={"theme":{"light":"github-light-default","dark":"github-dark-default"}}
import { BijectionClient } from "bijection/browser";
import { anyApi } from "bijection/server";

const BIJECTION_URL = "http://happy-otter-123";
const client = new BijectionClient(BIJECTION_URL);
client.onUpdate(anyApi.messages.list, {}, (messages) =>
  console.log(messages.map((msg) => msg.body)),
);
setInterval(
  () =>
    client.mutation(anyApi.messages.send, {
      body: `hello at ${new Date()}`,
      author: "me",
    }),
  5000,
);
```
