Getting started with the Javascript SDK

Get started with our Javascript SDK to build notification feed, toasts, and inbox experiences.

The @knocklabs/client library is a low-level JavaScript SDK for interacting with Knock from the client side of your JS application. In this guide we'll show some of the main ways you can interact with the SDK:

Quick links

Getting started

To use this example, you'll need an account on Knock, as well as an in-app feed channel, with a workflow that produces in-app feed messages. You'll also need:

  • A public API key for the Knock environment (set as KNOCK_PUBLIC_API_KEY)
  • The channel ID for the in-app feed (set as KNOCK_FEED_CHANNEL_ID)

Installing dependencies

Authenticating the current user

Initialize a feed connection for the user

The Knock class exposes a Feed via the initialize method that can be used to connect the authenticated user to a Knock Feed Channel. Additionally, the Feed exposes a stateful store to build client-side feeds and other notification experiences.

Marking feed item statuses

A feed instance supports marking items as seen, unseen, read, unread, archived, and unarchived:

Retrieving preferences for the user

You can use the JS SDK to retrieve the preferences for the authenticated user, which is useful to build in-app preference UIs.

Setting preferences for the user

Similar to retrieving preferences, the Knock class also allows you to set preferences directly in the client for the authenticated user.

Automatically disconnecting sockets from inactive tabs

Optionally, you can configure the client to disconnect socket connections with inactive tabs after a brief delay. If the tab becomes active again, the socket will reconnect to continue receiving real-time updates.