alanbuendia.dev

Colofón

Cómo está
hecho

Este portafolio es en sí mismo un proyecto. Sin plantillas ni librerías de componentes: cada pieza está construida a mano, con atención al detalle y al rendimiento.

3

Colores en la paleta

es / en

Bilingüe completo

0

Librerías de componentes

100%

TypeScript

01

El stack

  • FrameworkNext.js 15App Router, generación estática y metadata.
  • UIReact 19Componentes propios, cero librerías de componentes.
  • LenguajeTypeScriptTipado estricto de punta a punta.
  • EstilosTailwind CSS v4Tokens de diseño y utilidades, sin CSS suelto.
  • AnimaciónGSAPScrollTrigger y Observer mueven el deck y las transiciones.
  • TipografíaAnton · Archivo · Plex MonoDisplay, texto y datos, servidas con next/font.
  • InfraVercelHosting, Analytics y Speed Insights.
  • ContactoWeb3FormsFormulario que envía correo sin backend.
02

Decisiones

01

Bilingüe de raíz

Todo el contenido vive como { es, en } y se cambia en el cliente sin recargar la página.

02

Deck en desktop, scroll en móvil

En pantallas grandes la home es una presentación a pantalla completa; en táctil o con movimiento reducido, scroll normal. Mejora progresiva.

03

Contenido dirigido por datos

Proyectos, blog y textos viven en /data, separados de la UI: editar el sitio no requiere tocar componentes.

04

Paleta mínima

Tres colores: tinta, papel y verde ácido. El acento se usa con cuentagotas, nunca como decoración.

05

Movimiento con propósito

Cada animación respeta prefers-reduced-motion y se limita a transform y opacity.

06

Rendimiento como UX

Fuentes con subsetting, imágenes optimizadas, favicon de 3 KB y code splitting por ruta.

07

SEO técnico por código

sitemap, robots, JSON-LD, imágenes OG dinámicas y feed RSS, todo generado por el propio Next.

08

Accesibilidad

Foco visible, HTML semántico, contraste cuidado y navegación por teclado en el deck.

Menos es más. Cada línea de código y cada píxel deben tener un propósito.