> ## Documentation Index
> Fetch the complete documentation index at: https://novu-c5de82d9-docs-homepage-redesign.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Pushpad Push Integration with Novu

> Connect Pushpad to Novu to send push notifications through notification workflows. Step-by-step credential setup.

This guide walks you through the entire process of configuring and using [Pushpad](https://pushpad.xyz) with Novu, from getting your credentials to sending your first notification.

[Pushpad](https://pushpad.xyz) is a web push service that supports sending notifications to all major browsers via FCM, Mozilla autopush, Windows Push Notification Services, and APNS, with just one simple API.

## Configure Pushpad with Novu

Before you can send notifications, you need to connect your Pushpad project to Novu by getting your credentials and adding them to your integration settings.

### Step 1: Get your Pushpad credentials

To configure the Pushpad integration, you need:

* An active Pushpad account
* A Pushpad auth token (found in the [account settings](https://pushpad.xyz/access_tokens))
* Your Pushpad project ID (found in the project settings)

<Steps>
  <Step title="Log in to Pushpad">
    Log in to your Pushpad dashboard.
  </Step>

  <Step title="Create a project">
    Click **New project** to create a project.

    <img src="https://mintcdn.com/novu-c5de82d9-docs-homepage-redesign/sZb0_crTccuVjvw2/images/channels-and-providers/push/pushpad/new-project.png?fit=max&auto=format&n=sZb0_crTccuVjvw2&q=85&s=7ebf87a6459b70472cf0824a1b62527f" alt="New project" width="2880" height="1624" data-path="images/channels-and-providers/push/pushpad/new-project.png" />
  </Step>

  <Step title="Record the Project ID">
    Click **Settings** on the project page and record the **Project ID**. You need it to connect to Novu.

    <img src="https://mintcdn.com/novu-c5de82d9-docs-homepage-redesign/sZb0_crTccuVjvw2/images/channels-and-providers/push/pushpad/project-id.png?fit=max&auto=format&n=sZb0_crTccuVjvw2&q=85&s=414f1d71309575ce5ef446007a0e5f37" alt="Project ID" width="2880" height="1624" data-path="images/channels-and-providers/push/pushpad/project-id.png" />
  </Step>

  <Step title="Open access tokens">
    Navigate to the [access token](https://pushpad.xyz/access_tokens) page.
  </Step>

  <Step title="Add access token">
    Click **Add access token**.
  </Step>

  <Step title="Create the token">
    Fill in the required fields to create a new access token, or use your existing token if you already have one.

    <img src="https://mintcdn.com/novu-c5de82d9-docs-homepage-redesign/sZb0_crTccuVjvw2/images/channels-and-providers/push/pushpad/add-token.png?fit=max&auto=format&n=sZb0_crTccuVjvw2&q=85&s=6343b88d02fcec5e90862c1af67174b1" alt="Add access token" width="2880" height="1620" data-path="images/channels-and-providers/push/pushpad/add-token.png" />
  </Step>

  <Step title="Copy the token">
    Copy the generated token. You need it to connect to Novu.

    <img src="https://mintcdn.com/novu-c5de82d9-docs-homepage-redesign/sZb0_crTccuVjvw2/images/channels-and-providers/push/pushpad/access-token.png?fit=max&auto=format&n=sZb0_crTccuVjvw2&q=85&s=7cfdf3eac1f6fcbe03ca3347784a4486" alt="Generate access token" width="2880" height="1624" data-path="images/channels-and-providers/push/pushpad/access-token.png" />
  </Step>
</Steps>

### Step 2: Connect Pushpad to Novu

Add these credentials to your Pushpad integration in the Novu dashboard.

<Steps>
  <Step title="Log in to the Novu dashboard">
    Log in to the Novu dashboard.
  </Step>

  <Step title="Open Integration Store">
    On the Novu dashboard, navigate to the **Integration Store**.
  </Step>

  <Step title="Connect a provider">
    Click **Connect provider**.
  </Step>

  <Step title="Select Push tab">
    Click the **Push** tab.
  </Step>

  <Step title="Select Pushpad">
    Select **Pushpad**.
  </Step>

  <Step title="Paste credentials">
    In the Pushpad integration form, paste your access token and project ID from [Step 1](/platform/integrations/push/pushpad#step-1-get-your-pushpad-credentials) into the corresponding fields.

    <img src="https://mintcdn.com/novu-c5de82d9-docs-homepage-redesign/sZb0_crTccuVjvw2/images/channels-and-providers/push/pushpad/pushpad-integration.png?fit=max&auto=format&n=sZb0_crTccuVjvw2&q=85&s=fbcf7c6bc1d77a31cbfdc01c800d4ca4" alt="Pushpad Integration in Novu" width="2880" height="1624" data-path="images/channels-and-providers/push/pushpad/pushpad-integration.png" />
  </Step>

  <Step title="Create the integration">
    Click **Create Integration**.
  </Step>
</Steps>

## Using Pushpad with Novu

Once your integration is configured, in other to send push notification using the PushPad provider, you must do the following:

### Step 1: Add subscriber device token

After [setting up the Pushpad SDK](https://pushpad.xyz/docs/pushpad_pro_getting_started) on your website, you must [assign a user ID (uid)](https://pushpad.xyz/docs/identifying_users) to your users' push subscriptions.

This `uid` is the identifier Novu uses to target a specific browser. For example, if you use `pushpad('uid', 'user123')`, then `user123` is the ID you must register in Novu.

You can do this by making an API call to [update the subscriber's credentials](/api-reference/subscribers/update-provider-credentials).

<Tabs>
  <Tab title="Node.js">
    ```typescript theme={null}
    import { Novu } from '@novu/api';
    import { ChatOrPushProviderEnum } from "@novu/api/models/components";

    const novu = new Novu({
      secretKey: "<NOVU_SECRET_KEY>",
      // Required if using EU region
      // serverURL: "https://eu.api.novu.co",
    });

    await novu.subscribers.credentials.update(
      {
        providerId: ChatOrPushProviderEnum.PushPad,
        // Use integrationIdentifier to store device tokens for a specific integration
        integrationIdentifier: "pushpad-MnGLxp8uy",
        credentials: {
          deviceTokens: ["token1", "token2", "token3"],
        },
      },
      "subscriberId"
    );
    ```
  </Tab>

  <Tab title="cURL">
    ```bash theme={null}
    curl -L -X PUT 'https://api.novu.co/v1/subscribers/<SUBSCRIBER_ID>/credentials' \
    -H 'Content-Type: application/json' \
    -H 'Accept: application/json' \
    -H 'Authorization: ApiKey <NOVU_SECRET_KEY>' \
    -d '{
      "providerId": "pushpad",
      "deviceTokens": ['user123'],
      "integrationIdentifier": "pushpad-MnGLxp8uy"
    }'
    ```
  </Tab>
</Tabs>

### Step 2: Send a notification

Now you're ready to send a push notification. [Create a workflow with a Push step](/platform/workflow/create-a-workflow) and then trigger it. Novu sends the notification to the `uid`s associated with the subscriber.

The example below demonstrates a simple trigger using Novu’s SDK.

```typescript theme={null}
import { Novu } from '@novu/api';

const novu = new Novu({
  secretKey: "<NOVU_SECRET_KEY>",
  // Required if using EU region
  // serverURL: "https://eu.api.novu.co",
});

await novu.trigger({
  workflowId: "workflowId",
  to: {
    subscriberId: "subscriberId",
  },
  payload: {},
});
```
