> For the complete documentation index, see [llms.txt](https://docs.shipped.club/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.shipped.club/features/supabase.md).

# Supabase

[Supabase](https://supabase.com/) is a popular open-source platform (Firebase alternative) that provides many interesting services, like, Authentication, Postgres Database, Realtime database, Edge functions, REST API, GraphQL, and so on.

Shipped supports Supabase Auth with these methods:

\- magic link auth\
\- email and password\
\- SSO (social login)

Due to the many changes that affect the codebase of Shipped, there is a dedicated branch called `supabase`. If you intend to use Supabase Auth, move to the `supabase` branch and start working on top of it.

Move to the `supabase` branch:

{% code title="terminal" %}

```bash
git checkout supabase
```

{% endcode %}

## Supabase get started

To use Supabase, start creating a new Supabase project at <https://database.new/>

Configure the default Site URL and Redirect URLs under Authentication > URL Configuration on Supabase.

<figure><img src="/files/2aUHquQ0CxKGuCLtgJwd" alt=""><figcaption><p>Supabase Authentication > URL Configuration</p></figcaption></figure>

### Environment variables

Once done, you need to set two environment variables:

{% code title=".env" %}

```yaml
NEXT_PUBLIC_SUPABASE_URL=""
NEXT_PUBLIC_SUPABASE_ANON_KEY=""
```

{% endcode %}

You can retrieve the values from <https://supabase.com/dashboard/project/_/settings/api>

We have dedicated guides about the setup of Supabase Auth:

* [Supabase Auth](/features/authentication/supabase-auth.md)
* [Supabase Magic Link](/features/authentication/supabase-auth/supabase-magic-link.md)
* [Supabase Email & Password](/features/authentication/supabase-auth/supabase-email-and-password.md)
* [Supabase Authentication Flow](/features/authentication/supabase-auth/supabase-authentication-flow.md)

## Supabase Postgres

Supabase provides a Postgres database to get started and for free.

If you want to use it in your Shipped-based SaaS, follow these instructions.

You need to set two environment variables `DATABASE_URL` and `DIRECT_URL`.

To retrieve them go to your Supabase project (click here <https://supabase.com/dashboard/project/_/settings/api>) and click on the "Connect" button.

In the modal, click on the **ORMs** tab and select **Prisma.**

Below you'll find the two environment variables, copy the values and paste them into your local `.env` file. Just remember to replace `[YOUR-PASSWORD]` with the password you set for your database.

{% hint style="info" %}
Remember to set `DATABASE_URL` and `DIRECT_URL` to your hosting service as well.
{% endhint %}

After this step, click on the `prisma/schema.prisma` tab in the Supabase modal, and copy the content.\
Paste it into your local `schema.prisma` file, removing any duplicates.

{% code title="prisma/schema.prisma" %}

```prisma
generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider  = "postgresql"
  url       = env("DATABASE_URL")
  directUrl = env("DIRECT_URL")
}
```

{% endcode %}

The `DATABASE_URL` is used when you run your application, while `DIRECT_URL` is used by the `npx prisma` commands, like `db push` or `migrate`.

You're now setup with your Supabase Postgres database 🎉

## Custom domain

You can configure your custom domain in Supabase, so that when a user logs in, instead of the supabase domain, they will see your domain.

This is not mandatory, and this is a paid feature of Supabase, you can find more information on the official [Supabase documentation](https://supabase.com/docs/guides/platform/custom-domains).

<figure><img src="/files/XGwkMRLThZxY7PcD51S3" alt=""><figcaption><p>Google sign in page with a Supabase default domain</p></figcaption></figure>
