Skip to main content
Replyke’s SDK is distributed through the @replyke family of packages. The React web package (@replyke/react-js) is the starting point for most projects.

Installation

npm install @replyke/react-js@beta
For React Native or Expo projects, install the platform-specific package instead:
npm install @replyke/react-native@beta

Wrap Your App with ReplykeProvider

ReplykeProvider is the root provider that must wrap your entire application (or the portion of it that uses Replyke features). It initializes the Redux store, bootstraps auth state, and makes the projectId available to all child hooks and components.
import { ReplykeProvider } from "@replyke/react-js";

function App() {
  return (
    <ReplykeProvider projectId="your-project-id">
      {/* your app */}
    </ReplykeProvider>
  );
}

Props

projectId
string
required
Your Replyke project ID. Found in the Replyke dashboard under project settings.
signedToken
string | null
A signed JWT from your own auth system, used for external authentication mode. Pass null or omit when not using external auth. See External Auth.

Choosing an Authentication Mode

After wrapping with ReplykeProvider, users are unauthenticated by default. You can authenticate them using any combination of:

Built-in Auth

Sign up and sign in with email and password. Replyke manages credentials and sessions.

External Auth

Pass a signed JWT from your own auth system via the signedToken prop.

OAuth

Let users sign in with Google, GitHub, Apple, or Facebook.

Multi-Account

Support multiple simultaneous signed-in accounts with account switching.

Checking Auth State

Use the useAuth hook for auth actions and useUser to access the current user anywhere inside ReplykeProvider:
import { useAuth, useUser } from "@replyke/react-js";

function Header() {
  const { initialized, signOut } = useAuth();
  const { user } = useUser();

  if (!initialized) return <p>Loading...</p>;
  if (!user) return <p>Not signed in.</p>;

  return (
    <div>
      <p>Signed in as {user.username}</p>
      <button onClick={() => signOut()}>Sign out</button>
    </div>
  );
}
initialized is false until the SDK has attempted to restore a session from storage. Always check initialized before rendering auth-dependent UI to avoid flash-of-unauthenticated-content.

Redux Store

ReplykeProvider automatically creates and manages an isolated Redux store. You do not need to configure Redux to use Replyke. If your application already has its own Redux store, we strongly recommend using ReplykeIntegrationProvider instead — running two separate Redux stores in the same app is a common source of subtle bugs. See Redux Integration for setup details.

What’s Next

Authentication

Configure how users sign in to your application

Entities

Attach social features to your app’s content

Spaces

Build community spaces with membership and moderation

Chat

Add real-time 1:1 and group conversations