You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/guides/frameworks/nextjs.mdx
+14-1Lines changed: 14 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -45,7 +45,7 @@ For more information on authenticating with Trigger.dev, see the [API keys page]
45
45
46
46
## Triggering your task in Next.js
47
47
48
-
Here are the steps to trigger your task in the Next.js App and Pages router and Server Actions. Alternatively, check out this repo for a [full working example](https://github.com/triggerdotdev/example-projects/tree/main/nextjs/server-actions/my-app) of a Next.js app with a Trigger.dev task triggered using a Server Action.
48
+
Here are the steps to trigger your task in the Next.js App and Pages router and Server Actions.
49
49
50
50
<Tabs>
51
51
@@ -432,5 +432,18 @@ You can test your revalidation task in the Trigger.dev dashboard on the testing
432
432
<NextjsTroubleshootingMissingApiKey/>
433
433
<NextjsTroubleshootingButtonSyntax/>
434
434
435
+
## Realtime updates with React hooks
436
+
437
+
The `@trigger.dev/react-hooks` package lets you subscribe to task runs from your React components. Show progress bars, stream AI responses, or display run status in real time.
Copy file name to clipboardExpand all lines: docs/guides/frameworks/remix.mdx
+13Lines changed: 13 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -197,6 +197,19 @@ The `vercel-build` script in `package.json` is specific to Remix projects on Ver
197
197
198
198
The `runtime: "edge"` configuration in the API route allows for better performance on Vercel's Edge Network.
199
199
200
+
## Realtime updates with React hooks
201
+
202
+
The `@trigger.dev/react-hooks` package lets you subscribe to task runs from your React components. Show progress bars, stream AI responses, or display run status in real time.
description: "How to get started in 3 minutes using the CLI and SDK."
2
+
title: "Quick start: add Trigger.dev to your project"
3
+
sidebarTitle: "Quick start"
4
+
description: "Set up Trigger.dev in your existing project in under 3 minutes. Install the SDK, create your first background task, and trigger it from your code."
Using an AI coding assistant? Copy this prompt and paste it into Claude Code, Cursor, Copilot, Windsurf, or any AI tool. It'll handle the setup for you.
12
15
16
+
<Accordiontitle="Copy the setup prompt">
17
+
18
+
```text
19
+
Help me add Trigger.dev to this project.
20
+
21
+
## What to do
22
+
23
+
1. I need a Trigger.dev account. If I don't have one, point me to https://cloud.trigger.dev to sign up. Wait for me to confirm.
24
+
2. Run `npx trigger.dev@latest init` in the project root.
25
+
- When it asks about the MCP server, recommend I install it (best DX: gives you direct access to Trigger.dev docs, deploys, and run monitoring).
26
+
- Install the "Hello World" example task when prompted.
27
+
3. Run `npx trigger.dev@latest dev` to start the dev server.
28
+
4. Once the dev server is running, test the example task from the Trigger.dev dashboard.
29
+
5. Set TRIGGER_SECRET_KEY in my .env file (or .env.local for Next.js). I can find it on the API Keys page in the dashboard.
30
+
6. Ask me what framework I'm using and show me how to trigger the task from my backend code.
31
+
32
+
If I've already run init and want the MCP server, run: npx trigger.dev@latest install-mcp
33
+
34
+
## Critical rules
35
+
36
+
- ALWAYS import from `@trigger.dev/sdk`. NEVER import from `@trigger.dev/sdk/v3`.
37
+
- NEVER use `client.defineJob()` — that's the deprecated v2 API.
38
+
- Use type-only imports when triggering from backend code to avoid bundling task code:
39
+
40
+
import type { myTask } from "./trigger/example";
41
+
import { tasks } from "@trigger.dev/sdk";
42
+
43
+
const handle = await tasks.trigger<typeof myTask>("hello-world", { message: "Hello from my app!" });
- AI tooling: https://trigger.dev/docs/building-with-ai
50
+
```
51
+
52
+
</Accordion>
53
+
54
+
## Manual setup
13
55
14
56
<StepstitleSize="h3">
15
57
@@ -26,20 +68,30 @@ Sign up at [Trigger.dev Cloud](https://cloud.trigger.dev) (or [self-host](/open-
26
68
27
69
</Steps>
28
70
71
+
## Triggering tasks from your app
72
+
73
+
The test page in the dashboard is great for verifying your task works. To trigger tasks from your own code, you'll need to set the `TRIGGER_SECRET_KEY` environment variable. Grab it from the API Keys page in the dashboard and add it to your `.env` file.
74
+
75
+
```bash .env
76
+
TRIGGER_SECRET_KEY=tr_dev_...
77
+
```
78
+
79
+
See [Triggering](/triggering) for the full guide, or jump straight to framework-specific setup for [Next.js](/guides/frameworks/nextjs), [Remix](/guides/frameworks/remix), or [Node.js](/guides/frameworks/nodejs).
80
+
29
81
## Next steps
30
82
31
83
<CardGroupcols={2}>
32
84
<Cardtitle="Building with AI"icon="brain"href="/building-with-ai">
33
-
Learn how to build Trigger.dev projects using AI coding assistants
85
+
Build Trigger.dev projects using AI coding assistants
34
86
</Card>
35
87
<Cardtitle="How to trigger your tasks"icon="bolt"href="/triggering">
Copy file name to clipboardExpand all lines: docs/realtime/auth.mdx
+4Lines changed: 4 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -141,6 +141,10 @@ By default, auto-generated tokens expire after 15 minutes and have a read scope
141
141
142
142
See our [triggering documentation](/triggering) for detailed examples of how to trigger tasks and get auto-generated tokens.
143
143
144
+
<Note>
145
+
**Where should I create tokens?** The standard pattern is to create tokens in your backend code (API route, server action) after triggering a task, then pass the token to your frontend. The `handle.publicAccessToken` returned by `tasks.trigger()` already does this for you. You rarely need to create tokens inside a task itself.
146
+
</Note>
147
+
144
148
### Subscribing to runs with Public Access Tokens
145
149
146
150
Once you have a Public Access Token, you can use it to authenticate requests to the Realtime API in both backend and frontend applications.
Use these backend functions to subscribe to runs and streams from your server-side code or other tasks.
9
+
**Subscribe to runs from your server-side code or other tasks using async iterators.** Get status updates, metadata changes, and streamed data without polling.
10
10
11
-
## Overview
11
+
## What's available
12
12
13
-
There are three main categories of functionality:
14
-
15
-
-**[Subscribe functions](/realtime/backend/subscribe)** - Subscribe to run updates using async iterators
16
-
-**[Metadata](/realtime/backend/subscribe#subscribe-to-metadata-updates-from-your-tasks)** - Update and subscribe to run metadata in real-time
17
-
-**[Streams](/realtime/backend/streams)** - Read and consume real-time streaming data from your tasks
13
+
| Category | What it does | Guide |
14
+
|---|---|---|
15
+
|**Run updates**| Subscribe to run status, metadata, and tag changes |[Run updates](/realtime/backend/subscribe)|
16
+
|**Streaming**| Read AI output, file chunks, or any continuous data from tasks |[Streaming](/realtime/backend/streams)|
18
17
19
18
<Note>
20
-
To learn how to emit streams from your tasks, see our [Realtime Streams](/tasks/streams) documentation.
19
+
To learn how to emit streams from your tasks, see [Streaming data from tasks](/tasks/streams).
0 commit comments