> ## Documentation Index
> Fetch the complete documentation index at: https://docs.raykoi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Meta-Frameworks

> Nuxt, SvelteKit, Remix, Astro — placement and hydration notes.

Same `useRaykoiForm` adapters as [React](/integrations/react), [Vue](/integrations/vue), and [Svelte](/integrations/svelte) — these are placement/hydration notes for the framework wrapping them, not new SDK code.

<Info>
  Using Next.js? It has its own dedicated page — see [Next.js](/integrations/nextjs).
</Info>

## Nuxt (Vue)

`useRaykoiForm` fires a live metadata fetch (CAPTCHA config) the moment it's created — during SSR that request runs on the server too, on every render. Defer it to the client:

```vue theme={null}
<ClientOnly>
  <MyForm />
</ClientOnly>
```

Or call `useRaykoiForm` inside `onMounted()` instead of at the top of `<script setup>`.

## SvelteKit

Same reasoning as Nuxt — guard the call:

```javascript theme={null}
import { browser } from '$app/environment';

if (browser) {
  // call useRaykoiForm here
}
```

Or call `useRaykoiForm` inside `onMount` so it only runs client-side.

## Remix (React)

`useRaykoiForm` already only does real work (the DOM/fetch parts) once mounted client-side, matching Remix's own render-on-server-then-hydrate model — no extra wrapping needed beyond normal Remix component usage.

## Astro

Astro components ship zero JS by default. Wrap your React/Vue/Svelte form component in an island with a client directive:

```astro theme={null}
<MyForm client:load />
```

(or `client:visible` for lazy hydration) — without one, the form never hydrates and Submit does nothing.
