Developers
The default: an install step in tabs, one command per package manager, and a 25-line handler collapsed at 160px under the prose that explains it.
Install
The icon package is the only dependency the snippet examples on this page need. Pick your package manager.
npm
yarn
bun
npm i @untitledui/icons
Handle the webhook
Verify the signature before reading the body, return 401 when it does not match, and switch on the event type. The handler below is a route file; Show more opens the whole of it in place.
import { headers } from "next/headers";
import { NextResponse } from "next/server";
import { verifySignature } from "@/lib/webhooks";
export async function POST(request: Request) {
const signature = (await headers()).get("x-signature") ?? "";
const body = await request.text();
if (!verifySignature(body, signature, process.env.WEBHOOK_SECRET)) {
return NextResponse.json({ error: "Bad signature" }, { status: 401 });
}
const event = JSON.parse(body) as { type: string; data: unknown };
switch (event.type) {
case "invoice.paid":
await markInvoicePaid(event.data);
break;
case "customer.deleted":
await removeCustomer(event.data);
break;
}
return NextResponse.json({ received: true });
}