Remix Setup Guide

Prerequisites

• Remix project with TypeScript
• Trigger.dev account + project created

Setup

1. Initialize

npx trigger.dev@latest init

2. Start Dev Server

npx trigger.dev@latest dev

3. Set Secret Key

Add to your .env file:

TRIGGER_SECRET_KEY=your-dev-secret-key

Triggering Tasks

Loader (GET)

// app/routes/api.hello-world.ts
import type { helloWorldTask } from "../../src/trigger/example";
import { tasks } from "@trigger.dev/sdk";

export async function loader() {
  const handle = await tasks.trigger<typeof helloWorldTask>(
    "hello-world",
    "James"
  );
  return new Response(JSON.stringify(handle), {
    headers: { "Content-Type": "application/json" },
  });
}

Visit http://localhost:3000/api/hello-world to trigger.

Deploy

npx trigger.dev@latest deploy

Deploying to Vercel Edge Functions

Update Route with Edge Config

// app/routes/api.hello-world.ts
import { tasks } from "@trigger.dev/sdk";

export const config = { runtime: "edge" };

export async function action({ request }: { request: Request }) {
  const payload = await request.json();
  const handle = await tasks.trigger("hello-world", payload);
  return new Response(JSON.stringify(handle), {
    headers: { "Content-Type": "application/json" },
  });
}

vercel.json

{
  "buildCommand": "npm run vercel-build",
  "framework": "remix",
  "outputDirectory": "build/client"
}

package.json Scripts

{
  "scripts": {
    "build": "remix vite:build",
    "vercel-build": "remix vite:build && cp -r ./public ./build/client"
  }
}

Test Production Endpoint

curl -X POST https://your-app.vercel.app/api/hello-world \
  -H "Content-Type: application/json" \
  -d '{"name": "James"}'