Make authentication predictable.

Authentication is a sequence of session, verification, redirect and recovery states. Build each state explicitly so users are not stranded after signup or shown a private screen before their session is ready.

Forms and Auth · 8 min read · Updated 2026-06-06

The essential states

Here are the key things to get right. None of them are complicated on their own, but skipping one tends to undermine the rest.

  • Signed out: explain the action and show the right form.
  • Submitting: disable duplicate actions and preserve input.
  • Signed in but unverified: explain how to verify and resend safely.
  • Session loading: show a stable placeholder, not a false signed-out state.
  • Verified: redirect to the intended protected route.
  • Error: translate provider errors into a useful next step.

With those states defined, build and verify them in the order below.

  1. Configure the site URL and allowed redirect URLs.
  2. Create signup and login actions with field validation.
  3. Handle email verification and resend limits.
  4. Subscribe to auth state changes and clean up listeners.
  5. Protect data with RLS rather than relying only on route guards.
  6. Test refresh, expired session, wrong password and verification links.
A route guard improves the interface; row level security protects the data.

Pre-launch authentication checklist

The list below breaks this down into the parts that matter most. Read through each one and note anything that applies to your own setup.

  • Verification and password reset emails arrive within a reasonable time.
  • Expired or reused verification links show a clear, honest message.
  • Session persists correctly across a page refresh.
  • Redirect URLs are restricted to trusted domains only.
  • Sign-out clears the session everywhere it is checked, including tabs.

Warning signs of a broken auth flow

Before making changes, work through the points below. Each one covers a different part of the picture, so treat them as a set rather than picking favourites.

  • Users report being logged out unexpectedly after a short session.
  • Verification links redirect to the wrong environment or domain.
  • A signed-out user can briefly see protected content before the guard loads.

Questions

This happens when the interface assumes signed-out before the session has finished loading. Show a neutral loading state until the session check completes, rather than defaulting to signed-out.

Detect the expired or invalid token and show a clear message with an option to request a new verification email, rather than a generic error.

No. A route guard only controls what the interface displays. The underlying data must be protected with row level security so it cannot be accessed directly even if the interface is bypassed.

Want your app built properly?

We take Lovable prototypes to production: secure data, real auth and a clean deploy.