Connecting your app

Every app connects with the same three values: the API address https://api.vaif.studio, your project ID, and an API key. Both the project ID and the keys are on Security > Credentials in the console.

Web, Node.js and edge runtimes

Install @vaifstudio/client:

npm install @vaifstudio/client

Then create one client:

import { createVaifClient } from "@vaifstudio/client";

const vaif = createVaifClient({
  baseUrl: "https://api.vaif.studio",
  projectId: process.env.VAIF_PROJECT_ID,
  apiKey: process.env.VAIF_PUBLISHABLE_KEY,
});

The same package works in browsers, Node.js 22 and later, Bun, Deno and edge runtimes.

React

@vaifstudio/react adds a provider and hooks such as useQuery, useAuth and useRealtime on top of the client. See the React SDK.

npm install @vaifstudio/react @vaifstudio/client

import type { ReactNode } from "react";
import { createVaifClient } from "@vaifstudio/client";
import { VaifProvider } from "@vaifstudio/react";

const vaif = createVaifClient({
  baseUrl: "https://api.vaif.studio",
  projectId: import.meta.env.VITE_VAIF_PROJECT_ID,
  apiKey: import.meta.env.VITE_VAIF_PUBLISHABLE_KEY,
});

export function Providers({ children }: { children: ReactNode }) {
  return <VaifProvider client={vaif}>{children}</VaifProvider>;
}

Create the client once, outside your components, so every component shares one realtime connection.

React Native and Expo

@vaifstudio/expo adds hooks and keeps the user’s session on the device. See the Expo SDK.

npx expo install @vaifstudio/expo @vaifstudio/client

The client itself is created the same way as on the web:

import { createVaifClient } from "@vaifstudio/client";

const vaif = createVaifClient({
  baseUrl: "https://api.vaif.studio",
  projectId: process.env.EXPO_PUBLIC_VAIF_PROJECT_ID,
  apiKey: process.env.EXPO_PUBLIC_VAIF_PUBLISHABLE_KEY,
});

Python, Go, Swift and Dart

Each of these has its own page with its status and install instructions: Python, Go, Swift and Dart and Flutter. Any language can also call the REST API directly, as below.

REST API (any language)

curl "https://api.vaif.studio/v1/data/$VAIF_PROJECT_ID/posts?limit=10" \
  -H "x-vaif-key: $VAIF_PUBLISHABLE_KEY"

With no user token, this is denied unless posts has a public rule. Add Authorization: Bearer <access token> to act as a signed-in user, so row rules know who is asking. The REST API page lists every route and header.

Choosing an API key

Key	Prefix	Row rules	Use for
Publishable	`vk_pub_`	Apply	Browser and mobile apps
Secret	`vk_srv_`	Bypassed	Server-side code only

Never ship a vk_srv_ key in a client bundle. See Key types.