Ngrok Guide (For Webhook Testing)

Local Webhook Testing With Ngrok

This guide covers how to expose our local api-gateway to the internet using ngrok, so Resend's webhook can send requests to our backend during local testing.

Why We Need This

We are using Resend's webhook to keep track of all our outgoing emails. To use the webhook we need a publicly available URL to our api-gateway, which is a problem if you are running it locally. Therefore we use Ngrok to create a temporary public tunnel to our local server.

Setup Steps

1. Install ngrok

Local install:

pnpm add ngrok

Global install:

pnpm add -g ngrok

Note

I recommend using the local install but global should work.

2. Add auth token

The auth token will be shared privately

pnpm ngrok config add-authtoken <AUTH_TOKEN>

3. Start the tunnel

pnpm ngrok http 3001

After a second or two a public ngrok URL will be provided in console. Ex: https://example.ngrok-free.dev

4. Update the Resend webhook

In the Resend dashboard, navigate to the "Webhooks" page. There you must edit the existing webhook to use the URL:

<NEWLY_GENERATED_URL>/api/webhook/create

5. Close ngrok tunnel

Once your finished, close the public tunnel by typing CTRL + C in the terminal ngrok is running.

Important

• The ngrok URL changes every time you restart the tunnel, meaning you need to update the URL in Resend each time.
• Use ngrok sparingly since opening a public tunnel is not very safe.