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

E-commerce-app made using react

solitary_coderβ€’ 1,000

@kabir-afk

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


Not the best code I've written , both react and scss, you can checkout my github readme for more explanation . . . anyways there are some issues I would gladly feel happy to be helped with.. like resetting the state of my cart checkout when delete btn is clicked , or my css as well . . . anyways cheers πŸ₯‚πŸ₯‚

Community feedback

Yupβ€’ 710

@Yup03

Posted

Great Challenge @kabir-afk

At first sight, contribution i can make is that when one click on the button after invoking addToCart , It will be a good behavior to set back numberOfItems to 0 like the following:

<button
    className="addToCart"
    onClick={() => {
           props.addToCart({ numberOfItems })
            setNumberOfItems(0)
            }}
 >
0

solitary_coderβ€’ 1,000

@kabir-afk

Posted

@Yup03 I forgot what I wrote πŸ˜…πŸ˜… . . . but I'll definately look into itπŸ‘

0

Account Deleted

To be able to delete the products from the cart for each button of the product, you can add an attribute that will have a unique number as its value. You will select the button after the index and then you will implement the product deletion function.

0

solitary_coderβ€’ 1,000

@kabir-afk

Posted

@Creciun-Dorin can you pls elebaorate it with context to the code i've written or in a way that is relatable to the app...thank you

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