¿Como podría resolver un carousel para usarlo con Next.js?

Hola Iponce1993 si quieres imlementar un slider ,podrias usar la dependencia que se llama ‘react-slick’ que utiliza como base a react.

es importante que sepas que cuando diseñé esa librería, no lo hice con intención de que alguien mas lo use (osea, literal, no pensé en que sea reutilizable) asi que es probable que tengas que refactorizar.

En ese caso contactame y te ayudo. Si puedes leer mi código y entenderlo (que tampoco es dificil), encontrarás muchas respuestas.

hay muchas librerías de vanilla javascript y también basadas en react para animaciones como scrolls, carousels, slides, swipes, etc.

El CSS Framework “bootstrap” tiene la opción de integrar un carousel 100% funcional.

Yo hice mi propio carousel con react. No tiene nada que ver con Next, es ajeno. Necesitas JS a la fuerza, y CSS.

el truco es:

• tu tienes estados: “activo”, “entrando”, “saliendo”, “oculto”. En tu carousel, la imagen que ves está activa, y todas las demas están ocultas.
• cuando haces click para que se muevan, estás ejecutando una animación. la imagen que se va del carousel obtiene el estado “saliendo”, y la que entra pues es obvio.
• Con javascript le añades y quitas los estados a cada elemento html mediante clases. puedes añadir o quitar clases y id’s con javascript.
• Con CSS creas las animaciones y la visualización. Haces que el entrante y saliente se muevan.

librería de mi autoría -> https://github.com/MarinaVVsoftware/WebMarina/tree/master/src/components/commons/carousel

No dudes ni un minuto en contactarme si tienes dudas de mi código jajaja, estaré encantado de ayudarte.