This project is a response to the E-commerce product page challenge provided by Frontend Mentor. The goal is to recreate the provided design as accurately as possible, implementing various interactive features and ensuring a responsive layout.
- React (with Vite for project setup)
- HTML
- CSS
- JavaScript
- VS Code
Check out LinkedIn Post and check out the Video Demo
- 🌟 Open a lightbox gallery by clicking on the large product image
- 🔄 Switch the large product image by clicking on the small thumbnail images
- 🛍️ Add items to the cart
- 🛒 View the cart and remove items from it
- 📱 View the optimal layout for the site depending on their device's screen size
- 🖱️ See hover states for all interactive elements on the page
- 🔄 Implementing the useState Hook
- ⚡ Implementing short-circuit logic in React and using the ternary operator
- 🚀 Implementing state lift to manage shared state between components
- 💻 Using Components and CSS modules for a modular and maintainable codebase
- 🎨 Utilizing advanced animation effects to enhance the user experience
