Skip to content

Create the Cart Page with REACT #100

Description

@Dufuna-Fem

As a customer, I want to see a cart page so that I can edit my order and checkout.

Success Criteria

**Clone this react app repo https://github.com/Dufuna-CodeCamp/react-app . ** Do well to include the "dot(.) sign" at the end of the URL.

  1. Ensure your work is saved in a folder named REACT. This folder should be in the folder you created for yourself inside your submissions folder.
  2. Ensure you create reusable components for the page.
  3. Ensure the quantity counter for products in the cart is not less than zero.
    NOTE: If the user makes all the quantity of all the products in the cart zero, the delivery fee should be zero as well.
  4. Ensure that the price of the product in the cart changes with the increase or decrease of the quantity of product provided
  5. Ensure the total price in the cart increases or decreases as the quantity of the product in the cart is changed
  6. Ensure the page is mobile responsive i.e
    a. It should look like this when viewed on a large screen or desktop. https://www.figma.com/file/qDRZt0susSQ5k4wEgB09hU/FoodBag-beginner?node-id=50%3A4
    b. It should look like this when viewed on mobile phones. https://www.figma.com/file/qDRZt0susSQ5k4wEgB09hU/FoodBag-beginner?node-id=114%3A12
  7. Add screenshots of the cart page to your PR. You can add them by dragging and dropping them to the PR description box or include a link to the screenshot when creating your PR
  8. Ensure your PR is created with the task title as seen on the mobile App
  9. On your terminal, ensure you are in the react-app directory when you run npm test command.
  10. Please note that your PR will not be merged if the instructions are not followed.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions