Author picture Phil Leggetter

SupaHooks: An Outbound Webhooks Next.js Template

Published

Article image

Although the biggest use of the Hookdeck event gateway is still for inbound webhooks, we've seen a growing number of developers leveraging the platform for outbound webhooks. SupaHooks is a Next.js template demonstrating the fundamentals of using Hookdeck as infrastructure for outbound webhooks.

The template is available on GitHub at hookdeck/supahooks.

Why outbound webhooks?

Webhooks are available on many of the platforms we commonly use in many of our applications, such as Stripe for payment notifications, Shopify for order updates, and GitHub for repository events. They represent events that have taken place within these external systems and allow us to write logic based on these notifications. Webhooks are commonly found in API and SaaS platforms.

So, triggering outbound webhooks enables platforms to send notifications to external systems when events occur within the platform so that external systems can react to these events. This is a common pattern for integrating systems and services.

SupaHooks outbound webhooks template

The SupaHooks template can be used as a starting point for a new Next.js application that needs to send outbound webhooks. The template functionality can also be copied or referenced when adding outbound webhook support to an existing application. The template includes utility functions that map Hookdeck concepts such as Sources, Destinations, and Connections to webhook subscriptions and publishing events to subscribers.

It provides the following functionality:

  • Signup and Login to the app with Supabase
  • Generate a unique webhook signing secret for each user
  • Create a webhook subscription to a user-defined URL
  • Publish test data to a webhook subscriber
  • Handle Supabase Database Webhooks and trigger events to the webhook subscriptions when data changes occur on an example products table
  • List and inspect the published webhook events, including headers and body
  • List and inspect webhook delivery attempts and the response status and body
  • Delete a webhook subscription

How to use the SupaHooks template

The template is available on GitHub at hookdeck/supahooks. Follow the README to get started and raise an issue with any questions or feedback you have.