As a customer, I want to see the verification page so that I can confirm my address and payment method before paying for items.
Sucess Criteria
Clone this react app repo https://github.com/Dufuna-CodeCamp/react-app
- Ensure your work is in the same project as the cart page. This page is a continuation of the project. This project should be saved in a folder named REACT. This folder should be in the folder you created for yourself inside your submissions folder.
- Ensure that when the user clicks on the checkout navigation button on the cart page, the user is redirected to the verification page
- Ensure that Verification in the breadcrumb trail is highlighted
- Ensure the user can input the following:
- Phone Number
- Card Number
- Card Name
- Expiry Date
- Ensure the user can select a payment method
- Ensure all the fields are entered before the user can click the Pay button
- Ensure the developed UI looks exactly like the shared mockup and 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%3A246
b. It should look like this when viewed on mobile phones.
https://www.figma.com/file/qDRZt0susSQ5k4wEgB09hU/FoodBag-beginner?node-id=114%3A159
- Ensure your PR is created with the task title as seen on the mobile App
- Add screenshots of the verification 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
- On your terminal, ensure you are in the react-app directory when you run npm test command.
Please note that your PR will not be merged if the instructions are not followed
As a customer, I want to see the verification page so that I can confirm my address and payment method before paying for items.
Sucess Criteria
Clone this react app repo https://github.com/Dufuna-CodeCamp/react-app
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%3A246
b. It should look like this when viewed on mobile phones.
https://www.figma.com/file/qDRZt0susSQ5k4wEgB09hU/FoodBag-beginner?node-id=114%3A159
Please note that your PR will not be merged if the instructions are not followed