Add login and signup
Let people sign up and log in securely. The boring auth stuff, handled.
Categories: auth, authentication, login, signup, register, user accounts, sign in, password, oauth, social login
Tools that power the Add login and signup stack
Supabase Auth — Authentication
Built-in auth with social providers
Resend — Transactional email
Send password reset and magic link emails
Zod — Validation
Validate form inputs client and server side
Setup guide
- Supabase: In your Supabase project, go to Authentication > Providers and enable Email provider (already enabled by default). Install @supabase/supabase-js and initialize the client with your project URL and anon key. Use supabase.auth.signUp() and supabase.auth.signInWithPassword() for registration and login. (open)
- Supabase: Enable social login providers like Google or GitHub under Authentication > Providers. For Google, create OAuth credentials in Google Cloud Console and add them to Supabase. Call supabase.auth.signInWithOAuth({ provider: "google" }) to trigger the OAuth flow. (open)
- Supabase: Use supabase.auth.onAuthStateChange() to listen for login and logout events. Store the session in React state or context. Create a ProtectedRoute component that checks for an active session and redirects to login if not authenticated. Use supabase.auth.getUser() to fetch the current user profile. (open)