The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Rediseñando la experiencia de navegación en mi Full-Stack App: De páginas sueltas a un sistema cohesivo.
¡Hola a todos! Nueva actualización del proyecto de biblioteca digital en el que vengo trabajando.
En la demo de hoy, muestro un cambio clave en la arquitectura y UX: la implementación de una Sidebar Navigation (barra lateral) centralizada.
¿Por qué este cambio es importante?
UX Optimizada: El usuario ahora tiene acceso instantáneo a todas las secciones (Biblioteca, Registro de Libros, Detalles, etc.), mejorando la fluidez y el descubrimiento de contenido.
Contexto: El Sidebar destaca la sección activa, permitiendo al usuario saber siempre "dónde está parado" dentro de la aplicación.
Detalles Técnicos:
Frontend (React 19 & React Router 7): Implementé un componente Layout y Nested Routes (rutas anidadas) para persistir el Sidebar mientras el contenido de la página se actualiza dinámicamente sin recargas.
Backend (Node.js/Express): La API sigue respondiendo eficientemente a las consultas que ahora son solicitadas dinámicamente según la ruta activa.
Me encanta cómo este cambio le da un toque mucho más profesional e intuitivo a la plataforma. ¡Se siente como una verdadera herramienta de trabajo!
¿Qué les parece este flujo de navegación comparado con el anterior? ¡Espero sus comentarios! 👇
#reactjs #reactrouter #fullstack #webdevelopment #uxui #portafolio #javascript #programming
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Trending
retrofuturism
Share your favorite designs from the past exploring the distant future. Or your own take on the aesthetic 🚀
halftone
Dots. Texture. Grain. Let's see your designs using the halftone technique.
Midjourney
Creatives are showing off what they're making with Midjourney.
colorgrade
Video editors sound off: How do you enhance the mood of your video in color grading?
Related posts
One of the more fun websites we’ve built at Formeta.studio
Dulce Oro started with a brand we built from the ground up, and the website had to carry that same thinking into every interaction.
We built the site architecture around the brand story, wrote the entire website, created a scalable CMS for their US store locations, built a custom age gate, integrated accessibility support, and connected the shop directly to purchasing.
There’s a lot happening underneath what looks like a fairly simple spirits website.
And honestly, that’s our favourite kind of work.
The finished site feels calm and considered, but there’s a proper system holding it all together.
Here’s a little walkthrough of what we built ↓
Fantastic!!
Studio Huncho for Brand Factory by Dcluttr 💚
Thirty seconds of one of the loudest work we've made this year. Logo, brand system, website, the whole thing, built for a 90-day accelerator helping consumer brands win quick commerce.
Sound on 💚
This is sick 🔥
Internal web platform designed to manage workforce processes and structured operational workflows. Built a role-based system (Admin/User) with secure authentication and mobile-friendly UI. Responsible for frontend architecture (React/Next.js), backend API design (Node.js), database modeling, and core business logic. Owned the product end-to-end within a small team (up to 5 engineers), coordinating technical decisions, reviewing implementations, improving system reliability, and ensuring stable, predictable production releases
