Intermediate 🗄️ Database

Supabase Database

Build a complete product management application powered by Supabase (hosted PostgreSQL). Connect to your Supabase project with a Publishable Key, then browse, create, update, and delete records through the REST API. The example uses the Database control for reading data and the Inet control for write operations (PostJSON, PatchJSON, DeleteJSON). Includes record navigation, a product list, detail form, and real-time status feedback. Teaches you how to integrate any Supabase table with WebVB Studio in both VB6 and Python.

VB6 Python Supabase PostgreSQL REST API CRUD

What You'll Learn

1
Connect to a Supabase project using the REST API and Publishable Key
2
Read data with the Database control via InitREST and RESTRefresh
3
Create records with PostJSON and handle insert callbacks
4
Update records with PatchJSON using Supabase query filters
5
Delete records with DeleteJSON and refresh the UI
6
Navigate records and sync a ListBox with the current dataset

Controls Used

Use Cases

  • Supabase-backed product catalogs
  • Cloud database management dashboards
  • Serverless CRUD applications
  • Rapid prototyping with hosted PostgreSQL

Supabase Database Setup

Follow these steps before running the example.

1. Create the Table

This schema includes a primary key, timestamps, and NUMERIC for prices to ensure decimal accuracy.

SQL
-- Create a table for Products
CREATE TABLE products (
  id SERIAL PRIMARY KEY,
  name TEXT NOT NULL,
  description TEXT,
  price NUMERIC(10, 2) NOT NULL,
  stock_quantity INTEGER DEFAULT 0,
  category TEXT,
  created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
);

2. Insert Sample Data

Once the table is created, populate it with starter items so the app has data to display immediately.

SQL
-- Insert some sample products
INSERT INTO products (name, description, price, stock_quantity, category)
VALUES
  ('Mechanical Keyboard', 'RGB backlit with blue switches', 89.99, 50, 'Electronics'),
  ('Ergonomic Mouse', 'Wireless optical mouse with 6 buttons', 45.00, 120, 'Electronics'),
  ('Coffee Mug', 'Ceramic 12oz mug with matte finish', 12.50, 200, 'Home & Kitchen'),
  ('Leather Notebook', 'Hand-bound A5 ruled notebook', 24.00, 75, 'Stationery'),
  ('USB-C Hub', '7-in-1 adapter with HDMI and SD ports', 35.95, 30, 'Electronics');

3. Disable RLS (Quick Start)

The fastest way to get this example running. With RLS disabled, your Publishable Key can read, insert, update, and delete without any policies. This is fine for learning and local testing, but never use this in production — anyone with your Publishable Key would have full access to the table.

SQL
-- Disable Row Level Security so the Publishable Key has full access
ALTER TABLE products DISABLE ROW LEVEL SECURITY;

4. Set Up Row Level Security (Production)

Row Level Security (RLS) controls who can do what. The anon role (used by the Publishable Key for unauthenticated visitors) can only read. The authenticated role (logged-in users) can insert, update, and delete. Without these policies, Supabase blocks all access by default once RLS is enabled.

SQL
-- 1. Enable Row Level Security (this is the bouncer at the door)
ALTER TABLE products ENABLE ROW LEVEL SECURITY;

-- 2. Anyone with the Publishable Key can VIEW products (Read / GET)
CREATE POLICY "Allow public read"
ON products FOR SELECT
TO anon   -- "anon" is the Supabase role used by the Publishable Key
USING (true);

-- 3. Only logged-in users can ADD products (Write / POST)
CREATE POLICY "Allow auth insert"
ON products FOR INSERT
TO authenticated
WITH CHECK (true);

-- 4. Only logged-in users can EDIT products (Update / PATCH)
CREATE POLICY "Allow auth update"
ON products FOR UPDATE
TO authenticated
USING (true);

-- 5. Only logged-in users can DELETE products (Delete / DELETE)
CREATE POLICY "Allow auth delete"
ON products FOR DELETE
TO authenticated
USING (true);

5. Enable Realtime (Optional)

If you want your app to update instantly when a product price or stock changes, tell Supabase to listen to this table. You can also do this from the Supabase Dashboard UI.

SQL
ALTER PUBLICATION supabase_realtime ADD TABLE products;

Why this schema works well

  • SERIAL — automatically handles ID incrementing so you don't have to provide one
  • NOW() — automatically timestamps when a product is added
  • NUMERIC — better than FLOAT for money because it avoids rounding errors

Code Preview

Here's a taste of the code. Open the full example in WebVB Studio to explore, modify, and run it.

Visual Basic 6
Sub cmdConnect_Click
  ApiKey = Trim(txtKey.Text)
  BaseUrl = Trim(txtUrl.Text) & "/rest/v1"

  Data1.InitREST BaseUrl
  Data1.SetHeader "apikey", ApiKey
  Data1.SetHeader "Authorization", "Bearer " & ApiKey
  Data1.TableName = Trim(txtTable.Text)

  Reload
End Sub

Sub cmdSave_Click
  Dim url
  url = BaseUrl & "/" & Trim(txtTable.Text)
  Inet1.PostJSON url, BuildBody(), "OnInserted"
End Sub
Python
def cmdConnect_Click():
    global api_key, base_url
    api_key = txtKey.Text.strip()
    base_url = txtUrl.Text.strip() + "/rest/v1"

    Data1.InitREST(base_url)
    Data1.SetHeader("apikey", api_key)
    Data1.SetHeader("Authorization", "Bearer " + api_key)
    Data1.TableName = txtTable.Text.strip()

    reload_data()

def cmdSave_Click():
    body = build_fields()
    url = base_url + "/" + txtTable.Text.strip()
    Inet1.PostJSON(url, body, "OnInserted")
🗄️

Try the Supabase Database Example

Open this example in WebVB Studio and start experimenting. Modify the code, tweak the controls, and make it your own.

Open in WebVB Studio