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-