← Alle innlegg
eksempler10. mars 20262 min lesetid

Vi presenterer Katlas eksempelrepo

Seks eksempelprosjekter som er klare til å kjøre, og som viser hvordan du integrerer cookiesamtykke fra Katla med Next.js, Vite og ren HTML.

Katla-teamet

Vi har nettopp publisert katla-app/examples, en samling med seks startprosjekter som viser hvordan du integrerer cookiesamtykke fra Katla i ekte apper. Hvert eksempel er selvstendig, kjører lokalt og dekker et eget integrasjonsmønster.

Hvorfor eksempler

Dokumentasjonen forklarer API-et. Eksemplene viser hvordan bitene passer sammen. Enten du legger en samtykkewidget på et markedsføringsnettsted eller bygger et eget samtykkegrensesnitt i en React-app, gir disse prosjektene deg et fungerende utgangspunkt du kan tilpasse.

Dette er med

Widget

Et Vite-nettsted med flere sider som laster Katlas hostede widget via en skripttagg og bygger inn siden med cookie-erklæringen i en iframe. Ingen SDK, ikke noe rammeverk: bare HTML og CDN-et.

Passer best for: Statiske nettsteder, sider rendret av et CMS, eller hvor som helst du vil ha samtykke uten et byggesteg.

Se eksempelet · Dokumentasjon for widgeten

Next.js: dynamisk SSR

Et Next.js 16-prosjekt med App Router som bruker getCachedCookies fra @katla.app/sdk/next/server til å hente cookies på serveren. Klienten får ferdig lastede data uten ekstra nettverksforespørsler.

Passer best for: Server-rendrede Next.js-apper som vil ha ferske cookie-data ved hver forespørsel.

Se eksempelet · Dokumentasjon for Next.js

Next.js: statisk ved byggetid

Et Next.js 16-prosjekt med App Router som kjører katla pull ved byggetid. Cookie-dataene og vaktskriptet pakkes som statiske filer: null henting under kjøring.

Passer best for: Statisk eksporterte Next.js-nettsteder, eller når du vil ha raskest mulig lasting.

Se eksempelet · Dokumentasjon for statiske cookies

Vite + React: dynamisk henting

En Vite 7 + React 19-app som henter cookies og erklæringsdata under kjøring med SDK-ets hooks. Inkluderer komponentene CookieBanner og CookieCatalog.

Passer best for: SPA-er som alltid vil ha de nyeste cookie-dataene fra CDN-et.

Se eksempelet · Dokumentasjon for React

Vite + React: statisk ved byggetid

En Vite 7 + React 19-app som bruker katla pull til å hente cookie-data ved byggetid. JSON-filen importeres direkte, og ingen henting under kjøring er nødvendig.

Passer best for: SPA-er med en byggeprosess som vil kvitte seg med forespørsler fra klienten.

Se eksempelet · Dokumentasjon for statiske cookies

Vite + React: eget samtykkegrensesnitt

En Vite 7 + React 19-app som bruker hooken useConsentManager til å bygge et helt eget samtykkegrensesnitt. Ingen ferdig bannerkomponent: bare din egen markup og logikk.

Passer best for: Team som trenger full kontroll over samtykkeopplevelsen og vil at den skal passe til designsystemet deres.

Se eksempelet · Dokumentasjon for useConsentManager

Kom i gang

Alle eksemplene settes opp på samme måte:

git clone https://github.com/katla-app/examples.git
cd examples/<project>
npm install

Bytt ut plassholderen for Site ID med din egen (fra katla.app), og start utviklingsserveren. README-filen i hvert prosjekt har detaljene.

Utforsk repoet

Se alle de seks eksemplene på GitHub: katla-app/examples