Project information

  • Category: Front-end
  • Project date: Second Semester
  • Languages: html, JavaScript, jQuery

Developing an online platform for cosmetics featuring a shopping cart functionality.

This project was the culmination of our JavaScript course, serving as the final project. We were tasked with designing a cosmetic website that interacted with a simulated API to dynamically populate the page with product images, descriptions, and prices. The video demonstration showcases the website's functionality, including the ability to add items to a shopping cart, with options to convert prices to either Canadian or US dollars. Users could easily manage their cart by removing individual items or clearing the entire selection.

Furthermore, as users progressed through the checkout process, the website seamlessly integrated an address API to streamline the entry of shipping information. To ensure data accuracy, we implemented regular expressions to validate user input, such as email addresses, phone numbers, and postal codes. Any inaccuracies in the provided information prompted red error messages to guide users towards correcting their entries.

Upon completion of the checkout process, the website securely transmitted the data to an external server. If the information passed validation checks successfully, users received a reassuring confirmation message, indicating that their order had been processed.

Overall, this project not only demonstrated our proficiency in JavaScript but also highlighted our ability to integrate various APIs and implement user-friendly validation mechanisms to enhance the website's functionality and user experience.