Skip to content

Framework Compatibility

The Innovede SDK abstracts platform functionality through native Web APIs and is compiled into portable, dependency-free JavaScript. Its framework-independent design eliminates coupling to any UI library or rendering engine, allowing integration with any frontend architecture, build pipeline, or JavaScript runtime that supports standard Web APIs.

React / Next.js

Initialize the SDK outside the component tree to keep a single instance, then pass it via Context.

javascript
// lib/sdk.js
import { PlatformSDK } from '@innovassion/innovede-sdk';
export const sdk = new PlatformSDK({ apiKey: 'xxx', environment: 'production' });

// app/layout.js (Next.js App Router)
'use client';
import { createContext, useContext } from 'react';

const SdkContext = createContext(sdk);

export function useSdk() {
  return useContext(SdkContext);
}

export default function RootLayout({ children }) {
  return <SdkContext.Provider value={sdk}>{children}</SdkContext.Provider>;
}

Session restore is asynchronous: a returning user's session is silently restored on startup. Await the readiness signal before rendering protected routes:

javascript
const authenticated = await sdk.auth.sessionReady;

The SDK is SSR-safe: storage access is guarded, so initializing it during server rendering does not crash (keep 'use client' for anything touching auth state).

Vue 3 / Nuxt 3

Use Nuxt's plugin system to provide the SDK globally. Name the file sdk.client.ts so it only runs in the browser (recommended for sandbox mode).

typescript
// plugins/sdk.client.ts
import { PlatformSDK } from '@innovassion/innovede-sdk';

export default defineNuxtPlugin((nuxtApp) => {
  const sdk = new PlatformSDK({ apiKey: 'xxx', environment: 'production' });
  nuxtApp.provide('sdk', sdk);
  // Silent session restore; await before rendering protected routes
  nuxtApp.provide('sdkSessionReady', sdk.auth.sessionReady);
});