E-commerce Site

HTML5

SASS

JavaScript

Vinyl Sale!

An E-commerce site for the sale of vinyl records. A cart functionality was implemented to store users products. An image carousel is used for each of the products.

The purchase of products has not yet been implemented. This is something I look forward to utilising in the near future.

Methods Used

Functions

Increased readability and modularity throughout the program. Also decreased the repetitiveness of the code where possible.

Class'

Used a Class to create new cart item objects. These objects were then iterated over to produce the cart items.

Global Array

Utilised for storing data for each individual product. Then accessed this data for implementation of each product and use of information.

Carousel's

Carousels were used for each product to showcase the product images.

Modals

Allowed different screens to be accessed, without having to refresh the page.

Comments

Increased readability and broke the code up into sections

Lessons Learned

Readability

This project increased my awareness of fundamental approaches to be taken when creating a program. Breaking the code down into smaller functions keeps the program structured, understandable, and reusable. Using clear variable names along with utilising comments enhances readability.

Refactoring

Refactoring the project after a couple of months away was an invaluable experience. It changed the way I thought about the implementation and gave me different perspectives on the software. Refactoring improves the design of the software, makes the software easier to understand, helps to find bugs and also helps in executing the program faster.

Continuous Testing

Constant testing of the application was necessary to not miss any bugs or unwanted behaviours in the application.