Setup

Supabase setup

Configure the public environment, hosted project settings, migrations, and login callbacks for this static Cloudflare Pages starter.

Checklist

1.Create or choose a Supabase projectUse a hosted project for deploy previews and production, then set API defaults.

In Supabase Dashboard > Project Settings > API, use these settings before applying migrations.

Supabase API settings

[YES] Enable Data API
[NO] Automatically expose new tables
[YES] Enable automatic RLS

2.Copy .env.example to .env.localKeep the browser app on the public Supabase variables only.

Command

cp .env.example .env.local

3.Fill NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_ANON_KEY, and NEXT_PUBLIC_SITE_URLUse http://localhost:3000 locally, then set preview and production values in Cloudflare Pages.

Copy the hosted project URL and anon public key from Supabase Project Settings > API.

.env.local

NEXT_PUBLIC_SUPABASE_URL=https://your-project-ref.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key
NEXT_PUBLIC_SITE_URL=http://localhost:3000

4.Set public environment variables in Cloudflare PagesDo not upload .env.local; add the same public keys for Production and Preview before the Pages build.

In Workers & Pages > your Pages project > Settings > Variables and Secrets, add each key for Production and Preview as needed. NEXT_PUBLIC_* values are bundled into the static browser build, so never add service-role or private API keys.

Cloudflare Pages variables

Use the deployed Pages or custom domain for NEXT_PUBLIC_SITE_URL.

NEXT_PUBLIC_SUPABASE_URL=https://your-project-ref.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key
NEXT_PUBLIC_SITE_URL=https://your-production-domain.example

5.Apply migrations using one selected pathRemote CLI is preferred for projects that will keep evolving.

6.Configure login callbacks and Google providerAllow local, production, preview, and Supabase Google OAuth callbacks.

Google login is controlled in src/lib/auth-config.ts. If enabled, configure Google in Supabase provider settings.

http://localhost:3000/auth/callback
https://your-production-domain.example/auth/callback
https://your-preview-domain.pages.dev/auth/callback

Google OAuth client

Authorized redirect URI:
https://your-project-ref.supabase.co/auth/v1/callback

Authorized JavaScript origins:
http://localhost:3000
https://your-production-domain.example
https://your-preview-domain.pages.dev

7.Run the app and test login/profile flowContinue with Google or request a magic link, then save profile fields.

Checklist summary

0 of 7 steps complete. 7 steps remaining.

Completed

Remaining

Security checks

RLS and public keys

Migration path

Choose one path after API settings are set.

Supabase CLI for a remote project

Run from the repo root. The dry run previews unapplied migrations before db push applies them.

Remote CLI commands

supabase login
supabase link
supabase db push --dry-run
supabase db push

Migration order

supabase/migrations/0001_profiles.sql
supabase/migrations/0002_usernames.sql
supabase/migrations/0003_public_rpc_hardening.sql

Final verification

Run npm run dev, continue with Google or request a magic link, then save profile fields.