Segmentify CDP

Embed the Segmentify Customer Data Platform in your app — via iframe or Module Federation.

What is the CDP micro frontend?

The Customer Data Platform (CDP) is a React micro frontend that renders customer list, customer detail, and customer-list-management screens. It is designed to be embedded inside a host application — the Segmentify dashboard, or a third-party host such as an Angular application.

You do not re-implement CDP in your framework. Your host loads the pre-built remote (via iframe or Module Federation), supplies host context through the @segmentify/common host bridge, and CDP handles the rest.

Feature set

Customer list, customer detail (overview, profile attributes, subscriptions, activity timeline), and customer list management.

Two integration modes

iframe + postMessage for any host stack, or Module Federation mount for React-capable hosts that want deeper UI integration.

Host bridge

Host context (API key, datacenter, auth token, navigation) flows through @segmentify/common v0.0.15 — no direct window coupling.

CDP API

Customer data is served from the Segmentify CDP API (cdpBaseUrl), separate from the Sauron host API.

Architecture at a glance

flowchart TD
  subgraph hosts [Host applications]
    Dashboard[Segmentify dashboard]
    AngularIframe[Angular partner iframe]
    AngularFed[Angular Module Federation host]
  end

  subgraph bridge [HostBridgeV1 via @segmentify/common]
    Store[hostBridgeStore]
    Direct[createDirectConfigBridge]
    PostMsg[createPostMessageBridge]
    DashboardReg[registerSegmentifyHostApi]
  end

  subgraph cdp [cdp-fr remote]
    App[cdpApp/App]
    Mount[cdpApp/mount]
    Embed[embed.html + cdpApp/embed]
    CdpApi[cdpApi createMfeApi]
  end

  Dashboard --> DashboardReg --> Store
  AngularIframe --> PostMsg --> Store
  AngularFed --> Direct --> Store
  Store --> CdpApi
  App --> CdpApi
  Mount --> CdpApi
  Embed --> CdpApi

API hosting

CDP customer data is served from the Segmentify CDP API, resolved through the host bridge (bridge.resolveApiBaseUrl('cdp', { datacenter })). The cdpApi client adds X-Api-Version: 1.0 automatically. Production requests are routed by datacenter:

Environment	Base URL
Development	`https://api-dev.segmentify.com`
QA	`https://api-qa.segmentify.com`
Production (default)	`https://api.segmentify.com`
Production (`eq`)	`https://api-eq.segmentify.com`
Production (`gc`)	`https://api-gcp.segmentify.com`

Where to start

PrerequisitesAPI key, auth token, CORS, and the @segmentify/common package.

QuickstartEmbed CDP in about 10 minutes.

Angular integrationiframe (recommended) and Module Federation paths for Angular hosts.

Canonical platform docs: @segmentify/common v0.0.15.