This project is a component feature of a possibly larger-scale website. It is implemented with pure HTML, CSS, and JavaScript. This particular system's logic is housed purely on the client-side, with the main logic done in pure JavaScript.

This shopping cart system uses one of JavaScript's built in data structures, the Map data structure. Using this structure, which can hold various keys and associated values for each key, we can associate each product's html code as an object (key) and the quantity that we add to the cart as the value. Using this data structure, the code is much cleaner and more precise and is easily maintained and debugged due to how the system is modelled very closely to how we perceive a shopping cart in the real world.

In addition to the shopping cart system, this implementation also includes a basic randomization and recommendation system using the built-in JavaScript Set data structure and a random number generator. This means that every time the page is loaded, the site will display different products in randomized order. When the Switch button is pressed, it will find the other products that are not displayed and display those instead. To further improve the recommendation system, a backend can be attached using PHP and SQL which can pull the products out of a database.