Auth on Frontend

Implement authentication UX and routing boundaries safely on the client.

  • Ideally use Better Auth for a full auth stack with session management, but principles apply to any auth solution.
  • Keep permission checks at route and component boundaries.
  • Use middleware or route guards to protect private routes and redirect unauthenticated users to sign-in / dashboards.
  • Separate session retrieval from feature-specific authorization logic.

Implementation checklist

  • Define public vs private route groups.
  • Handle expired sessions gracefully with redirect to sign-in and optional "session expired" messaging.
  • Keep permission checks in route modules and avoid sprinkling them in shared UI components.

Common pitfalls

  • Relying on frontend-only authorization checks.
  • Permission logic duplicated across screens.

On this page