Introduction to development
Embeddable is code-first: the building blocks of your customer-facing analytics live in your own repository (or separate repos), making them easy to customize, version, and integrate with your existing codebase. In your repo you can define:
- Data models - describe how to query your data, in YAML or JavaScript.
- Components - use Embeddable's ready-made charting components, or build your own in React.
- Dashboards as code - compose data models and components into dashboards, entirely in code.
We'll come back to creating each of these. They all share the same workflow: you develop locally against a live preview, then push your code to your Embeddable workspace using the SDK's CLI. Behind the scenes, when you push:
- The CLI uses a standard JS bundler (Vite.js (opens in a new tab)) to bundle your components and generate a minified JS bundle.
- This bundle, along with your data models and metadata from your config files, is securely pushed to Embeddable.
Since Embeddable uses standard bundling tools, you have no limitations on how you build—whether it’s the CSS framework, charting library, or design system you prefer. If it can be bundled, it can be sent to Embeddable.
If you can dream it, you can build it. 🚀
Embeddable supports building components in React, but you can embed anywhere there is HTML.
Requirements
Embeddable requires Node.js version 20 or later. To update Node.js:
- If you're using a version manager like nvm, run:
nvm install 20 nvm use 20