martina024 / industryBuying

IndustryBuying is an e-commerce website made using MongoDb Chakra UI with all CRUD operations. E-commerce service in New Delhi for Purchase of products by organizations for their own use or re-sell.

Home Page:https://aesthetic-kheer-0649e3.netlify.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

IndustryBuying Clone

IndustryBuying is an e-commerce website made using MongoDb Chakra UI with all CRUD operations.

E-commerce service in New Delhi for Purchase of products by organizations for their own use or re-sell.

Fully responsive HomePage

Netlify Link

-:https://aesthetic-kheer-0649e3.netlify.app//

Working Feautres-:

  • Fully responsive HomePage for all three different screen sizes.
  • All Products Page, Where data is fetched, sorted, filtered and searched using Cloud based database using MongoAtlas.
  • Single Product Page for each product using dynamic id.
  • User and Admin Sign up and Login in page with form validation.
  • Cart Page followed by Checkout Page for payment with form valdation through out all pages.
  • Admin Dashboard to View, Add, Delete and update all products present in database using Backend apis
  • All the apis are created by using Node JS, Express and MongoDB.

Tech Stack-:

  • React
  • Redux
  • Chakra UI
  • External Css
  • MongoDB
  • MongoDB Atlas for Database
  • Node JS
  • Express

Team Members-:

  • Martina Varghese
  • Preeti Raj
  • Suvam Panda
  • Tarun Sharma
  • Randeep Singh

HOMEPAGE-:

Here is the homepage which is entirely responsive and is made by using Chakra UI the products over here are listed through the api which is made by using node JS, express, mongoDB. The data is fetched from the cloud database by mongoAtlas. Each product open up to a single product page also using an api. homepage

All Products Page-:

This page shows user all the products which are available in the database and user can sort them according to their price from low to high or vice versa. User can search for a specific item by using the search bar, the search funtionality is achieved using backend api. User can choose the product for a specific brand by clicking on the brand listed on the sidebar also. User can click on any product and he/she will be redirected on single product page.

Allproduct

Single Product Page-:

This is single product page where user can see more details about the product and compare the product according to their needs. All the data of single product is fetched using api from a cloud based database.

singleproduct

Login Page-:

Here user can login to proceed before purchasing the product, so that in future they can track their order details and track order too. If user is not registered already he/she will be redirected to signUp page to signup first. login

SignUp Page-:

Here user can signup if he/she is not already registered with us already, so that in future they can just login and proceed with their order of purchasing. Singup

Cart Page-:

This is our cart page where user can increase or decrease the quantity of the product according to their needs and can proceed further to checkout page before payment.

cart

Address Page-:

Before Checking out user have to fill in the details about his address where he/she wants the product to get delivered. Here we have primarily focused upon the form validation part, if any field is kept empty the user will get to about the mandatory fields.

address

Checkout Page-:

Once the user have filled all the details of his/her address they will be redirected to the checkout page so they can verify once more before placing the order so they don't make any mistakes.

checkout

Payment Page-:

After checkout Page User will be redirected to the payment page where they have to put 16 digits of pin, 3 digits of cvv and expiry date too otherwise order won't be placed. payment

Order Confirmation-:

Once all the details are filled user will get the confirmation of placed order.

checkout3

Admin Page-:

Just like user admin will also register and login first to go to the dashboard, but they have to give GST number also, so others can't access the admin dashboard. Here in admin dashboard we can view all the data present in the database, we can add more data to the database, we can update the price to any specifc product and we can also delete any specific product if we want.

admindash

About

IndustryBuying is an e-commerce website made using MongoDb Chakra UI with all CRUD operations. E-commerce service in New Delhi for Purchase of products by organizations for their own use or re-sell.

https://aesthetic-kheer-0649e3.netlify.app/


Languages

Language:JavaScript 98.3%Language:CSS 1.0%Language:HTML 0.7%