NextBase comes with Email, Email + password and Third party providers authentication built-in.

It only has small wrappers around the supabase javascript client.

The authentication queries are present in the supabase-queries.ts file. Corresponding hooks are present within react-query-hooks.ts file. Both files are within the utils folder.

Supported auth methods

Authentication TypeDescription
EmailAuthentication using only the user's email.
Email + PasswordAuthentication using the user's email and password.
Third Party ProvidersAuthentication using third-party providers. Examples given are Google, GitHub, and Twitter.
Configuration is done via the Supabase dashboard.
Login with API KeyAuthentication using an API key using Unkey (Nextbase Ultimate only).


Providers are configured using the RenderProviders component. It renders all the providers passded to it as props. For eg: the login page component Login.tsx component renders providers like so

  providers={['google', 'github', 'twitter']}
  onProviderLoginRequested={(provider) => {

You can configure whichever providers you like using the supabase dashboard. Head over to{your-project}/auth/providers and configure the providers you require.

They will automatically work in your frontend. No other configuration required.