Supabase Integration

    Supabase Integration

    Connect your Supabase project to enable database, authentication, and storage features in your generated applications.

    Authentication MethodAPI Keys

    Supabase integration uses your project URL and anonymous key. These credentials are publicly safe to expose on the client side.

    How to Connect

    1. Go to your Supabase Dashboard
    2. Select your project (or create a new one if you don't have a Supabase project yet)
    3. Navigate to Project SettingsAPI
    4. Copy your Project URL and anon public key
    5. In Revlo, go to /integrations
    6. Find the Supabase integration card and click Configure
    7. Paste your Project URL and anon key in the modal
    8. Click Save to connect successfully
    Example
    Project URL: https://xxxxxxxxxxxxx.supabase.co
    Anon Key: eyJhbGci... (long token starting with eyJ)

    What It Enables

    Supabase Client Setup

    Automatically adds a Supabase client file to your project at src/lib/supabaseClient.ts

    Environment Variables

    Injects environment variables for Supabase URL and anon key into your generated application.

    Auth Integration

    Generate authentication flows with Supabase Auth (email/password, OAuth providers, magic links).

    Database Operations

    Interact with your Supabase database tables with type-safe queries and real-time subscriptions.

    Using Supabase in Projects

    When Supabase is connected, the chat interface becomes "Supabase-aware" and can generate integration-specific code.

    Example Prompts
    Add Supabase authentication with email and password
    
    Create a users table with RLS policies
    
    Add real-time chat with Supabase subscriptions
    
    Implement file upload with Supabase Storage
    Note: The first time you use Supabase in a project, Revlo will ask for permission to enable the Supabase integration for that specific project.

    Environment Variables

    Revlo automatically adds these environment variables to your generated project:

    For Next.js Projects
    NEXT_PUBLIC_SUPABASE_URL=https://xxxxx.supabase.co
    NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGci...
    For Vite React Projects
    VITE_SUPABASE_URL=https://xxxxx.supabase.co
    VITE_SUPABASE_ANON_KEY=eyJhbGci...

    When deploying to Netlify or DigitalOcean, these environment variables are automatically configured in the deployment settings.

    Ready to add Supabase?
    Connect your Supabase project and start building.