Personal ProjectIn Progress

Este Portafolio

Alcance del proyecto: un portafolio de ingeniería bilingüe construido para crecer como blog técnico y marca personal. Contexto: la mayoría de los portafolios son plantillas. Este es un producto. Estado: en desarrollo activo.

Next.js 15TypeScriptDockerDigitalOcean
View on GitHub
01

El Desafío

La mayoría de los portafolios de desarrolladores son plantillas genéricas o experimentos visuales que sacrifican la legibilidad. Quería algo genuinamente mío: técnicamente riguroso, bilingüe desde el inicio, con un lenguaje de diseño que comunicara la forma en que pienso. Estructurado pero no estéril. La restricción también era práctica: necesitaba ejecutarse en un droplet de DigitalOcean con 512MB de RAM, lo que significa ninguna sobrecarga de runtime pesada.

02

El Enfoque

Next.js 15 App Router con generación estática completa fue la base. Cada página se pre-renderiza en tiempo de compilación, por lo que el servidor solo sirve activos estáticos en tiempo de ejecución. Tailwind CSS v4 con propiedades CSS personalizadas da al sistema de diseño suficiente flexibilidad para la estética de blueprint sin costo de CSS-in-JS en tiempo de ejecución. next-intl maneja el enrutamiento EN/ES con carga de traducciones del lado del servidor. Docker + Nginx están frente a todo, y GitHub Actions maneja compilación, pruebas y despliegue en cada push a main.

03

Lo Que Se Construyó

El sistema de diseño se construye sobre un conjunto de tokens de propiedades CSS personalizadas, nunca valores hexadecimales directos en componentes. La metáfora 'Blueprints Coming to Life' se manifiesta como fondo de cuadrícula de blueprint, superposiciones de anotaciones técnicas, transiciones de texto degradado de cyan a coral y marcas de agua con monogramas fantasma en fondos de sección. Cada página es un orquestador delgado que compone componentes de servidor y cliente. Framer Motion impulsa las revelaciones de scroll con un hook `useInView` personalizado ajustado para manejar casos extremos de scroll hacia arriba y recarga en la parte inferior.

04

El Resultado

El sitio está activo en bccloudsolutions.dev. Los tiempos de compilación son inferiores a 30 segundos. La imagen Docker es lo suficientemente liviana para el droplet de 512MB con margen de swap. El alternador EN/ES funciona correctamente en todas las rutas estáticas. El diseño se mantiene tanto en modo claro como oscuro. Cada sprint de página ha seguido un proceso impulsado por especificaciones. Decisiones bloqueadas antes de la implementación, sin expansión de alcance a mitad del sprint.

05

Lo Que Haría Diferente

Definiría el sistema completo de tokens CSS antes de escribir cualquier componente. Tuve que normalizar retroactivamente algunos usos de color en componentes tempranos cuando la convención de nomenclatura de tokens se solidificó a mitad del sprint. También configuraría la estructura de espacio de nombres i18n desde el primer día; agregar espacios de nombres tarde significó volver a modificar componentes para actualizar las rutas de importación. El pipeline de despliegue es sólido, pero agregaría un entorno de staging antes en el próximo proyecto para detectar errores de tiempo de compilación antes de que lleguen a producción.