akkila.dev
← cd ../#projects

CookieSwitch - GDPR Consent Platform

GDPR/cookie compliance SaaS — embeddable consent banner with real-time preview, scanner, and UMD SDK

Senior frontend engineer·Jan 2022 – Dec 2022

Overview

CookieSwitch is a GDPR/cookie compliance SaaS platform that lets website owners scan their site for cookies, build a customizable consent banner, then drop a single <script> tag into their HTML. The embeddable SDK handles consent enforcement automatically from there.

The Problem

Cookie consent is legally required under GDPR but painful to implement correctly. Most solutions are either developer heavy integrations or generic banners with no customization. Website owners needed a no code way to discover what cookies their site sets, configure a branded banner, and enforce consent without touching their codebase.

What I Built

The frontend application covers three areas: an onboarding wizard where users connect their site and scan for cookies; a banner builder with a live preview that runs the actual SDK locally (no API round-trip); and an analytics dashboard showing consent rates and visitor trends. The embeddable SDK is a self contained UMD bundle that loads a React tree into the host page, fetches the banner config from the API, and stores consent choices in localStorage.

Tech Stack

  • Frontend: React 17, TypeScript, Redux + redux-thunk, Material UI v5, Emotion, SCSS modules
  • Forms: Formik for all multi-step wizards and banner config forms
  • Data viz: Chart.js + react-chartjs-2 for consent analytics
  • Routing: React Router v6
  • HTTP: Axios with custom interceptors for JWT token refresh
  • SDK: Webpack UMD bundle (works without React or any bundler on the host site)

Key Features

  • Cookie scanner - crawls the connected site and categorises discovered cookies by type (necessary, analytics, marketing)
  • Live banner preview - banner builder runs the actual SDK in-browser; changes reflect instantly without debouncing API calls
  • Embeddable UMD SDK - a single <script> tag loads the consent banner on any site, framework-agnostic, exposing a clean imperative API (CookieSwitch.start(), CookieSwitch.stop())
  • Consent analytics - dashboard with charts showing opt-in/opt-out rates over time per cookie category
  • Wizard layout pattern - wizardMode is passed as router state to switch layout/navbar without duplicating page components

Results & Impact

Delivered a full featured GDPR compliance tool that removes the technical barrier for non developer website owners. The SDK's UMD format means zero dependency conflicts on any host site, and the local preview architecture keeps the banner builder responsive even on slow connections.

share: