---
title: React hooks overview
sidebarTitle: Overview
description: Using the Trigger.dev Realtime API from your React applications.
---

import RealtimeExamplesCards from "/snippets/realtime-examples-cards.mdx";

Our React hooks package provides a set of hooks that make it easy to interact with the Trigger.dev Realtime API from your React applications. You can use these hooks to subscribe to real-time updates, and trigger tasks from your frontend.

## Installation

Install the `@trigger.dev/react-hooks` package in your project:

<CodeGroup>

```bash npm
npm add @trigger.dev/react-hooks
```

```bash pnpm
pnpm add @trigger.dev/react-hooks
```

```bash yarn
yarn install @trigger.dev/react-hooks
```

</CodeGroup>

## Authentication

All hooks require authentication with a Public Access Token. Pass the token via the `accessToken` option:

```tsx
import { useRealtimeRun } from "@trigger.dev/react-hooks";

export function MyComponent({
  runId,
  publicAccessToken,
}: {
  runId: string;
  publicAccessToken: string;
}) {
  const { run, error } = useRealtimeRun(runId, {
    accessToken: publicAccessToken,
    baseURL: "https://your-trigger-dev-instance.com", // optional, only needed if you are self-hosting Trigger.dev
  });

  // ...
}
```

Learn more about [generating and managing tokens in our authentication guide](/realtime/auth).

## Available hooks

We provide several categories of hooks:

- **[Triggering hooks](/realtime/react-hooks/triggering)** - Trigger tasks from your frontend application
- **[Subscribe hooks](/realtime/react-hooks/subscribe)** - Subscribe to runs, batches, metadata, and more
- **[Streams hooks](/realtime/react-hooks/streams)** - Subscribe to real-time streams from your tasks
- **[SWR hooks](/realtime/react-hooks/swr)** - Fetch data once and cache it using SWR

## SWR vs Realtime hooks

We offer two "styles" of hooks: SWR and Realtime. The SWR hooks use the [swr](https://swr.vercel.app/) library to fetch data once and cache it. The Realtime hooks use [Trigger.dev Realtime](/realtime) to subscribe to updates in real-time.

<Note>
  It can be a little confusing which one to use because [swr](https://swr.vercel.app/) can also be
  configured to poll for updates. But because of rate-limits and the way the Trigger.dev API works,
  we recommend using the Realtime hooks for most use-cases.
</Note>