# SvelteKit

> +page.server.ts loaders for index and detail.

> **The fast path:** open the [Connect wizard](/docs/connect-wizard). Pick **Dynamic site (SSR / on-request rendering)** if your SvelteKit app uses the Node adapter (server-rendered on each request), or **Static site (Vercel / Netlify / Cloudflare Pages)** if you use `@sveltejs/adapter-static`. The wizard tailors the env vars and receiver code accordingly.


## Index loader

```ts
// src/routes/blog/+page.server.ts
import { MENTIONWELL_API_URL, MENTIONWELL_SITE_SLUG, MENTIONWELL_API_KEY } from "$env/static/private";

export const load = async () => {
  const res = await fetch(`${MENTIONWELL_API_URL}/api/public/${MENTIONWELL_SITE_SLUG}/posts?limit=24`, {
    headers: { Authorization: `Bearer ${MENTIONWELL_API_KEY}` }
  });
  const { posts } = await res.json();
  return { posts };
};
```

## Detail loader

```ts
// src/routes/blog/[slug]/+page.server.ts
import { error } from "@sveltejs/kit";
import { MENTIONWELL_API_URL, MENTIONWELL_SITE_SLUG, MENTIONWELL_API_KEY } from "$env/static/private";

export const load = async ({ params }) => {
  const res = await fetch(`${MENTIONWELL_API_URL}/api/public/${MENTIONWELL_SITE_SLUG}/posts/${params.slug}`, {
    headers: { Authorization: `Bearer ${MENTIONWELL_API_KEY}` }
  });
  if (res.status === 404) throw error(404);
  const { post } = await res.json();
  return { post };
};
```

## Detail markup

```svelte
<!-- src/routes/blog/[slug]/+page.svelte -->
<script lang="ts">
  export let data;
</script>

<article>
  <h1>{data.post.title}</h1>
  {@html data.post.html}
</article>
```

## Webhook receiver

```ts
// src/routes/api/mentionwell/+server.ts
import { Buffer } from "node:buffer";
import { createHmac, timingSafeEqual } from "node:crypto";
import { json, type RequestHandler } from "@sveltejs/kit";
import { MENTIONWELL_WEBHOOK_SECRET } from "$env/static/private";

export const POST: RequestHandler = async ({ request }) => {
  const raw = await request.text();
  const signature = request.headers.get("x-mentionwell-signature") ?? "";
  const expected = createHmac("sha256", MENTIONWELL_WEBHOOK_SECRET).update(raw).digest("hex");
  const verified =
    signature.length === expected.length &&
    timingSafeEqual(Buffer.from(signature, "utf8"), Buffer.from(expected, "utf8"));
  if (!verified) return json({ ok: false }, { status: 401 });

  const { post } = JSON.parse(raw) as { post?: { slug?: string } };
  // Invalidate your CDN/cache for /blog and post?.slug here.
  return json({ ok: true, slug: post?.slug ?? null });
};
```


---

Canonical URL: https://mentionwell.com/docs/frameworks/sveltekit
Live HTML version: https://mentionwell.com/docs/frameworks/sveltekit
Section: Quickstarts by stack
Site index for AI ingestion: https://mentionwell.com/llms.txt
Full reference: https://mentionwell.com/llms-full.txt