This is a light frontend e-commerce page powered by React JS, utilizing Framer Motion for hero animations, Swiper for product and testimonial components, and Firebase for deployment.
- Animated Hero Banner
- Accessible Color Palette
- Tablet Responsive Layout
- Two Swiper Slider Variations
- Before + After Image Compare
- Smooth Loading Category Filters
The sliding components for products and testimonials are imported from SwiperJS with pagination and navigation.
The smooth filter utilized for product list categories is imported from AutoAnimate and the transitions for hero animations are imported from Framer Motion.
The before and after image feature are utilized by installing the npm package React Compare Image.
This project is deployed using Firebase hosting.
This project was built based on a tutorial by ZAINKEEPSCODE. It can be found here if you’d like to give it a try.