# 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>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.shipped.club/features/supabase.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.