Presentamos el repositorio de ejemplos de Katla
Seis proyectos de ejemplo listos para ejecutar que muestran cómo integrar el consentimiento de cookies de Katla con Next.js, Vite y HTML sin framework.
Acabamos de publicar katla-app/examples, una colección de seis proyectos de partida que muestran cómo integrar el consentimiento de cookies de Katla en aplicaciones reales. Cada ejemplo es autónomo, se ejecuta en local y cubre un patrón de integración distinto.
Por qué ejemplos
La documentación explica la API. Los ejemplos muestran cómo encajan las piezas. Tanto si vas a añadir un widget de consentimiento a una web de marketing como si estás construyendo una interfaz de consentimiento propia en una app de React, estos proyectos te dan un punto de partida que funciona y que puedes adaptar.
Qué incluye
Widget
Un sitio multipágina con Vite que carga el widget alojado de Katla mediante una etiqueta script e incrusta la página de la política de cookies en un iframe. Sin SDK, sin framework: solo HTML y la CDN.
Ideal para: sitios estáticos, páginas generadas por un CMS o cualquier sitio en el que quieras consentimiento sin paso de build.
Ver ejemplo · Documentación del widget
Next.js: SSR dinámico
Un proyecto de Next.js 16 con App Router que usa getCachedCookies de @katla.app/sdk/next/server para obtener las cookies en el servidor. El cliente recibe los datos ya cargados, sin ninguna petición de red adicional.
Ideal para: apps de Next.js renderizadas en el servidor que quieren datos de cookies actualizados en cada petición.
Ver ejemplo · Documentación de Next.js
Next.js: estático en tiempo de build
Un proyecto de Next.js 16 con App Router que ejecuta katla pull durante el build. Los datos de cookies y el script del bloqueador se empaquetan como archivos estáticos: cero peticiones en tiempo de ejecución.
Ideal para: sitios de Next.js exportados de forma estática, o cuando quieres la carga más rápida posible.
Ver ejemplo · Documentación de cookies estáticas
Vite + React: carga dinámica
Una app de Vite 7 + React 19 que obtiene las cookies y los datos de la política en tiempo de ejecución con los hooks del SDK. Incluye los componentes CookieBanner y CookieCatalog.
Ideal para: SPA que siempre quieren los datos de cookies más recientes de la CDN.
Ver ejemplo · Documentación de React
Vite + React: estático en tiempo de build
Una app de Vite 7 + React 19 que usa katla pull para obtener los datos de cookies durante el build. El JSON se importa directamente: no hace falta ninguna petición en tiempo de ejecución.
Ideal para: SPA con un pipeline de build que quieren eliminar las peticiones desde el cliente.
Ver ejemplo · Documentación de cookies estáticas
Vite + React: interfaz de consentimiento propia
Una app de Vite 7 + React 19 que usa el hook useConsentManager para construir una interfaz de consentimiento totalmente personalizada. Ningún componente de banner prefabricado: solo tu propio marcado y tu propia lógica.
Ideal para: equipos que necesitan el control total de la experiencia de consentimiento y quieren que encaje con su sistema de diseño.
Ver ejemplo · Documentación de useConsentManager
Primeros pasos
Todos los ejemplos se configuran igual:
git clone https://github.com/katla-app/examples.git
cd examples/<project>
npm installSustituye el ID del sitio de ejemplo por el tuyo (lo tienes en katla.app) y arranca el servidor de desarrollo. El README de cada proyecto tiene los detalles concretos.
Explora el repositorio
Consulta los seis ejemplos en GitHub: katla-app/examples