Autenticación
Esta feature demuestra los cinco patrones de autenticación más relevantes en la mayoría de las aplicaciones modernas. JWT con access token de corta duración y refresh token en una cookie HttpOnly con rotación automática; OAuth 2.0 vía NextAuth con proveedor de Google; TOTP con QR Code escaneable y códigos de respaldo; Magic Link sin contraseña por correo; y WebAuthn/Passkeys para inicio de sesión biométrico vía FIDO2. Cada subpantalla es interactiva: ves el token generándose, el QR Code real, el enlace siendo enviado y la propia biometría del dispositivo usada para autenticar.
Tecnologías
- NextAuth.js
- JWT
- OTPLIB
- WebAuthn API
- Next.js API Routes
- TypeScript
Arquitectura
- Next.js API
- Access Token de corta duración
- Refresh Token en cookie HttpOnly
- OAuth Authorization Code Flow
- TOTP
- WebAuthn/FIDO2 con claves asimétricas
Conceptos
- Access Token + Refresh Token
- Token Rotation
- OAuth 2.0
- TOTP
- Magic Link
- WebAuthn/Passkeys (FIDO2)
- cookies HttpOnly
- LocalStorage
- Protección CSRF
Área de demostración
La demostración es 100% funcional — pruébala ahora.
PWA y Caché Inteligente
Instalación nativa, caché multi-estrategia por tipo de recurso y detección real de conectividad: los pilares que sostienen un buen PWA.
3D y Animaciones Avanzadas
Demostración interactiva de renderizado 3D en tiempo real: una escena orbitable con materiales PBR, un sistema solar completo con una cámara que persigue al planeta enfocado, una galaxia de 8.000 partículas con un shader GLSL escrito desde cero, y un recorrido guiado por scroll a través del propio stack técnico del autor.