Introduction to Dashboards

Embeddable provides a no-code builder that lets non-technical users create, edit, and organize analytics dashboards without writing SQL or code.

It brings together your data models (defined in code) and your components (written in React), giving end users an intuitive, drag-and-drop environment to configure visuals, filters, interactivity, and more.

Why a No-Code Builder?

• Empower Non-Tech Users: Allow product managers, analysts, or support teams to build dashboards themselves.
• Faster Iterations: Dashboards can be designed and tested on the fly. No need to wait for dev cycles to adjust charts or filters.
• Reuse & Scale: Your code-defined models and components are made available in one place. Embeddable handles the plumbing - so a single chart component can be reused by multiple teams or use cases.

High-Level Workflow

1. Define Components & Models in Code

   • Your technical teams build React components (e.g. charts, controls) and data models, then push them to Embeddable.

2. Build Dashboards with Drag & Drop

   • Add a component (like a line chart or dropdown) onto the canvas.
   • Customize it using the inputs available - your team have full control over these.

3. Preview & Interact

   • Preview the dashboard right there, with live data.
   • Build in interactivity to create dynamic, engaging experiences.

4. Test Security Contexts

   • Switch between different security-contexts (e.g. “User A” or “User B”) and environments, seeing the exact data and set up your users see.

5. Publish & Embed

   • Once satisfied, click Publish.
   • Embed the resulting dashboard on your website or app using a web-component (not an iFrame).

With the no-code builder, everyone in your organization - devs and non-devs alike - can collaborate on analytics dashboards. Devs define the underlying data logic and React components; end users assemble, configure, and publish dashboards.