Looking to hire developers?
I really enjoyed this challenge as it allowed me to do a lot with vanilla javascript and practise the MVC pattern. I managed the product quantity through a state variable in the model JS file and also each part of the UI managed itself through their own view component JS file. I used a controller JS file to connect the views to the state variable and control and functionality involving multiple views and parsing state back and fourth. This made for a clean solution and by using grid I was able to make an easy responsive design without too many media queries.
@bartlomiejciupa
Posted
Hello Hutch, this solution is amazing. Incredible accuracy and mapping of details.
I liked the order in the CSS files and the overall clarity in the code and folders.
One tiny thing is that there is no box-shadow effect under the Add to Cart button.
Marked as helpful
@Hutchii299
Posted
Hey @bartlomiejciupa, I totally missed that box-shadow so thanks for pointing that out for me. I have updated the solution accordingly :)
@EmmanuelOloke
Posted
Hello Hutch, great work you've done with this challenge. Everything works as it should and it's fully responsive.
One little observation I've made though, in the header cart dropdown, when I click on the delete button to remove items, the item quantity in the "controls" class between the plus and minus icons doesn't change back to 0.
Just thought to bring that to your notice so you can make the necessary changes. Once again, awesome job. Kudos!
Marked as helpful
@Hutchii299
Posted
Thanks for the comment @EmmanuelOloke and also thank you for the tip. I have made a slight change to reset the item quantity count when the product is removed from the cart as you suggested :)
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
