c15t
/
C15T Logo
Select a framework
Frameworks
Welcome to c15t Docs
Introduction to Consent Management (c15t)
AI Tools Integrations
OSS
Contributing to c15t.com
License
Building Privacy Tools in the Open
Legal
Cookie Policy
Privacy Policy
C15T Logo
HomeFrontendIntegrationsSelf HostChangelog
xbskydiscordgithub1.4k
c15t
/
C15T Logo
Select a framework
Frameworks
Welcome to c15t Docs
Introduction to Consent Management (c15t)
AI Tools Integrations
OSS
Contributing to c15t.com
License
Building Privacy Tools in the Open
Legal
Cookie Policy
Privacy Policy
home-2Docs
chevron-rightFrameworks
chevron-rightJavascript
chevron-rightQuickstart

JavaScript Quickstart

Learn how to integrate c15t into your Javacript application with this step-by-step guide. We'll cover installation, configuration, and basic usage.

CLI Setup (Recommended)

Generate Schema + Code

npx @c15t/cli generate

Run Database Migrations (Optional)

Info

This is only required if you are self-hosting c15t.

npx @c15t/cli migrate

Manual Setup

Install c15t Package

npm install c15t

Add to Your JavaScript Application

import { configureConsentManager, createConsentManagerStore } from 'c15t';

export const consentManager = configureConsentManager({ mode: "c15t", backendURL: "https://your-instance.c15t.dev" });
export const store = createConsentManagerStore(consentManager, {
  initialGdprTypes: ["necessary", "marketing"], // Optional: Specify which consent categories to show in the banner.
  ignoreGeoLocation: true // Useful for development to always view the banner.
});

The consent manager is now ready to use. For example:

store.getState().setConsent('marketing', true); // set consent to marketing
store.getState().showPopup; // should show popup?

Info

You can create an instance at consent.io (recommended) or use c15t offline by setting mode: 'offline'.

Hosting Options

Creating a consent.io Instance (Recommended)

Info

Using consent.io is the recommended method as it is the easiest way to get started and requires little maintenance.

consent.io provides a fully managed consent management service. This is the recommended method as it is the easiest way to get started and requires little maintenance.

Sign up for a consent.io account.

After signing up, create a new instance, located in the top-right corner.

Info

When creating an instance it is important to list all the trusted origins for your application such as "localhost", your production domain, etc.

After the instance is created, you will be given a backendURL, which you can add to your ConsentManagerOptions.

A backend URL might look like this: https://<my-instance>.c15t.dev/.

Alternative Storage Options

Info

For more advanced setup options, choose the approach that best suits your requirements.

For more advanced setup options, please refer to:

  • Overview - Compare different approaches to storing consent decisions in your application
  • Hosted c15t - Complete guide to using consent.io
  • Offline Mode - Complete guide to using c15t without a backend
  • Custom Client - Advanced implementation with custom handlers for full control

Decision Guide

Info

Use this flowchart to determine which c15t configuration is best for your needs.

Available in other SDKs

reactReactnextNext.js
C15T Logo
Leverage native React components for seamless integration and high performance in a robust Consent Management solution that empowers your development team while prioritizing privacy and compliance.
Product
  • Documentation
  • Components
Company
  • GitHub
  • Contact
Legal
  • Privacy Policy
  • Cookie Policy
c15t