> ## 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 web push notifications through workflows. Store your Pushpad project ID and auth token in the Novu dashboard for delivery.

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">
    Open your Pushpad dashboard and sign in.
  </Step>

  <Step title="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">
    Generate a token in Pushpad and paste it into the integration form.
  </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">
    Open the [Novu Dashboard](https://dashboard.novu.co).
  </Step>

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

  <Step title="Connect a provider">
    In the **Integration Store**, click **Connect provider** to begin setup.
  </Step>

  <Step title="Select Push tab" />

  <Step title="Select Pushpad">
    In the **Push** tab, choose **Pushpad** from the provider list.
  </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">
    Review your credentials, then click **Create Integration** to save.
  </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,
        integrationIdentifier: "pushpad-MnGLxp8uy",
        credentials: { deviceTokens: ["token1", "token2", "token3"] },
      },
      "subscriberId"
    );
    ```
  </Tab>

  <Tab title="Python">
    ```python theme={null}
    import os
    import novu_py
    from novu_py import Novu

    with Novu(secret_key=os.getenv("NOVU_SECRET_KEY", "")) as novu:
        novu.subscribers.credentials.update(
            subscriber_id="subscriberId",
            update_subscriber_channel_request_dto={
                "provider_id": novu_py.ChatOrPushProviderEnum.PUSHPAD,
                "credentials": {"deviceTokens": ["token1", "token2", "token3"]},
                "integration_identifier": "pushpad-MnGLxp8uy",
            },
        )
    ```
  </Tab>

  <Tab title="Go">
    ```go theme={null}
    import (
        "context"
        "os"

        novugo "github.com/novuhq/novu-go"
        "github.com/novuhq/novu-go/models/components"
    )

    s := novugo.New(novugo.WithSecurity(os.Getenv("NOVU_SECRET_KEY")))

    res, err := s.Subscribers.Credentials.Update(context.Background(), "subscriberId", components.UpdateSubscriberChannelRequestDto{
        ProviderID: components.ChatOrPushProviderEnumPushPad,
        IntegrationIdentifier: novugo.String("pushpad-MnGLxp8uy"),
        Credentials: components.ChannelCredentials{
            DeviceTokens: []string{"token1", "token2", "token3"},
        },
    }, nil)
    ```
  </Tab>

  <Tab title="PHP">
    ```php theme={null}
    use novu;
    use novu\Models\Components;

    $sdk = novu\Novu::builder()->setSecurity('<NOVU_SECRET_KEY>')->build();

    $sdk->subscribersCredentials->update(
        subscriberId: 'subscriberId',
        updateSubscriberChannelRequestDto: new Components\UpdateSubscriberChannelRequestDto(
            providerId: Components\ChatOrPushProviderEnum::PushPad,
            integrationIdentifier: 'pushpad-MnGLxp8uy',
            credentials: new Components\ChannelCredentials(
                deviceTokens: ['token1', 'token2', 'token3'],
            ),
        ),
    );
    ```
  </Tab>

  <Tab title=".NET">
    ```csharp theme={null}
    using Novu;
    using Novu.Models.Components;
    using System.Collections.Generic;

    var sdk = new NovuSDK(secretKey: "<NOVU_SECRET_KEY>");

    await sdk.Subscribers.Credentials.UpdateAsync(
        subscriberId: "subscriberId",
        updateSubscriberChannelRequestDto: new UpdateSubscriberChannelRequestDto() {
            ProviderId = ChatOrPushProviderEnum.PushPad,
            IntegrationIdentifier = "pushpad-MnGLxp8uy",
            Credentials = new ChannelCredentials() {
                DeviceTokens = new List<string> { "token1", "token2", "token3" },
            },
        });
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    import co.novu.Novu;
    import co.novu.models.components.*;
    import java.util.List;

    Novu novu = Novu.builder().secretKey("<NOVU_SECRET_KEY>").build();

    novu.subscribers().credentials().update()
        .subscriberId("subscriberId")
        .body(UpdateSubscriberChannelRequestDto.builder()
            .providerId(ChatOrPushProviderEnum.PUSHPAD)
            .integrationIdentifier("pushpad-MnGLxp8uy")
            .credentials(ChannelCredentials.builder()
                .deviceTokens(List.of("token1", "token2", "token3"))
                .build())
            .build())
        .call();
    ```
  </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",
      "credentials": {
        "deviceTokens": [
          "token1",
          "token2",
          "token3"
        ]
      },
      "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.

<Tabs>
  <Tab title="Node.js">
    ```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: {},
    });
    ```
  </Tab>

  <Tab title="Python">
    ```python theme={null}
    import os
    import novu_py
    from novu_py import Novu

    with Novu(secret_key=os.getenv("NOVU_SECRET_KEY", "")) as novu:
        novu.trigger(trigger_event_request_dto=novu_py.TriggerEventRequestDto(
            workflow_id="workflowId",
            to={"subscriber_id": "subscriberId"},
            payload={},
        ))
    ```
  </Tab>

  <Tab title="Go">
    ```go theme={null}
    import (
        "context"
        "os"

        novugo "github.com/novuhq/novu-go"
        "github.com/novuhq/novu-go/models/components"
    )

    s := novugo.New(novugo.WithSecurity(os.Getenv("NOVU_SECRET_KEY")))

    res, err := s.Trigger(context.Background(), components.TriggerEventRequestDto{
        WorkflowID: "workflowId",
        To: components.CreateToSubscriberPayloadDto(components.SubscriberPayloadDto{
            SubscriberID: "subscriberId",
        }),
        Payload: map[string]any{},
    }, nil)
    ```
  </Tab>

  <Tab title="PHP">
    ```php theme={null}
    use novu;
    use novu\Models\Components;

    $sdk = novu\Novu::builder()->setSecurity('<NOVU_SECRET_KEY>')->build();

    $sdk->trigger(
        triggerEventRequestDto: new Components\TriggerEventRequestDto(
            workflowId: 'workflowId',
            to: new Components\SubscriberPayloadDto(subscriberId: 'subscriberId'),
            payload: [],
        ),
    );
    ```
  </Tab>

  <Tab title=".NET">
    ```csharp theme={null}
    using Novu;
    using Novu.Models.Components;

    var sdk = new NovuSDK(secretKey: "<NOVU_SECRET_KEY>");

    await sdk.TriggerAsync(triggerEventRequestDto: new TriggerEventRequestDto() {
        WorkflowId = "workflowId",
        To = To.CreateSubscriberPayloadDto(new SubscriberPayloadDto() { SubscriberId = "subscriberId" }),
    });
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    import co.novu.Novu;
    import co.novu.models.components.*;

    Novu novu = Novu.builder().secretKey("<NOVU_SECRET_KEY>").build();

    novu.trigger()
        .body(TriggerEventRequestDto.builder()
            .workflowId("workflowId")
            .to(To2.of(SubscriberPayloadDto.builder().subscriberId("subscriberId").build()))
            .build())
        .call();
    ```
  </Tab>

  <Tab title="cURL">
    ```bash theme={null}
    curl --location 'https://api.novu.co/v1/events/trigger' \
    --header 'Content-Type: application/json' \
    --header 'Authorization: ApiKey <NOVU_SECRET_KEY>' \
    -d '{
        "name": "workflowId",
        "to": [
            "subscriberId"
        ],
        "payload": {}
    }'
    ```
  </Tab>
</Tabs>
