> 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/authentication/supabase-auth/supabase-email-and-password.md).

# Supabase Email & Password

Shipped supports Supabase Email and Password authentication.

It is an authentication method that requires the user to provide a valid email and create a password (at least 6 characters in length).

When the credentials are provided, Supabase sends a confirmation email to the inbox of the user.

The email contains a link. When the user clicks on that link, the account is correctly confirmed, and the user can use the credentials to log in to your website.

{% hint style="info" %}
If you need Supabase Auth, move to the `supabase` branch of the Shipped git repository.

All the code changes described below are already applied there.

Use this command in the terminal to move to the branch:

`git checkout supabase`
{% endhint %}

## Add Email and Password auth

To use Email and Password authentication using Supabase, you need to apply a couple of changes.

1. Update the file `src/app/signup/page.tsx`

Replace:

```jsx
import SignUp from "@/components/pages/SignUp/SignUp";

return <SignUp />;
```

with:

```jsx
import SignUpWithEmailPassword from "@/components/pages/SignUp/SignUpWithEmailPassword";

return <SignUpWithEmailPassword />;
```

2. Update the file `src/app/login/page.tsx`

Replace:

```jsx
import Login from "@/components/pages/Login/Login";

return <Login />;
```

with:

```jsx
import LoginWithEmailPassword from "@/components/pages/Login/LoginWithEmailPassword";

return <LoginWithEmailPassword />;
```

\
The configuration is complete.\
You now have both the signup and login pages with email and password prompts, plus the Google sign-in by default.

## Authenticated users

To identify logged-in users in a client component (`"use client"` on top of the component file), use this code:

{% code title="client component" %}

```jsx
"use client"

import { useSupabaseSession } from "@/hooks/supabase/useSupabaseSession";

const ClientComponentExample = () => {
    const { session, status } = useSupabaseSession();
}
```

{% endcode %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.shipped.club/features/authentication/supabase-auth/supabase-email-and-password.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.