Portafolio interactivo
Los proyectos de esta página, convertidos en paneles que se exploran en el navegador, sin instalar nada.
Web e interfaz · JavaScript · En producción
El problema
Casi nadie clona un repositorio para ver si un trabajo está bien hecho: hace clic en un enlace y decide en quince segundos. Un portafolio que exige instalar Python ya ha perdido a quien lo miraba.
Qué hace
- Reúne el trabajo publicado en una sola aplicación; la mayoría se sirve como paneles interactivos con gráficos reales, no capturas.
- Sistema propio de iconos SVG en línea, que heredan el color de cada tarjeta y se ven igual en cualquier sistema.
- Bilingüe, con cambio de idioma en toda la aplicación.
- Arquitectura de datos estáticos: JSON preagregado servido directamente, sin backend y sin coste.
Lo que se decidió al construirlo
- Las cifras de la portada se cuentan, no se escriben
- La portada anunciaba siete demos en vivo cuando ya eran catorce: cinco proyectos habían pasado de enlazar el repositorio a tener panel propio y nadie actualizó el número. Ahora se cuentan sobre la propia lista, y además está definido qué cuenta como demo: algo que se puede usar, no un enlace a código.
- Datos estáticos: el panel lee ficheros, no una base de datos
- Cada proyecto publica sus resultados ya agregados y el portafolio los sirve tal cual. Sin servidor, sin coste y sin nada que se caiga: un portafolio que depende de una base de datos encendida es un portafolio que un día no abre, y ese día suele ser el de la entrevista.
- Las rutas pesadas se cargan cuando se visitan
- Los paneles con gráficos son la parte cara del paquete y se cargan solo al entrar en ellos. Quien abre la portada no paga el peso de catorce cuadros de mando que quizá no mire, y la primera pantalla —que es la que decide si hay segunda— aparece enseguida.
- El simulador se incrusta en lugar de reescribirse
- El original ya es una web completa sin dependencias, y rehacerlo habría significado mantener dos versiones del mismo cálculo con el riesgo de que dejaran de dar el mismo número. Se incrusta y se mide su altura en vivo, porque si no queda un hueco muerto de mil píxeles debajo.
Hasta dónde llega
- Ningún panel consulta datos en vivo: todo son ficheros que cada proyecto publica al ejecutarse. Lo que se ve es el último resultado generado, no el de este momento.
- No todas las tarjetas tienen ficha técnica completa; algunas son un enlace al repositorio y nada más.
- El recuento de repositorios públicos está escrito a mano y fechado, porque desde el navegador no se puede consultar. Puede haber quedado atrás.
- Los datos que pintan los paneles son sintéticos o públicos, según el proyecto. No hay información de ningún cliente en ninguno de ellos.
Construido con
- React 19
- Vite
- Recharts
- Firebase