arquitectura
Cómo está construido este sitio
Este portafolio también es un producto: tiene un dashboard privado, contenido gestionable, analítica propia y automatizaciones para reducir trabajo repetitivo. Aquí explico las decisiones que lo hacen funcionar.
visitante → Next.js App Router
→ Supabase: Postgres · Auth · Storage
→ Server Actions · dashboard · analítica propia
01 / stack
Las piezas reales
Las versiones se leen directamente del package.json de este proyecto, por lo que esta lista refleja la instalación actual en cada build.
02 / arquitectura de datos
Contenido público, administración privada
Supabase concentra PostgreSQL, autenticación y Storage. Las tablas de contenido público tienen políticas RLS de lectura; los datos que no deben exponerse, como los contactos y los eventos de analítica, solo se consultan desde el servidor administrativo.
Las escrituras del dashboard pasan por Server Actions que verifican la sesión y usan el cliente de administración en el servidor. Así el navegador nunca recibe credenciales privilegiadas y la interfaz pública solo obtiene los datos que sus políticas permiten leer.
03 / automatizaciones
Menos copiar y pegar
Al editar un proyecto, el dashboard puede consultar la metadata de su repositorio de GitHub y de su sitio en vivo. El título, la descripción, las tecnologías detectadas y la imagen Open Graph sirven como punto de partida para el contenido del proyecto, sin sustituir la revisión de Diego. Es una integración concreta de APIs para reducir trabajo manual.
04 / decisiones de diseño
Una interfaz con intención
La paleta ink/paper/signal y los bordes finos hacen que el contenido sea el protagonista. Los bloques bracket-frame aparecen donde ayudan a agrupar una idea, no como decoración repetida ni como una colección de tarjetas genéricas.
La tipografía tiene funciones distintas: Space Grotesk construye la jerarquía, IBM Plex Mono identifica datos, rutas y estados, y Work Sans mantiene cómoda la lectura de párrafos largos. Esa separación hace que un proyecto, un estado del dashboard y una explicación se perciban como cosas diferentes.
Se evitó una plantilla de portafolio intercambiable. La interfaz comparte el lenguaje de una herramienta de trabajo porque el sitio demuestra el sistema que Diego también construiría para otra persona: contenido editable, estados claros y decisiones visibles.
05 / analítica propia
Medir sin entregar el dato principal
El dashboard registra page views, sesiones, proyectos vistos, descargas de CV y contactos en Supabase, y los agrupa por página, procedencia, país y dispositivo. El core del dato vive en el propio proyecto, sin depender de Google Analytics; Vercel Web Analytics se usa como complemento para Web Vitals y señales de rendimiento.