More Premium Hugo Themes Premium React Themes

MERN Ecommerce

Ecommerce website has full CRUD operations of products, categories ...etc , authentication & authorization , img uploading, stripe or cash payment and much more.

MERN Ecommerce

Ecommerce website has full CRUD operations of products, categories ...etc , authentication & authorization , img uploading, stripe or cash payment and much more.

Author Avatar Theme by omar1mayallo
Github Stars Github Stars: 14
Last Commit Last Commit: Jun 11, 2023 -
First Commit Created: Oct 26, 2023 -
MERN Ecommerce screenshot

Overview

The MERN-Ecommerce is a full-stack e-commerce website that allows users to perform CRUD operations on products, categories, orders, and users. It also includes authentication and authorization features, image uploading, payment options with Stripe, and more. The technology stack used includes React, Redux Toolkit, Reactstrap, Styled Components, Formik, Yup, Node, Express, MongoDB, Mongoose, JsonWebToken, Express Validator, and more.

Features

  • Good folder structure
  • Reusable components
  • State management with Redux Toolkit
  • Form validation with Formik and Yup
  • Admin dashboard to handle various resources such as products, orders, and users
  • Server validation with express-validator
  • Image uploading with Multer and Sharp
  • Payment options with Stripe or cash on delivery
  • JWT authentication and authorization

Installation

To install and run this project, follow these steps:

  1. Clone the repository: git clone [repository_url]

  2. Navigate to the project directory: cd MERN-Ecommerce

  3. Install the dependencies: npm install

  4. Create a .env file in the root directory and add the following environment variables:

    • PORT: Specify the desired port number
    • NODE_ENV: Set to development or production depending on the environment
    • BASE_URL: Specify the base URL for the API
    • API_URL: Specify the URL for the API
    • FILES_UPLOADS_PATH: Specify the path for uploaded files
    • CLIENT_URL: Specify the URL for the client
    • MONGO_URI: Specify the MongoDB URI
    • DB_NAME: Specify the name of the MongoDB database
    • JWT_SECRET: Specify the secret key for JWT authentication
    • JWT_EXPIRE_IN: Specify the expiration time for JWT tokens
    • JWT_COOKIE_EXPIRE_IN: Specify the expiration time for JWT cookies
    • STRIPE_SECRET_KEY: Specify the secret key for Stripe payments
    • STRIPE_WEBHOOK_SECRET: Specify the webhook secret for Stripe
  5. Run the project: npm start

Summary

The MERN-Ecommerce is a comprehensive e-commerce website that offers a range of features such as CRUD operations, authentication and authorization, image uploading, and payment options. It utilizes popular libraries and frameworks such as React, Redux Toolkit, Node, Express, and MongoDB. With its well-organized folder structure and reusable components, it provides a convenient solution for building e-commerce applications.