Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 1 year ago

Product List with cart - React and Tailwind

react, tailwind-css
Andi Gashi•660
@Andigashi1
A solution to the Product list with cart challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


What are you most proud of, and what would you do differently next time?

The layout of the dessert cards based on the width of the device. I would use the useContext() hook instead of prop-drilling to keep the code tidier, but since the project isn't big, I didn't because I'm not very familiar with the said hook

What challenges did you encounter, and how did you overcome them?

When the confirmation modal is open, I can still scroll in the background, which I had no clue how to fix. This problem hasn't been fixed yet. I had a problem with the images not displaying since I had to pull the address from data.json. The fix was very easy; I just put the images folder in the public folder instead of src

What specific areas of your project would you like help with?

I would like to know how to make the code DRY-er and what else I could improve except the prop-drilling (since I'm aware of that). Should I have used less components?

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Andi Gashi's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License