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

Crowdfund product page using React.js and SASS

@Mazz100

Desktop design screenshot for the Crowdfunding product page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I achieved the render of DropDownMenu and Dialog using React Portal and referenced states with useContext hook.

I could not implement full interaction of dialog and dropdown I think in future projects I will consider using 3rd-party to assist in creating a proper dialog with correct accessibility.

useContext was really useful for minimizing prop pass drilling but depending on a bigger project scope I could use 3rd-party plugin to store and manage states.

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

The biggest challenge I kept facing was to properly pass the correct array value of cards and when to and not to recreate a new .map copy of it.

I learned how to work with map in states and compare the original cards object with a copy and check for the intended conditionals.

Community feedback

Kenny Ng 400

@kennylun123

Posted

Good work! Keep going :)

1

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