Dynamic Javascript e-commerce website

Javascript

Kanap Javascript project

Context

Kanap has developed a website, with the HTML, CSS and back-end ready. They need to show dynamically all the products available in the homepage. Once the user has chosen a sofa, the product page should contain one product with all the informations needed : name, price, colors, image, etc.

Instructions

• Create the main products page with Javascript. Those products will be shown on the homepage with some informations : images, names, descriptions.
• Create the single page product, once the user chose a product. The page should contain the following infos : image, name, price, description, color options, quantity options.
• Create the cart page with the choices of the user : images of each item, names, total prices, total quantities, colors.
• Create the confirmation page.

Technical challenges

• Retrieve the elements to display dynamically.
• Change the API URL depending on the chosen item.
• Store the chosen items in the localStorage.
• List the chosen items and calculate the total amount.
• Retrieve the client informations from the form, with his/her order.

How to operate this project ?

Back end Prerequisites

You will need to have Node and npm installed locally on your machine.

Back end Installation

Clone this repo. From the "back" folder of the project, run npm install. You can then run the server with node server. The server should run on localhost with default port 3000. If the server runs on another port for any reason, this is printed to the console when the server starts, e.g. Listening on port 3001.

First Javascript project !

This is my first Javascript project ever. That is why you will see a lot of comments in my codes. They help me to better understand my codes and it could be helpful later when I will come back to this.