How to create carousel slider in Tailwind css and React js ?

Показать описание

🌟 Exclusive Hosting Deal from Hostinger 🌟

Hostinger offers:
- Easy-to-use control panel
- 24/7 customer support
- 30-day money-back guarantee
- And more!

Don't miss out on this amazing offer. Click the link above to get started today! 🚀

---

You can get source code from this Github Repository:

=====================
Chapters:
=====================
02:30 - Styling the Carousel and adding images
04:45 - Adding navigation icons with react-icons Library
07:00 - Implementing previous and next slide functions
09:25 - Making the Carousel navigable based on current slide state
11:16 - Adding clickable navigation circles for slide selection
13:05 - Making navigation circles reactive
14:10 - Finalizing the Carousel slider functionality
14:37 - Conclusion and wrapping up the tutorial

#TailwindCSS #ReactJS #CarouselSlider

=====================
Related Videos:
=====================

=====================

=============

If you want more content like this then please subscribe to my channel and click on the bell icon to get all of the notifications.

Рекомендации по теме

Комментарии

Thank you very much, I liked and subscribed

GreenPear-mzdl

Thank you 👍🏻
This video was really helpful ❤

shubhamokay

Can we add a video that we can play on a carousel?

ssberonsage

Thanks for the tutorial - I was looking for a Tailwind + React carousel tutorial that included the side-by-side animation, which I like more than just simply fading in and out the next image.

Question:
9:51 Is it better to put the translate-x-[current * 100%] in styles= instead of className= because TailWindCSS compiles the utility class names only on save, and can't dynamically recompile the utility classes while the page is live?

shafwong