Make a project connect to supabase

This project is a demo project of supabase, mainly introduces how to make a project connect to supabase.

Project Structure

  • ▶supabase-starter
    • ▶public/
      • …
    • README.md
    • ▶supabase add supabase folder to your project
      • seed.sql empty file
      • ▶migrations
        • 20250419080529_init.sql empty file
    • package.json
    • tailwind.config.ts

Add supabase library

package.json
{
  "name": "supabase-starter",
  "version": "0.1.0",
  "private": true,
  "scripts": {
6 collapsed lines
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint && npm run type-check"
  },
  "dependencies": {
4 collapsed lines
    "next": "14.2.23",
    "react": "^18",
    "react-dom": "^18",
    "resend": "^4.3.0"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "eslint": "^8",
    "eslint-config-next": "14.2.23",
    "postcss": "^8",
    "supabase": "^2.20.12",
    "tailwindcss": "^3.4.1",
    "typescript": "^5"
  }
}

Connect to supabase

1

Login to supabase

Execute the command in the terminal, and press Enter. This will open a browser window and take you to the supabase login page. Copy the generated code and paste it into the terminal and click Enter.

Terminal window
npx supabase login
2

Initialize supabase

Terminal window
npx supabase init
3

Connect to supabase

Terminal window
npx supabase link --project-ref <project_id> --password <db_password>
4

Run migrations

Terminal window
npx supabase migration up --linked
5

Reset database

Terminal window
npx supabase db reset --linked

Categories : Supabase