Hono + Inertia + React Authentication Guide — Better Auth / Lucia / Session Design Patterns [2026]

Authentication is a perennial pitfall. As of 2026, the practical options collapse to three: - Better Auth: a TypeScript-first full auth library — OAuth, email auth, MFA, organizations. Has a Hono adapter. - Lucia: a lightweight authentication framework — a thin session wrapper, very flexible. - DIY sessions: write the cookie + sessions table yourself. Reasonable for small requirements. Mature open-source options now sit between "all DIY" and "fully managed (Auth0, Clerk)" — that's the 2026 picture.

For business apps, internal tools, and small-mid SaaS, default to Better Auth or Lucia. DIY for the simplest cases. Managed when SLA / compliance is non-negotiable.

Verdict: HttpOnly cookies + server-side sessions is the first-choice default in 2026, even for SPAs. Why: - Tokens are harder to exfiltrate via XSS (HttpOnly attribute) - Server-side immediate revocation works (true revocation is hard with JWTs) - Inertia uses the same cookies your normal requests use — natural fit JWTs make sense for explicit needs: stateless servers, cross-service token sharing, etc.

Standard pattern for current-user info: ride along on Inertia shared props. 1. Hono middleware reads the cookie and resolves the session 2. Minimal user info (id, name, email, role) is attached as `auth.user` shared prop 3. Any React page can read `usePage().props.auth.user` Now nav-bar user names, route guards, and analytics user-IDs are consistent everywhere.

Guard roles (admin / editor / viewer) at two layers: - Server-side guard: Hono middleware checks `c.req.path` against the user's role; 403 on mismatch. This is the last line of defense. - Client-side guard: React hides menu items / disables buttons based on `auth.user.role`. This is for UX. A client-only guard leaves the route reachable directly. Always enforce on the server.

Better Auth makes OAuth provider setup straightforward — Google, GitHub, Microsoft are essentially configuration. LINE login (a Japan-specific need) is handled via a generic OAuth provider plugin (Better Auth) or Lucia's OAuth helper. Watch the usual gotchas: callback URL configuration, `prompt=consent`, and a clean first-sign-in flow that creates the user row (`onSignUp` hook).

Password reset is the standard four-piece set: email, unique token, expiry, single-use. Better Auth ships templates for it; doing it yourself, follow the same pattern. For org-style SaaS / internal tools, invitation links (admin enters an email → user gets a tokenized URL → sets a password) are common. Pair this with the shared-props role flow and the UI work shrinks dramatically.

- HTTPS only: cookies with `Secure`, HSTS enabled - CSRF protection: ensure Inertia requests carry the CSRF token - Rate limiting: mandatory on login, password reset, invitation endpoints - Audit log: login history, role changes, sensitive actions - MFA: TOTP recommended for business workloads (Better Auth supports it) - Session invalidation: revoke sessions on password change / role change

Part 5 is the deployment guide, covering Cloudflare Workers / Vercel / Bun / Node and CI/CD. Series overview: Part 1.

Q1: Should we use Auth0 / Clerk? A: Yes when SLA / support / compliance demands it. For most business and SMB SaaS work, OSS (Better Auth / Lucia) is sufficient. Q2: Better Auth or Lucia? A: Better Auth if you want feature breadth and orgs. Lucia if you want minimal session management and to compose pieces yourself. Q3: SSO / SAML? A: Better Auth has SSO plugins; integration with Microsoft Entra ID / Okta is reasonable. Deep enterprise needs usually point at managed services. Q4: Passkeys (WebAuthn)? A: Better Auth supports passkeys. 2026 is a real adoption window.

- Better Auth official - Lucia official - Inertia.js — Authentication - OWASP Session Management Cheat Sheet - WebAuthn — MDN