Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Ecommerce Product Page With React And Tailwind CSS

@AjayPorwal268

Desktop design screenshot for the E-commerce product page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


I would like to hear your opinions, especially about the project's organization and recommendations on best practices in page design. Any feedbacks are welcome.

Community feedback

@alfiemitchell123

Posted

Well executed and looks great, but I did notice an issue with the cart feature. It's hard to explain the issue in writing, so I have attached a screen recording via WeTransfer. I think the problem is with state management, though I am fairly new to this as well, so I wouldn't know exactly how to fix it!

The cart icon in the top-right corner updates when you add an item to it, but it only mimics the number of items added when you click 'Add to cart' and doesn't add any additional items on top of what it already has (if that makes sense?)

Screen Recording

Marked as helpful

0

@AjayPorwal268

Posted

@alfiemitchell123 Thanks a lot for taking time and provide the valuable feedback. Regarding the comment on 'Add to card' functionality as per my view this is how the functionality was design as cart icon shows total no of items that user selected from the product detail page.

0

@alfiemitchell123

Posted

@AjayPorwal268 No problem at all! I understand where you're coming from with that, but when you use an e-commerce site, it should always add the total number of items selected at one time, to the total number in your cart.

I have an example here, on the Urban Outfitters website. If I add 1 item to the cart, and then add 3 items after, the total number should be 4. On your site, the total number in the cart just reflects how many the user has selected at one time.

Screen Recording

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord