Important Note : Every section of this project is explained at the beginning of that section and also includes the Users Stories . This is the front-end deployed website and hence it is an enhanced version of the CYF blocks version. However, the idea, back-end, and corresponding JavaScript CYF blocks are the same. Every requirement related to the user stories is highlighted in bold here.
In this section you can explore the available items in my website. List of the items Names , Prices and Image links are stored in separate arrays . The idea of this section came from the Image carousel project. By clicking on the Next and Previous buttons you can navigate through the items in the corresponding array. The item’s name and price will be shown below the image. By clicking on Add to the shopping cart , they will be listed in the section bellow (Shopping Cart).
Item: Laptop - Price: £900
This section lists every item in your shopping cart . Every time you select an item, a new list item will be created, and the name and price will be shown. The total price will be shown in the end. In the beginning, an initial message says that the shopping basket is empty . By adding the first item, this initial message will be removed and replaced by the shopping basket list. Also, a new button will appear as Continue to checkout for payment. However, by pressing it, a text will appear that says this option will be added in the future (according to the project's guidelines). You can test all these by refreshing the page and adding new items.
The items in your shopping cart:
Your shopping cart is empty!
Total price: £0
In this section you can write your Comments . Every time you enter a comment, it will be shown as a new list item . The name input is optional and if it is empty, it will be replaced by the word “Unknown”. If the comment input is empty, it is not valid and nothing will happen (“if” CYF blocks are used here). To submit the comment, you should click on the Submit button. The total number of the comments will be updated every time a comment is submitted. In the beginning, an initial message says that there is no comment . By submitting the first comment, this initial message will be deleted and replaced by the first comment list.
Comments (0):
No comments yet! Be the first one to leave a comment.
Please leave a comment here:
Enter your name (optional):
Write your comment and click on "Submit" :
You can find the simplified deployed version of this website (similar to CYF blocks) here: https://warm-sunshine-25819e.netlify.app/
Github link - Simple version: https://github.com/FatemRahimi/CYF_Project_Simplified
Github link - Enhanced version: https://github.com/FatemRahimi/CYF_Project_Week3