Skip to main content

Supabase Integration

Add database, authentication, and storage to your app.

What is Supabase?​

Supabase is an open-source Firebase alternative providing:

  • PostgreSQL database
  • Authentication (email, OAuth, magic links)
  • File storage
  • Real-time subscriptions
  • Row Level Security (RLS)

Setup​

  1. Click Extensions in your project
  2. Select Supabase
  3. Enter your Supabase credentials:
    • Project URL
    • Anon/Public key

Get Supabase Credentials​

  1. Go to supabase.com
  2. Create a project (free tier available)
  3. Go to Settings → API
  4. Copy:
    • Project URL
    • anon public key

What Gets Generated​

When you add Supabase, the AI automatically:

  • Installs @supabase/supabase-js
  • Creates a Supabase client
  • Sets up authentication hooks
  • Generates database schemas
  • Implements RLS policies

Common Use Cases​

User Authentication​

// Generated automatically
const { data, error } = await supabase.auth.signUp({
  email: 'user@example.com',
  password: 'secure-password'
});

Database Queries​

const { data } = await supabase
  .from('tasks')
  .select('*')
  .eq('user_id', userId);

File Upload​

const { data } = await supabase.storage
  .from('avatars')
  .upload('user-avatar.png', file);

Security​

All generated code includes:

  • Row Level Security (RLS) policies
  • Secure authentication flows
  • Environment variable protection
  • HTTPS-only connections

Next Steps​