Sign in

Quickstart - Get started with receiving custom notifications webhook events using Liveblocks and Next.js

Liveblocks is a realtime collaboration infrastructure for building performant collaborative experiences. Follow this guide to receive webhooks events for custom notifications using methods from @liveblocks/node.

Quickstart

  1. Install Liveblocks Node

    Every Liveblocks package should use the same version.

    Terminal
    npm install @liveblocks/node

  2. Trigger a custom notification

    Trigger a custom notification using triggerInboxNotification from a server action or route handler. In this example, a custom $fileUploaded notification is sent.

    "use server";
    import { Liveblocks } from "@liveblocks/node";
    const liveblocks = new Liveblocks({  secret: "",});
    // Call this in your app to create a custom notificationexport async function triggerCustomNotification() {  await liveblocks.triggerInboxNotification({    // The user that will receive the notification    userId: "steven@example.com",    kind: "$fileUploaded",    subjectId: "my-file",
        // Custom data for this notification    activityData: {      file: "https://example.com/my-file.zip",      status: "pending",    },  });}

  3. Follow our guide

    Follow our step-by-step guide to learn set up webhooks notifications.

    How to notify users with webhooks

What to read next

Congratulations! You've set up webhooks notifications in your Next.js application.

Examples using Notifications