How to build Dashboards from Supabase data

Building Dashboards from Supabase data, which is an open-source Firebase alternative. Draxlr lets you visualise your Supabase data and helps you make better business decisions.

Posted by Vivek on 2025-02-17
How to build Dashboards from Supabase data

Supabase is an open-source Firebase alternative that lets you create Postgres databases with the option to perform CRUD operations on the database.

Supabase also provides these features:

  • APIs to access your data and perform queries.
  • Authentication: Give access to your data to users with row-level permission.
  • Write custom code that can be scaled.
  • Store images or videos.
  • Integrate with machine learning platforms.

Using Draxlr to build Dashboards from Supabase data

Draxlr is a no-code BI tool that helps you build dashboards, get data alerts, and embed dashboards on customer-facing sites.

Draxlr is a technology partner with Supabase to allow Supabase users to build dashboards and get data alerts. Learn more here: https://supabase.com/partners/integrations/draxlr

Here is a quick video walkthrough of how to build a dashboard from Supabase data in Draxlr:

Ok, let's get started.


Connecting Supabase with Draxlr

Supabase allows you to manage multiple organizations, each containing multiple projects with their own Postgres databases. Draxlr enables you to connect to a Supabase project database and gain valuable insights from your data.

  1. Login into Draxlr and navigate to the Add Database page.

  2. Select Supabase from the available database options. Draxlr Select Supabase

  3. Click on Connect Supabase and select the organization that hosts your database. Draxlr Select Supabase Organization

  4. Select the project from the list of projects within the organization. Draxlr Select Supabase Project

  5. Draxlr will automatically fetch database credentials from Supabase, except for the database password, which you need to enter manually.

    Draxlr Set Supabase Password

    Enter the database password manually, and click Next.

  6. Draxlr will sync the table schema and guide you through creating a simple bar chart as part of the onboarding process. Draxlr Onboarding Graph

    Select the table, then specify the x-axis and y-axis values.

  7. Draxlr will generate your first graph query, add it to your dashboard, and set up an email alert to notify you whenever the graph value changes. Draxlr onboarding completed


Generating Queries and Visualizing the data

You can build queries and leverage them to create dashboards and set up alerts.

There are 3 ways to create a query in Draxlr:

  • Query Builder – A no-code feature for generating queries.
  • Raw SQL – Write and execute custom SQL queries.
  • AI-powered SQL Generation – Convert plain-English prompts into SQL queries.

Example: Query Builder

  • You can use Draxlr's no-code query builder to generate data using Filters, Joins, Aggregate, Sort, and Select options.

  • Once you have the desired data result, you can visualise it using multiple graph options like bar, pie, line, area, and more.

    Draxlr Supabase Graph Options

  • After you have completed the Graph setup, you can save the query and:

    • Add it to a Dashboard
    • Create integrations (Email/Slack Alerts, APIs, Google Sheets export).
  • And that's it; your dashboard is ready! Draxlr Supabase - Dashboard View

  • You can share the dashboard with your team and embed the dashboard in your customer-facing application.


With Draxlr, you can turn raw Supabase data into actionable insights, enhancing your decision-making and workflow automation.

Connect your Supabase Database

- Vivek

Ready to build Dashboards
and set Alerts?

This website uses cookies to ensure you get the best experience.