Vector Similarity Search in Bubble.io Using Supabase and pgvector

Hello Bubble developers! This is a step-by-step tutorial on how to implement vector similarity search in your Bubble.io applications using our new plugin: Supabase pgvector. This plugin integrates with Supabase, an open-source Firebase alternative, and pgvector, a PostgreSQL extension for vector similarity search.

Introduction

Before we dive into the steps, let’s briefly discuss what Supabase and pgvector are and why they are essential for our use case.

• Supabase: Supabase is an open-source alternative to Firebase. It provides a suite of tools for building web applications, including a Postgres database, authentication, storage, and serverless functions. Supabase provides a full Postgres database for every project, which is crucial for our use case as pgvector is a Postgres extension.
• pgvector: pgvector is an open-source vector similarity search extension for PostgreSQL. It supports exact and approximate nearest neighbor search, L2 distance, inner product, and cosine distance. This extension is particularly useful for AI applications where high-dimensional vector data needs to be efficiently queried.

Step-by-Step Guide

Step 1: Creating a New Project in Supabase

First, head over to the Supabase dashboard and create a new project. This is where your data will be stored and managed. During the creation process, you’ll be asked to set a database name and password. Make sure to keep these details safe — you’ll need them later!

Step 2: Database Configuration

During the project creation phase, you’ll be prompted to configure the database name and password. This step is crucial for securing your database. Remember to note down the password, as it will be required later when connecting your Bubble.io plugin to the Supabase database.

Step 3: Recording Your Database Details

Once your project is up and running, go to Project settings -> Database. Here, you’ll find your database URL, username, and database name. These are crucial for connecting your Bubble.io app to Supabase, so make sure to note them down.

Step 4: Activating the Vector Extension

Next, we’re going to enable the pgvector extension. This PostgreSQL extension allows for efficient vector similarity search, a key component in many AI applications. To enable it, go to the Database page within your project dashboard, select Extensions in the sidebar, and enable pgvector.

Step 5: Bridging Your Bubble.io App and Supabase

Open your Bubble.io app, download the Supabase pgvector plugin, and navigate to our plugin settings. Here, enter the database URL, username, password, and database name you noted down earlier. This will establish a secure connection between your app and the Supabase database.

Step 6: Implementing the ‘Insert’ and ‘Search’ Actions

With the connection in place, you can now start using our plugin’s features. The ‘Insert’ and ‘Search’ actions are key to interacting with your data. When setting these up, make sure the ‘tableName’ field matches a table in your Supabase database. If the table doesn’t exist yet, you can easily create one using the ‘Create Table’ action.

And there you have it! By following these steps, you can implement vector similarity search in your Bubble.io applications, unlocking a whole new range of possibilities. We can’t wait to see what you build with our plugin!