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

product List

M-Ahmad-ma 190

@M-Ahmad-ma

Desktop design screenshot for the Product list with cart coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

@zeynabmvs

Posted

Hi there!

Congratulations on completing the challenge! Your work is impressive, and I have a few suggestions that might help you improve it even further:

  • Remove Button Functionality: The X button on the cart item should completely remove the row from the cart. This will enhance the user experience by making it clear what the button does.

  • UI Improvements: While the app’s functionality works well, as frontend developers, our goal is to make the final UI as close as possible to the design. Achieving a pixel-perfect UI without a Figma file can be tough, but you can still refine the sizes (padding, font sizes, etc.) and colors to better match the design.

  • Use of Absolute Imports: For larger and more complex React projects, using relative imports can become cumbersome. Consider using absolute imports to simplify your project structure. Here’s a helpful article: [Absolutely Don’t Use Relative Paths Imports in Your Vite + React Project.] (https://medium.com/@pushplaybang/absolutely-dont-use-relative-paths-imports-in-your-vite-react-project-c8593f93bbea)

Keep up the great work!

Marked as helpful

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