Skip to content

Installation

If you are starting from an example project - all types, utilities, and modules are installed by default. Therefore, you can continue reviewing individual modules for more information about usage.

Database TypeScript types

If you are adding Supabase Modules to an existing project. Before installing any modules, you will need to generate the database's TypeScript types.

Make sure you work in a /database directory from the root repository.

bash
pnpm db:gen-types
bash
supabase gen types typescript --local > database/types/supabase.ts
bash
cd modules
degit webscopeio/supabase-modules/apps/next/database/types types

Module utilities

If you are adding Supabase Modules to an existing project. Before installing any modules, you will need to add some database utils.

Make sure you work in a /database directory from the root repository.

bash
cd modules
degit webscopeio/supabase-modules/apps/next/database/client client
ts
"use client"

import { createBrowserClient } from "@supabase/ssr"
import type { SupabaseClient } from "@supabase/supabase-js"

import { env } from "@/lib/env"

import type { Database } from "../types/supabase"

export function createClient(): SupabaseClient<Database> {
  return createBrowserClient<Database>(
    env.NEXT_PUBLIC_SUPABASE_URL,
    env.NEXT_PUBLIC_SUPABASE_ANON_KEY
  )
}
ts
import { cookies } from "next/headers"
import { createServerClient, type CookieOptions } from "@supabase/ssr"

import { env } from "@/lib/env"

import type { Database } from "../types/supabase"

export function createClient(): ReturnType<
  typeof createServerClient<Database>
> {
  const cookieStore = cookies()

  return createServerClient<Database>(
    env.NEXT_PUBLIC_SUPABASE_URL,
    env.NEXT_PUBLIC_SUPABASE_ANON_KEY,
    {
      cookies: {
        get(name: string) {
          return cookieStore.get(name)?.value
        },
        set(name: string, value: string, options: CookieOptions) {
          try {
            cookieStore.set({ name, value, ...options })
          } catch (error) {
            console.error(error)
          }
        },
        remove(name: string, options: CookieOptions) {
          try {
            cookieStore.set({ name, value: "", ...options })
          } catch (error) {
            console.error(error)
          }
        },
      },
    }
  )
}

List of modules

Find all the modules you need for your Supabase project here. Quick to integrate, ready to use.

ModulesDependencies
User-