Designs and deploys a Postgres schema on Supabase for an existing frontend codebase. Scans for TypeScript interfaces and mock data to infer entities, writes a migration, creates a Supabase project, and wires environment variables. Called by the vibe-ship orchestrator — supports Next.js and Vite.
Install
npx skillscat add chloezhu010/vibe-ship/supabase-setup Install via the SkillsCat registry.
Supabase Setup
Set up Supabase (Postgres database) for this project.
This skill is called by the
vibe-shiporchestrator. The variableFRAMEWORK
is set to eithernextjsorviteby the caller.
1. Read the codebase
Scan for existing data models:
- TypeScript
interfaceandtypedefinitions - Mock data arrays or objects
- localStorage usage patterns (these reveal entity shapes)
- Any existing SQL or schema files
List every entity found and its key fields before proceeding.
2. Design the schema
Invoke postgresql-table-design with your entity summary.
Then apply supabase-postgres-best-practices.
Write the resulting migration SQL to:supabase/migrations/001_initial.sql
Every table must include:
id uuid primary key default gen_random_uuid()created_at timestamptz default now()alter table <name> enable row level security;(policies added in auth-setup)
3. Create and link the Supabase project
Install the Supabase CLI if not present:
brew install supabase/tap/supabaseCheck if already authenticated, and log in only if needed:
supabase projects list 2>/dev/null || supabase loginAsk the user to run the following — they should generate a strong password themselves (e.g. with openssl rand -base64 32) and substitute it in:
supabase orgs list # note your org ID
supabase projects create "<app name>" --org-id <org-id> --region eu-west-2 --db-password <your-strong-password>Free tier limit: If you see an error about reaching the maximum number of active projects, go to app.supabase.com, pause or delete an existing project, then retry the command above.
Note the project-ref from the output, then link and initialise:
supabase link --project-ref <project-ref>
supabase init --forcesupabase init creates supabase/config.toml, which is required by the auth-setup step for SMTP configuration.
Fetch credentials:
supabase projects api-keys --project-ref <project-ref>Ask the user to copy the anon key from the output and create .env.local themselves:
If FRAMEWORK = nextjs:
NEXT_PUBLIC_SUPABASE_URL=https://<project-ref>.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=<paste anon key here>If FRAMEWORK = vite:
VITE_SUPABASE_URL=https://<project-ref>.supabase.co
VITE_SUPABASE_ANON_KEY=<paste anon key here>Wait for the user to confirm they have saved .env.local before continuing.
Add .env.local to .gitignore if not already present.
4. Run the migration
supabase db pushThis applies supabase/migrations/001_initial.sql to the hosted project directly — no dashboard visit needed.
5. Install the Supabase client
Run: npm install @supabase/supabase-js
6. Create the Supabase client file
If FRAMEWORK = nextjs → create lib/supabase.ts:
import { createClient } from '@supabase/supabase-js'
export const supabase = createClient(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
)If FRAMEWORK = vite → create src/lib/supabase.ts:
import { createClient } from '@supabase/supabase-js'
export const supabase = createClient(
import.meta.env.VITE_SUPABASE_URL,
import.meta.env.VITE_SUPABASE_ANON_KEY
)7. Validate
Ask the user to run npm run dev and confirm there are no import errors.
Report: "✓ Supabase setup complete. Database schema written and client configured."