Integrations / Frameworks / Remix

๐Ÿ’ฟ

Remix

Drop LogIt into Remix action functions or resource routes to get notified on signups, payments, and any custom milestone.


Install

bash
npm install logit

Initialize

ts
// app/lib/logit.server.ts
import { init } from "logit";

export const logit = init({ token: process.env.LOGIT_API_KEY! });

Note the .server.ts suffix โ€” Remix strips server-only modules from the client bundle automatically.

In an action

ts
// app/routes/signup.tsx
import type { ActionFunctionArgs } from "@remix-run/node";
import { logit } from "~/lib/logit.server";

export async function action({ request }: ActionFunctionArgs) {
  const formData = await request.formData();
  const email = String(formData.get("email"));

  // ... persist user

  await logit.now("signups", {
    event: "New user signed up",
    description: `${email} joined`,
    icon: "๐Ÿ‘ค",
    notify: true,
    tags: { source: "remix-form" },
    metadata: { email },
  });

  return { ok: true };
}

In a resource route

ts
// app/routes/webhooks.stripe.ts
import type { ActionFunctionArgs } from "@remix-run/node";
import { logit } from "~/lib/logit.server";

export async function action({ request }: ActionFunctionArgs) {
  const payload = await request.json() as { type: string };

  await logit.now("payments", {
    event: `Stripe: ${payload.type}`,
    icon: "๐Ÿ’ณ",
    notify: payload.type === "checkout.session.completed",
  });

  return new Response("ok");
}

Environment variable

bash
LOGIT_API_KEY=lk_live_xxxxxxxxxxxxxxxx

Ready to connect Remix?

7-day free trial. No credit card required.

Start free