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

# Initialization

> Install and set up Signal JS in your React app

# React — Initialization

Install the React integration and wrap your app with the provider so all components can use Signal.

## Installation

```bash theme={null}
npm install @signal-js/react
```

`@signal-js/react` includes the browser SDK (`@signal-js/browser`). You do not need to install `@signal-js/browser` separately.

## Provider setup

Wrap your app with `SignalProvider` at the root (e.g. in `main.tsx` or `App.tsx`). Pass `options` with your API key and project ID. The `endpoint` is optional and defaults to `https://api.trysignal.ai/`.

```tsx theme={null}
import { SignalProvider } from '@signal-js/react';

function App() {
  return (
    <SignalProvider
      options={{
        apiKey: 'your-api-key',
        projectId: 'your-project-id',
      }}
    >
      <YourApp />
    </SignalProvider>
  );
}
```

## Provider props

| Prop        | Type            | Default  | Description                                                                                                                                                                       |
| ----------- | --------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `options`   | `SignalOptions` | required | Browser SDK config. Required: `apiKey`, `projectId`. Optional: `endpoint` (defaults to `https://api.trysignal.ai/`). See [Configuration](/docs/integrations/react/configuration). |
| `autoStart` | `boolean`       | `true`   | Start recording when the provider mounts                                                                                                                                          |
| `children`  | `ReactNode`     | required | Your app tree                                                                                                                                                                     |

Recording starts automatically when the provider mounts unless `autoStart` is `false`. Use hooks like `useSignal()` or `useSignalCapture()` inside any child component to capture events or identify users.

## Next steps

* [Capture events](/docs/integrations/react/capture)
* [Identify users](/docs/integrations/react/identify)
* [Configuration](/docs/integrations/react/configuration)