Authentication Deep Dive: Supabase Auth + Resend Transactional Emails

How SpaceZero implements secure authentication with OAuth providers, email/password, and Resend for transactional emails.

Authentication with Supabase and Resend

SpaceZero provides a complete authentication system out of the box.

code

User → Frontend (React) → Supabase Auth → Resend (emails)

OAuth Providers: Google, GitHub (easily extensible)
Email/Password: Secure with password strength validation
Password Reset: Via Resend transactional emails
Email Confirmation: Double opt-in for new accounts
Session Management: Persistent sessions with automatic refresh (Supabase JS client)
Rate Limiting: check-user 10 req/min, send-email 5 req/min

In supabase/config.toml:

toml

[auth]

site_url = "https://your-app.space"

redirect_urls = ["https://your-app.space/**"]

Transactional emails use Resend (not Supabase's built-in emails):

typescript

// functions/api/auth/send-email.ts

import { Resend } from 'resend';

const resend = new Resend(env.RESEND_API_KEY);

await resend.emails.send({

from: 'Your App <[email protected]>',

to: email,

subject: 'Reset your password',

html: renderPasswordResetEmail(appName, resetUrl),

});

Customizable branded templates in send-email.ts:

OAuth providers are typed as a union in src/hooks/useAuth.ts:

typescript

signInWithOAuth: (provider: 'google' | 'github') => Promise<void>;

To add a provider, extend the union type and the signInWithOAuth implementation.