Quick-start guide
This step-by-step guide walks you through creating your first Embeddable dashboard using sample data. Want to use your own data right away? Visit our Zero to Dashboard in 25 Minutes tutorial.
Prerequisites
This guide assumes you have at least a basic understanding of JavaScript and how to use the (command-line) Terminal.
Make sure you have the following tools installed:
- A code-editor suitable for JavaScript such as VS Code (opens in a new tab) or Sublime Text (opens in a new tab).
- Node (opens in a new tab) version 20 or higher (run
node -vto check) - Git (opens in a new tab) (run
git -vto check).
Steps
Embeddable stores your charting components, data models and themes in code, so you have full control over the look-and-feel and the data powering your dashboards. Start with step 1 below.
🟠 Required 🟢 Recommended 🔵 Optional
Set up your workspace
- 🟠 Set up your workspace (download the starter repo and push it to your workspace)
- 🟢 Explore your workspace (see the sample dashboards in action)
Build your first dashboard
- 🟢 Build your first Embeddable (your first interactive dashboard using our test data)
- 🟢 Switch the theme (change fonts, colors, and much more)
- 🔵 Build your first component (for use on your dashboards)
These steps give you a solid understanding of how Embeddable works.
What's next
Once you've completed the quick-start guide, next steps are to bring in your own data and design system:
- 🟠 Connect your database
- 🟠 Create your first data model to define and manage data access
- 🟢 Apply row level security so your end-users see the right data
- 🟢 Set up your theme to match your brand