varunKT001 / tomper-wear-ecommerce-admin

Admin panel for e-commerce web-application for selling clothing essentials ๐Ÿ˜€
https://tomper-wear-admin.netlify.app
24 stars 13 forks source link
bcryptjs chakra-ui chakra-ui-react cloudinary cloudinary-sdk expressjs firebase firebase-auth formspree jwt-authentication mongodb mongoose nodejs react-icons reactjs stripe stripe-payments styled-components

E-commerce web-application for selling clothing essentials

tomper-wear-admin.netlify.app


This is the Admin dashboard of TomperWear build with MERN stack and deployed with Netlify

๐Ÿš€ Link to Client, Backend

๐Ÿ“ท Link to Screenshots

๐ŸŽฅ Link to Video demo

๐Ÿงพ Description

TomperWear is an E-commerce platform for small bussiness owners who want to expand their bussiness by providing an online purchase solution to their customers.

โœจ Features

Client

Users shopping through this platform enjoys following features:

Admin

The admin panel of TomperWear contains three classes of admins:

1. Super privileged admin Super privileged admins are the topmost in the hierarchy. They have the following permissions:

This is privilege is ideal for the owner(s) of the bussiness.

2. Moderate privileged admin Moderate privileged admins comes below Super privileged admins. They have the following permissions:

This is privilege is ideal for the manager(s).

3. Low privileged admin Low privileged admins are the lowermost in the hierarchy and have the least amount of privileges. The have the following permission:

This is privilege is ideal for the delivery-agent(s).

Here is a table dipicting the admin privileges for better clarity

Admins Product Orders
view create update delete view create update delete view update delete
Super โœ” โœ” โœ” โœ” โœ” โœ” โœ” โœ” โœ” โœ” โœ”
Moderate - - - - โœ” โœ” โœ” โœ” โœ” โœ” โœ”
Low - - - - - - - - โœ” โœ” -

โš™ Tools and Technologies used

Client

  1. React.js
  2. React-icons
  3. Styled-Components
  4. Firebase
  5. Stripe
  6. Formspree

Admin panel

  1. React.js
  2. Chakra-ui
  3. React-icons

Backend

  1. Node.js
  2. Express.js
  3. MongoDB
  4. JWT
  5. Cloudinary
  6. Bcrypt.js
  7. Stripe

๐Ÿ›  Installation and setup

  1. Clone the repo to your local machine.

  2. Install the required dependency for server using :

    npm install
  3. Create a .env file inside the root folder and provide the following environment variables:

    REACT_APP_BACKEND_HOST=<backend_url>
  4. Start the dev server using :

    npm start

๐ŸŽ Creating production built

  1. Create a production ready react app using the command :

    npm run build

๐Ÿค Test admin user credentials

Username E-mail Password
Test Super test.super@tomperwear.com testsuper1212
Test Moderate test.moderate@tomperwear.com testmoderate1212
Test Low test.low@tomperwear.com testlow1212

NOTE: These are just for testing purpose. Please don't:

  1. Update or delete an existing product.
  2. Delete product reviews.
  3. Create new admin users.
  4. Delete existing admin users.

For testing out things, you can create a new product, try out things and after that delete the product that you created.

๐Ÿ˜Ž Team Members

  1. Varun Kumar Tiwar - 2020IMT-112




(If you liked the project, give it star ๐Ÿ˜ƒ)