In-App UI
JavaScript
SDK
Quick start

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. This documentation shows some of the 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.