https://github.com/mirsazzathossain/online-marketplace

A simple e-commerce marketplace with a shopping cart built using vanilla javascript. 🛒🛍
https://github.com/mirsazzathossain/online-marketplace

css html javascript

Last synced: 7 months ago
JSON representation

A simple e-commerce marketplace with a shopping cart built using vanilla javascript. 🛒🛍

• Host: GitHub
• URL: https://github.com/mirsazzathossain/online-marketplace
• Owner: mirsazzathossain
• Created: 2019-10-18T15:20:45.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2019-12-01T17:56:37.000Z (almost 6 years ago)
• Last Synced: 2025-02-14T01:37:52.404Z (9 months ago)
• Topics: css, html, javascript
• Language: JavaScript
• Homepage:
• Size: 115 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Online_Marketplace

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/0.PNG)

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/00.PNG)

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/0000.PNG)

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/000.PNG)

## First view!! As there is no product added yet.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/1.PNG)

## Click on "Add New Product" this form will pop up.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/2.PNG)

## While typing it will check is the data is valid or not!! If not valid this form will not be get submitted anyhow.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/3.PNG)

## After passing all validation steps we will finaly be able to add our new product by clicking submit button.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/5.PNG)

## If  anytime we change our mind and not want to add product we can click cancle button to go back to product page. In both case submit or cancle you will get a small notification in bottom left of your screen.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/4.PNG)

## Now we have added a new product by clicking submit. Thats how its look like.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/6.PNG)

## Let's add few more product!! 

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/7.PNG)

## Every single page is responsive!! Mediam size device:

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/8.PNG)

## Every single page is responsive!! Small device:

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/9.PNG)

## By clicking the name of any product we can view it as a single product!!

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/10.PNG)

## If i click on description it will show the product description!!

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/11.PNG)

## Responsive:

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/13.PNG)

## Cart view while no product in cart.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/14.PNG)

## We can add product to cart from single product view by simply clicking add to cart. A confirmetion notification will appare in in bottom left of your screen.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/15.PNG)

## We also can add product to cart from home page also.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/17.PNG)

## Cart view after adding two product.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/18.PNG)

## We can add or reduce number of product to order by pressing '-' or '+' button. It will automatically adjust total price. We can add to cart until the product stock ends.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/19.PNG)

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/20.PNG)

## To remove an item from cart please make the quantity zero by preesing '-' button. When the value eill be zero the item will be removed from cart.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/21.PNG)

## By presing continue shopping we can look for some more product. Our navbar is also responsive.

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/22.PNG)

## Can't add more product to the cart if it is out of stock

![demo](https://github.com/mirsazzathossain/Online_Marketplace/blob/master/demo/45545645.PNG)