AINative SDK Quick Start

1. Get an API Key (30 seconds)

# Auto-creates a project + API key, configures your IDE's MCP server
npx zerodb init

This outputs:

API Key: ak_...
Project ID: proj_...
MCP config written to .claude/mcp.json (or cursor/mcp.json)

Or create manually at https://app.ainative.studio → Settings → API Keys.

2. Choose Your SDK

3. React

npm install @ainative/react-sdk

import { AINativeProvider, useChat } from '@ainative/react-sdk';

function App() {
  return (
    \x3CAINativeProvider config={{ apiKey: 'ak_your_key' }}>
      \x3CChat />
    \x3C/AINativeProvider>
  );
}

function Chat() {
  const { messages, sendMessage, isLoading } = useChat({
    model: 'claude-3-5-sonnet-20241022',
  });

  return (
    \x3Cdiv>
      {messages.map((m, i) => \x3Cdiv key={i}>{m.role}: {m.content}\x3C/div>)}
      \x3Cbutton onClick={() => sendMessage([...messages, { role: 'user', content: 'Hello' }])}
              disabled={isLoading}>
        Send
      \x3C/button>
    \x3C/div>
  );
}

4. Next.js

npm install @ainative/next-sdk

// app/api/chat/route.ts
import { createServerClient } from '@ainative/next-sdk/server';

export async function POST(request: Request) {
  const { messages } = await request.json();
  const client = createServerClient({ apiKey: process.env.AINATIVE_API_KEY! });

  const result = await client.chat.completions.create({
    model: 'claude-3-5-sonnet-20241022',
    messages,
    stream: true,
  });

  return new Response(result.body, {
    headers: { 'Content-Type': 'text/event-stream' },
  });
}

5. Svelte

npm install @ainative/svelte-sdk

\x3Cscript>
  import { createChatStore, setAINativeConfig } from '@ainative/svelte-sdk';

  setAINativeConfig({ apiKey: 'ak_your_key' });
  const chat = createChatStore({ model: 'claude-3-5-sonnet-20241022' });
\x3C/script>

{#each $chat.messages as msg}
  \x3Cp>\x3Cb>{msg.role}:\x3C/b> {msg.content}\x3C/p>
{/each}
\x3Cbutton on:click={() => chat.sendMessage([...$chat.messages, { role: 'user', content: 'Hi' }])}>
  Send
\x3C/button>

6. Vue

npm install @ainative/vue-sdk

\x3Cscript setup>
import { useChat } from '@ainative/vue-sdk';
import { provideAINative } from '@ainative/vue-sdk';

provideAINative({ apiKey: 'ak_your_key' });
const { messages, sendMessage, isLoading } = useChat({ model: 'claude-3-5-sonnet-20241022' });
\x3C/script>

\x3Ctemplate>
  \x3Cdiv v-for="(msg, i) in messages" :key="i">{{ msg.role }}: {{ msg.content }}\x3C/div>
  \x3Cbutton @click="sendMessage([...messages, { role: 'user', content: 'Hi' }])" :disabled="isLoading">
    Send
  \x3C/button>
\x3C/template>

7. Environment Variables

# .env
AINATIVE_API_KEY=ak_your_key
NEXT_PUBLIC_AINATIVE_API_KEY=ak_your_key  # Next.js client-side

References

• packages/sdks/react/ — React SDK source
• packages/sdks/nextjs/ — Next.js SDK source
• packages/sdks/svelte/ — Svelte SDK source
• packages/sdks/vue/ — Vue SDK source
• packages/zerodb-cli/ — zerodb init source