/slide-ease

An image slider project in React that uses the powerful React Slick carousel .

Primary LanguageJavaScript

SlideEase

The SlideEase project aims to create a responsive image slider using React. The project involves importing data from data.js, setting up state values, and creating a container to hold the slides. Prev and Next buttons are added to navigate through the slides. The main logic involves using the transform property to move the slides back and forth. The project also includes implementing an auto slide feature using the setInterval function, but it was later refactored to leverage the power of React Slick.

Tech Stack

  • JavaScript: The foundational programming language for creating responsive and interactive features.
  • React: The powerful JavaScript library used to build the project:
    • useState The React hook used to manage state.
    • useEffect: The React hook used for handling side effects and lifecycle events.
  • React Icons: The popular library that provides a vast collection of icons for enhancing the user interface and user experience in the project.
  • React Slick: A versatile carousel component for creating responsive image carousels and sliders. React Slick Docs

Explore The Website

SlideEase on Netlify

Preview

SlideEase React App