Skip to content

Improve documentation for inbound and outbound webhooks #352

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/api/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"build": "next build",
"start": "next start",
"analyze": "ANALYZE=true pnpm build",
"stripe": "stripe listen --forward-to localhost:3002/webhooks/stripe",
"stripe": "stripe listen --forward-to localhost:3002/webhooks/payments",
"clean": "git clean -xdf .cache .turbo dist node_modules",
"format": "biome lint --write .",
"lint": "biome lint .",
Expand Down
4 changes: 2 additions & 2 deletions docs/features/analytics/product.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,8 @@ graph TD
A[User Action in App] -->|Triggers| B[Clerk Webhook]
A -->|Triggers| E[Stripe Webhook]
A -->|Client-Side Call| PostHog
B -->|Sends Data| C1[webhooks/clerk]
E -->|Sends Data| C2[webhooks/stripe]
B -->|Sends Data| C1[webhooks/authentication]
E -->|Sends Data| C2[webhooks/payments]

subgraph API
C1
Expand Down
6 changes: 1 addition & 5 deletions docs/features/authentication.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,4 @@ From here, you can use all the pre-built components and hooks provided by Clerk.

## Webhooks

Clerk uses webhooks to handle authentication events. These are handled in the `POST /webhooks/clerk` route in the `api` app. Make sure you enable the webhook events you need in your Clerk project settings.

### Local Development

Currently there's no way to easily test Clerk webhooks locally, so you'll have to test them in a staging environment. This means deploying your app to a "production" state Vercel project with development environment variables e.g. `staging-api.example.com`. Then you can add this URL to your Clerk project's webhook settings.
Clerk uses webhooks to handle authentication events and you can send these to your application. Read more about [inbound authentication webhooks](/features/webhooks/inbound#authentication-events).
8 changes: 2 additions & 6 deletions docs/features/payments.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Payments
description: In-app payments and webhooks with Stripe.
description: How next-forge handles payments and billing.
---

next-forge uses [Stripe](https://stripe.com/) by default for payments and billing. Implementing Stripe in your project is straightforward.
Expand All @@ -19,11 +19,7 @@ await stripe.prices.list();

## Webhooks

Stripe webhooks are handled in the `POST /webhooks/stripe` route in the `api` app. This route constructs the event and then switches on the event type to determine how to process the event.

### Local Development

To test webhooks locally, we've configured the Stripe CLI to forward webhooks to your local server. This will start automatically when you run `pnpm dev`.
next-forge has a pre-built webhook handler for payment events. Read more about [inbound payment webhooks](/features/webhooks/inbound#payment-events).

## Anti-Fraud

Expand Down
26 changes: 26 additions & 0 deletions docs/features/webhooks/inbound.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
---
title: Inbound Webhooks
description: Receive inbound webhooks from other services.
---

next-forge has pre-built webhook handlers for several key services.

## Payment Events

[Payment events](/features/payments) are handled in the `POST /webhooks/payments` route in the `api` app. This route constructs the event and then switches on the event type to determine how to process the event.

<Info>To test webhooks locally, we've configured the Stripe CLI to forward webhooks to your local server. This will start automatically when you run `pnpm dev`.</Info>

## Authentication Events

[Authentication events](/features/authentication) are handled in the `POST /webhooks/auth` route in the `api` app.

<Tip>Make sure you enable the webhook events you need in your Clerk project settings.</Tip>

### Local Development

Currently there's no way to easily test Clerk webhooks locally, so you'll have to test them in a staging environment. This means deploying your app to a "production" state Vercel project with development environment variables e.g. `staging-api.example.com`. Then you can add this URL to your Clerk project's webhook settings.

## Database Events

One of the most common use cases for inbound webhooks is to notify your application when a database record is created, updated, or deleted. This allows you to react to changes asynchronously, rather than polling the database, cron jobs or other methods.
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Webhooks
description: Send webhooks to your users using Svix.
title: Outbound Webhooks
description: Send outbound webhooks to your users using Svix.
---

next-forge supports sending webhooks to your users using [Svix](https://www.svix.com/). Svix is an enterprise-ready webhooks sending service.
Expand Down
2 changes: 1 addition & 1 deletion docs/migrations/authentication/better-auth.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -268,7 +268,7 @@ const fullOrganization = await auth.api.getFullOrganization({
});
```

```tsx webhooks/stripe/route.ts
```tsx webhooks/payments/route.ts
import { clerkClient } from '@repo/auth/server';

const clerk = await clerkClient();
Expand Down
10 changes: 2 additions & 8 deletions docs/migrations/payments/lemon-squeezy.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -47,15 +47,9 @@ export * from '@lemonsqueezy/lemonsqueezy.js';

## 4. Update the payments webhook handler

Remove the Stripe webhook handler from the API package...
Modify the payments webhook handler to use the Lemon Squeezy:

```sh Terminal
rm apps/api/app/webhooks/stripe/route.ts
```

... and create a new webhook handler for Lemon Squeezy:

```ts apps/api/app/webhooks/lemon-squeezy/route.ts
```ts apps/api/app/webhooks/payments/route.ts
import { NextResponse } from 'next/server';

export const POST = async (request: Request) => {
Expand Down
7 changes: 5 additions & 2 deletions docs/mint.json
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,10 @@
"features/storage",
"features/storybook",
"features/toolbar",
"features/webhooks",
{
"group": "Webhooks",
"pages": ["features/webhooks/inbound", "features/webhooks/outbound"]
},
{
"group": "SEO",
"pages": [
Expand Down Expand Up @@ -326,7 +329,7 @@
},
{
"source": "/webhooks",
"destination": "/features/webhooks"
"destination": "/features/webhooks/outbound"
},
{
"source": "/seo",
Expand Down
Loading