# 🔐 WebAuthn Authentication Demo

Compare discoverable passkeys vs traditional username-based authentication

## ✨ Discoverable Passkeys

Modern passwordless authentication - no username needed!

🚀 RECOMMENDED

- No username or password to remember
- One-click sign in after setup
- Passkey stored on your device
- Works across all your devices (with sync)

### Step 1: Create Your Passkey

Choose a Username
THEN

### Step 2: Sign In Without Username

How it works: Click the button above and your browser will show all passkeys for this site. Select yours to sign in instantly - no username needed!

## 👤 Username-Based Authentication

Traditional WebAuthn with username requirement

🔒 CLASSIC METHOD

- Requires username for sign in
- Passkey linked to specific username
- Good for shared devices
- Familiar authentication flow

### Step 1: Register with Username

Choose a Username
THEN

### Step 2: Sign In with Username

Enter Your Username
Note: You must enter your username first, then authenticate with your device's biometric or PIN.

## 🔍 Debug Information

📝 Registration Flow
1 POST /api/webauthn/registration/start - Request
▶
No data yet
2 /api/webauthn/registration/start - Response
▶
No data yet
3 API navigator.credentials.create()
▶
No data yet
4 Authenticator Response
▶
No data yet
5 POST /api/webauthn/registration/finish - Request
▶
No data yet
6 /api/webauthn/registration/finish - Response
▶
No data yet
🔓 Authentication Flow
1 POST /api/webauthn/authentication/start - Request
▶
No data yet
2 /api/webauthn/authentication/start - Response
▶
No data yet
3 API navigator.credentials.get()
▶
No data yet
4 Authenticator Response
▶
No data yet
5 POST /api/webauthn/authentication/finish - Request
▶
No data yet
6 /api/webauthn/authentication/finish - Response
▶
No data yet