/Project_ShopQ_Mart

Hello Viewers ! Wecome to the clone ShopClues renamed as ShopQ_Mart basically it is an Indian online marketplace, also an India's first e-commerce market that connects sellers and buyers online and offers a trusted and safe online environment for shopping.

Primary LanguageJavaScript

ShopQ Mart

What you Think is What you Get’ isn’t just a saying at ShopQ Mart. With over 2.8 crore products you can get just about everything that you can imagine at ShopQ Mart. From usual products in Electronics Fashion Home & Kitchen to unusual products like cow dung cakes Knife Sharpeners etc. ShopQ Mart tops in everything. So you see what we mean when we say Aflatooni Products!

🛠 Built with

Technologies used in the project:

Javascript

React

React-Router

Redux

Chakra-UI

Node-JS

Express-JS

MongoDB

JWT

💻 Screenshots

Home Page: Home Page

Login Page: Login Page

Product Page: Product Page

Single Product Page: Single Product Page

Cart Page: Cart Page

Admin Page: Admin Page

✨ Features

  • Live previews
  • Fullscreen mode
  • Cross platform

🚀 Demo

Front-end deployed URL:

https://shopqmart.vercel.app/
https://singular-sundae-186837.netlify.app/

Back-end deployed URL:

https://splendid-bear-cap.cyclic.app/

📁 Folder structure

Frontend - Holds the client application

  • public - This holds all of our static files

  • src

    • assets - This folder holds assets such as images, docs, and fonts

    • components - This folder holds all of the different components that will make up our pages

    • pages - These represent a unique page on the website i.e. Home or About.

    • redux - It consists of store, reducer, action and actiontypes and is responsible for global state management of our app.

    • App.js - This is what renders all of our browser routes and different pages

    • index.js - This is what renders the react app by rendering App.js.

  • package.json - Defines npm behaviors and packages for the client

Backend - Holds the server application

  • config - This holds our configuration files, like mongoDB uri

  • middlewares - This holds all our middlewares used in our application

  • models - This holds all of our data models or business logic

  • routes/controllers - This holds all of our HTTP to URL path associations for each unique url

  • index.js - An entry file for our Node JS application

package.json - Defines npm behaviors like the scripts defined in the next section of the README

.gitignore - Tells git which files to ignore

README - This file!

Installation

Clone the project

git clone https://github.com/SCjadhav21/Project_ShopQ_Mart.git

Client-side usage

Go to the project directory

$ cd frontend          // go to client folder
$ yarn # or npm i    // npm install packages
$ npm run start        // run it locally

// deployment for client app
$ npm run build // this will compile the react code using webpack and generate a folder called docs in the root level

Server-side usage

Environment Variables:-

To run this project, you will need to add the following environment variables to your .env file

port                    // the port on which the server will run
mongoDbUrl              // your mongoDB URI to connect to the mongoDB atlas
key                     // key which will be JWT secret key

Start

$ cd backend            // go to server folder
$ npm i                 // npm install packages
$ npm run server        // run it locally

✍ Authors

This project was built during our construct week at Masai School. It was built by a team of 5 developers and executed in 6 days.