Supabase with Expo

Core concepts

1. Create a project and table: Create a project, define a todos table with a user_id referencing auth.users, and enable Row Level Security before inserting any data. — Supabase Expo quickstart
2. Row Level Security: Policies decide who can select, insert, update or delete. With RLS on and no policy, nobody can access the table, which is the safe default. — Supabase RLS
3. Auth in React Native: Use email, magic link or OAuth. Persist the session with AsyncStorage and listen for auth state changes. — Supabase Auth
4. Edge functions: Run server-side code (call an LLM, use a secret, handle a webhook) without exposing keys in the app. — Supabase Functions
5. Realtime and storage: Subscribe to table changes for live updates and use storage buckets for images, with policies on buckets too. — Supabase Realtime
6. Generate types: Generate TypeScript types from your schema so queries are typed and agents catch column mistakes. — Supabase type generation

Concept videos

YouTube channels and searches for these topics. On a large screen they open in the reading panel next to the roadmap.

• Supabase tutorials — Supabase channel
• Expo + Supabase auth — YouTube search: Expo Supabase auth tutorial

Explanation

The anon key is public

The anon (public) key is designed to ship in apps; RLS is what protects data. Never use the service-role key in the app.

Use MCP carefully

A Supabase MCP server lets an agent inspect and change your project. Use a development project and read-only access, and review every migration.

What Is It?

Supabase is an open-source backend built on PostgreSQL with auth, storage, realtime and functions.

Why Should I Care?

You get a real SQL database and auth with minimal server code, and agents generate SQL well.

Real World Analogy

Supabase is a furnished office: desks (tables), reception (auth), locked cabinets (RLS) and a back room (edge functions) already installed.

Visual Mental Model

Expo app (anon key) -> Supabase Auth -> RLS policy -> Postgres table
Secrets -> Edge Function

Smallest Possible Example

alter table public.todos enable row level security;

create policy "users read own todos"
  on public.todos for select
  using (auth.uid() = user_id);

create policy "users insert own todos"
  on public.todos for insert
  with check (auth.uid() = user_id);

Common Mistakes

❌ Creating tables without enabling RLS.

Data is exposed through the auto-generated API.

❌ Using the service-role key client-side.

It bypasses RLS entirely.

Build This Mini Project

Build an authenticated todo app with RLS policies and a screen that lists, adds and checks off todos.

Prompts for Cursor, Claude Code & Codex

Paste these into Cursor, Claude Code, Codex, or any coding agent. Replace the bracketed parts with your app details, and keep the agent in plan mode first so you review the approach before it edits files.

Todos with RLS

Create the todos table with RLS policies (select, insert, update, delete restricted to auth.uid() = user_id), then implement hooks/useTodos.ts with TanStack Query and a screen to list and add todos. Show the SQL separately and do not run it.

Edge function for secrets

Create a Supabase edge function that calls [third-party API] with a secret stored in function secrets and returns only the fields the app needs. Add auth verification of the caller.

Rules, databases & blogs to use

• Supabase rules: rules mentioning Supabase
• Next.js 15 + Supabase rule: Supabase patterns from the web
• Firebase, Supabase and Clerk auth: auth comparison

Resources

• Supabase Expo quickstart
• Supabase RLS
• Supabase Auth
• Supabase MCP