> Documentation index: https://www.gooddata.ai/docs/gooddata-ui/llms.txt lists every page of these docs as Markdown.

# Integrations

> Connect GoodData.UI to your application environment: authentication, embedding, theming, and framework support.

Guides for integrating GoodData.UI into your application: authentication and cross-origin access, embedding dashboards and visualizations, theming, interactivity, the context hooks, Web Components, and framework guides for Angular, Next.js, and Vue.

On a new project, start with [Integrate into an existing application](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/backend-setup/index.md) and [Authenticate to the backend](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/authentication/index.md); everything else builds on them. The other sections can be adopted independently as your application grows.

To show a saved dashboard in an existing page without installing any SDK code, [embed a dashboard in an iframe](https://www.gooddata.ai/docs/cloud/embed-visualizations/iframes/). It works in any framework, supports basic customization through URL query parameters, and talks to the host page over [`postMessage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage).

## Pages

- [Integrate into an existing application](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/backend-setup/index.md): Add GoodData.UI to an existing React application by installing packages and styles, configuring backend and workspace contexts, CORS, and authentication.
- [Authentication](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/authentication/index.md): Pick how your GoodData.UI application authenticates against GoodData Cloud or GoodData.CN — the GoodData session cookie, a JWT from your own portal, or an API token — and set it up.
- [Renew the session without a redirect](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/renew-session-silently/index.md): Build an authentication provider that renews an expired GoodData session in a hidden iframe, so users keep their place in the app instead of being sent to the login page.
- [Cross-origin issues](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/cross-origin-issues/index.md): Resolve CORS errors between your app and GoodData Cloud or GoodData.CN by proxying the API through your dev server or allowing your origin in production.
- [Embedding](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/index.md): Embed GoodData content at different levels — full dashboards, individual visualizations, or custom visualizations using your own charting library — and apply theming.
- [Web Components](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/index.md): Custom HTML elements that embed GoodData dashboards, visualizations, and the AI assistant in any framework or vanilla HTML, without a direct React dependency.
- [Framework guides](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/framework-integrations/index.md): Use GoodData.UI in Angular, Next.js, and Vue apps — framework-specific setup via React components or the Web Components wrapper.
- [Interactivity](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/index.md): Handle user interactions with visualizations, from drill events to loading and error states.
- [Hooks](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/index.md): Choose the matching React hook to read an SDK provider context or load a plugin-enhanced dashboard.
- [Platform](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/index.md): Evaluate whether a GoodData.UI version and integration approach are suitable for your application and production environment.