Mi Currículum
enes
Toggle to light theme
Personal Portfolio

Personal Portfolio

Este portfolio reúne mis proyectos y perfil en una aplicación bilingüe hecha con Next.js. Incluye internacionalización, dark mode, UI animada, navegación dinámica, páginas de proyectos, secciones responsive y contenido estructurado para presentar mi trabajo en frontend, backend, desktop y proyectos full-stack.

Tecnologías implementadas

  • NEXTJS
  • REACT
  • JAVASCRIPT

Proceso y desafíos

  1. Como primer paso me puse hacer un header que se mantenga en el tope todo el tiempo y, a su vez, muestre las distintas secciones dinámicamente (usando el interception observer)

  2. Me quedó pendiente implementar un par de cosas en otros proyectos, y esta era la oportunidad perfecta: tema oscuro y soporte de lenguajes. Para el primero, utilicé una metodología conocida como es el React Context, donde cambiaría las variables principales según preferencias (color de fondo y de texto). Nunca había aplicado (ni conocía) i18n, hice una pequeña investigación y encontré una librería que lo manejaba de forma efectiva y dando la posibilidad de guardar la información en archivos json.

  3. Sections (donde va cada cosa). Comencé a diseñar las distintas secciones, me centré principalmente en decidir el contenido para estilarlo en un futuro. Aquí es donde más flaqueo, no creo haber proveído la mejor experiencia de usuario para una navegación intuitiva.

  4. Había pensando hacer una página por cada proyecto donde detallara el proceso, las tecnologías y conclusiones. Nuevamente me centré en la funcionalidad para estilarlo posteriormente.

  5. En este paso estilé las cosas que me quedaron pendientes. En el trayecto, aprendí bastante sobre animaciones y transiciones,

  6. Y por último pero no menos importante, me senté a redactar los proyectos y mis principales habilidades para posteriormente traducirlas y darle formato.

  7. El deploy terminante fue el del portafolio, como los anteriores front-end, resultó sumamente sencillo gracias a las capacidades de Vercel para ello.

Decisiones Técnicas

  • Navegación basada en IntersectionObserver

    Construí un header que se mantiene fijo y resalta dinámicamente la sección activa usando la API de Intersection Observer.

  • React Context para theming, next-translate para i18n

    Implementé tema claro/oscuro con React Context y agregué soporte bilingüe mediante una librería de i18n basada en JSON, ambas nuevas para mí en ese momento.

Desafíos

  • Iteración de UX en las secciones

    Fue donde más flaqueé, diseñando una experiencia de navegación intuitiva entre secciones; no considero el resultado original completamente logrado.

Estado Actual

Activo

Conclusión y mejoras a futuro

Creo que lo que el estilo de algunas secciones son mejorables y se puede crear una mejor dinámica.