# Supabase

[Supabase](https://supabase.com/) is an open-source Firebase alternative. It’s built on top of PostgreSQL and packed with many features such as database, auth, storage, REST, and GraphQL APIs.\
Let's explore it in more details:point\_down:

## Configuration

1. On the **Data sources** page, click **Connect**, and select *Supabase* in the Data sources list.
2. Enter a name to identify it within your app and specify all the required **connection settings** fields.
3. To obtain the connect details, go to your Supabase project > *Project Settings*, and click the **Connect** tab in the top bar.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FICHeKfSvKqsjBlzoocH2%2FCleanShot%202025-02-21%20at%2012.26.25%402x-min%20(2).png?alt=media&#x26;token=ae79c922-1a15-4a21-b7c5-3a8bc2b5da71" alt=""><figcaption></figcaption></figure>

5. In the window that appears, click **View parameters** under *Session pooler*.

{% hint style="info" %}
We recommend connecting to your Supabase project via the **Session pool** mode.
{% endhint %}

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FiPoOFDn7ZOCWs5tE80P9%2FCleanShot%202025-02-21%20at%2012.34.06%402x-min.png?alt=media&#x26;token=7e545ee6-d048-4ae7-b72c-787a9468c601" alt=""><figcaption></figcaption></figure>

6. Copy all the required data and paste it to the necessary *Data source connection fields*.

{% hint style="info" %}
You can also add the specific tables you want to load to avoid issues with larger schemas.
{% endhint %}

6. Click **Test connection** to check if the configuration is correct and then click **Connect Datasource** to complete the setup.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FLlOi7hXkVgBTXxQ25vQE%2FCleanShot%202025-11-07%20at%2009.30.45%402x-min.png?alt=media&#x26;token=7f6d707d-e3b0-465a-9867-e3d5c98d8075" alt=""><figcaption></figcaption></figure>

Once connected, UI Bakery will extract the database structure and store column types. This data will be used to suggest proper [table columns and form field types](https://docs.uibakery.io/concepts/components/work-with-components/field-types-and-types-recognition).

If you need to be able to override the default data source database with a custom value in the action, you can enable the **Allow override database name in action** setting in the *Data source connection* windo&#x77;**.** \
Once enabled, you will be able to specify a custom database when configuring an action. In case a database is not specified, the default data source database will be used.

## Usage

Once you have established a connection between UI Bakery and your Supabase database, you can access its data, load it and send it back. Listed below are all the *supported action steps*:

* [SQL Query](https://docs.uibakery.io/reference/working-with-actions/sql-query)
* [Load Table](https://docs.uibakery.io/reference/working-with-actions/load-table-action)
* [Load Row](https://docs.uibakery.io/reference/working-with-actions/load-row-action)
* [Create Row](https://docs.uibakery.io/reference/working-with-actions/create-row-action)
* [Bulk Create Rows](https://docs.uibakery.io/reference/working-with-actions/bulk-create-rows-action)
* [Update Row](https://docs.uibakery.io/reference/working-with-actions/update-row-action)
* [Delete Row](https://docs.uibakery.io/reference/working-with-actions/delete-row-action)
* [Bulk Delete Rows](https://docs.uibakery.io/reference/working-with-actions/bulk-delete-rows-action)

***

Check out more about the Supabase integration and the apps you can build with it on our [website](https://uibakery.io/integrations/supabase).