React

Route, session, and click context from the app your customers use.

Take the write key

Everything this install sends is tagged with it, so one key per environment keeps staging out of your production numbers.

Generating…

Install

One package, in the service you are instrumenting.

npm i @clearplane/react

Add it to React

Paste this where the request path is assembled. The account callback is the only part you have to fill in — it is what turns a request into a customer.

tsx

import { Clearplane } from "@clearplane/react";

export function App({ children }) {
  return (
    <Clearplane writeKey={process.env.CLEARPLANE_KEY} account={org.id}>
      {children}
    </Clearplane>
  );
}

Name this install

Name it for the deployment rather than the framework. Two Next.js apps in one workspace is the normal case, and “Next.js” twice helps nobody.

Name

Environment

Events land in events_react and are queryable from Chat, models, and SQL.