Introduction

Initialize the SDK

Create a PrldSessionClient instance with your custom domain:

import { PrldSessionClient } from "@prelude.so/js-sdk";

const client = new PrldSessionClient({
  domain: "{app_id}.session.prelude.dev",
});

Try it

Scaffold a React project you will use for all the steps below:

npm create vite@latest session-test -- --template react
cd session-test
npm install @prelude.so/js-sdk @picocss/pico

Create a .env file at the root of the project with your Application ID:

.env

VITE_APP_ID=your_app_id

Replace src/App.jsx with:

src/App.jsx

import "@picocss/pico";
import { PrldSessionClient } from "@prelude.so/js-sdk";

const client = new PrldSessionClient({
  domain: `${import.meta.env.VITE_APP_ID}.session.prelude.dev`,
});

export default function App() {
  return (
    <>
      <style>{`body, #root { display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; padding: 0; }`}</style>
      <main style={{ textAlign: "center", maxWidth: "600px", width: "100%" }}>
        <h1>Session Test</h1>
        <p>SDK initialized.</p>
      </main>
    </>
  );
}

Add optimizeDeps on vite configuration:

vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
optimizeDeps: {
  exclude: ["@prelude.so/js-sdk"],
  include: ["@prelude.so/js-sdk > browser-tabs-lock"],
  },
})

npm run dev

Documentation

API Reference

Prerequisites

Install the SDK

Initialize the SDK

​Prerequisites

​Install the SDK

​Initialize the SDK

Prerequisites

Install the SDK

Initialize the SDK