Composable & Embeddable AI - Make Your Analytics Smarter Anywhere

In modern day and age, it is only natural that you want your analytics exactly where they matter. There is nothing more annoying than having to always alt-tab between different applications when making decisions. This is why we have our entire Analytics stack composable and embeddable so it can follow you throughout your entire decision-making process.

In this article, you will learn how to easily embed our GoodData AI Analytics anywhere you make decisions.

As MCP is the most prominent embedded use-case, we have a separate article for it.

Bring AI Analytics to Your Backend

When developing custom backend solutions, simplicity, speed, and flexibility are paramount. GoodData’s Python SDK and APIs allow developers to effortlessly integrate powerful analytics capabilities into backend processes. Common tasks like retrieving data with pandas or programmatically generating visualizations become straightforward and intuitive.

Here's how easily you can leverage GoodData's AI capabilities using the Python SDK:

from gooddata_sdk import GoodDataSdk

# GoodData base URL, e.g. "https://www.example.com"
host = "https://www.example.com"
token = "<your_personal_access_token>"
sdk = GoodDataSdk.create(host, token)

chat_answer = sdk.compute.ai_chat(
    workspace = "demo",
    prompt = "Create a visualization showing top 5 returned products"
)

With this simple integration, your application gains the capability to dynamically respond to user queries, generating tailored and insightful visualizations instantly.

If you're more comfortable working directly with APIs, here's how straightforward it is to accomplish the same task:

curl -H "Authorization: Bearer $GOODDATA_API_TOKEN" -s -H "Content-Type: application/vnd.gooddata.api+json" -X POST \
  -d "{
      \"question\": \"Create a visualization showing top 5 returned products\"
  }" \
$GOODDATA_ENDPOINT/api/v1/actions/workspaces/{workspaceId}/ai/chat

Refer to our comprehensive API reference and Python SDK or deeper customizations and advanced use cases.

AI Analytics on Frontend in Few Minutes

When making business decisions, you often need granular control over the information you use. Sometimes you need comprehensive dashboards embedded directly into your application. Other times, you simply require a single critical value that determines a strategic choice, like extending a contract. Occasionally, you're not exactly sure what data you need—but you have specific questions you want answered.

GoodData’s AI Analytics effortlessly handles both scenarios. It instantly converts your business questions into actionable insights directly embedded into your frontend application.

GoodData UI SDK offers an effortless and flexible solution for embedding analytics into any frontend application. This short guide will demonstrate exactly how to integrate GoodData’s AI Analytics into your frontend stack, providing real-time, interactive analytics that are always up-to-date.

Real-Life Example: Online Shop Administration

Consider a small online store that requires instant analytics to inform purchasing decisions, promotional planning, and inventory management. Instead of embedding complex dashboards—which may be overkill for quick decisions—you can leverage GoodData’s AI Analytics embedded behind a convenient chat popup. With this setup, your analytics become interactive, context-driven, and instantly accessible whenever needed.

Quick Setup Guide

Embedding AI Analytics into your frontend is remarkably straightforward. Here's how to utilize GoodData's powerful AI component in just four simple steps:

Step 1: Initialize a New UI SDK Project

Create your new UI project with this simple command:

npx @gooddata/app-toolkit@latest init

Step 2: Configure Credentials

Set your backend credentials in your project’s configuration (package.json) and .env file:

"gooddata": {
        "hostname": "https://engaging-panda.example.cloud.gooddata.com",
        "workspaceId": "demo",
        ...
    },

Step 3: Setup Your Frontend

Import essential CSS styles and components into your frontend application:

import "@gooddata/sdk-ui-gen-ai/styles/css/main.css";
import { GenAIChat } from "@gooddata/sdk-ui-gen-ai";

Configure your backend connection with this snippet:

import { IAnalyticalBackend } from "@gooddata/sdk-backend-spi";
import { withCaching, RecommendedCachingConfiguration } from "@gooddata/sdk-backend-base";
import backendFactory, { ContextDeferredAuthProvider } from "@gooddata/sdk-backend-tiger";

// Configure backend connection with deferred authentication
export const backend: IAnalyticalBackend = withCaching(
    backendFactory().withAuthentication(new ContextDeferredAuthProvider()),
    RecommendedCachingConfiguration,
);

Step 4: Embed AI Analytics Component

Add GoodData's AI analytics chat to your frontend with these lines of code:

import { GenAIChat } from "@gooddata/sdk-ui-gen-ai";
import { BackendProvider, WorkspaceProvider } from "@gooddata/sdk-ui";

function AnalyticsChat({ backend, workspaceId }) {
  return (
    <BackendProvider backend={backend}>
      <WorkspaceProvider workspace={workspaceId}>
        <GenAIChat />
      </WorkspaceProvider>
    </BackendProvider>
  );
}

With this minimal setup, your frontend application instantly gains powerful, AI-driven analytics capabilities, transforming your decision-making from hours or days into seconds.

We will soon release a full repository for you to test this setup hands-on.

Conclusion

GoodData Composable & Embeddable AI Analytics puts intelligent insights exactly where your decisions happen—without hassle or workarounds. Whether integrating within backend applications or embedding directly into frontend interfaces, analytics become interactive, instantaneous, and contextually aligned to your workflows. This streamlined approach empowers businesses with smarter, faster decisions, helping you stay agile, informed, and always one step ahead.

Analytics that follow your decisions—anywhere, anytime.