Code Monkey home page Code Monkey logo

easycart's Introduction

EasyCart E-commerce Project

Welcome to the easy-cart e-commerce project! This project is a fully functional e-commerce web application developed using the MERN (MongoDB, Express.js, React.js, Node.js) stack. The application is designed to provide a seamless shopping experience for users and a robust management interface for administrators.

Table of Contents

Introduction

easy-cart is a responsive and user-friendly e-commerce web application. It allows users to browse products, add them to a cart or wishlist, and make secure payments using the integrated Stripe payment gateway. The application also features an admin panel for managing products, users, and orders.

Features

User Features

Login Page

Users can log in to the application using their email and password. We implemented secure authentication mechanisms to ensure user data protection. Login Page

Google Sign-in Page

Users have the option to log in using their Google account for a faster and more convenient authentication process. Google Sign-in Page

Register Page

New users can register for an account by providing their details, including name, email, and password. Register Page

Home Page (Users)

The home page displays a welcoming interface with featured products, categories, and promotions. Users can easily navigate through various sections. Home Page

All Products Page

This page lists all available products. Users can sort and filter products based on different criteria such as price, popularity, and category. All Products Page

Category Page

Users can browse products by category. Each category page displays products that belong to a specific category. Category Page

Product Page

Detailed information about a product is provided on this page, including images, descriptions, features, price, and user reviews. Product Page Product Page

Wishlist Page

Users can add products to their wishlist for future reference. The wishlist page shows all the products that a user has added to their wishlist. Wishlist Page

Order Page

Users can view their past and current orders, track the status of their orders, and see detailed information about each order. Order Page

Cart Page

The cart page displays all the products that a user has added to their cart. Users can adjust quantities, remove items, and proceed to checkout. Cart Page

Payment Page

We integrated Stripe for secure payments. Users can enter their payment information and complete their purchases. Payment Page Payment Page

Profile Page

Users can view and edit their profile information, including personal details and saved addresses. Profile Page

Admin Features

Admin Home Page

The admin home page provides an overview of the admin functionalities and quick links to various management pages. Admin Home Page

Dashboard Page

The dashboard provides a summary of key metrics such as monthly sales, top purchased products, and user statistics. Dashboard Page

User Management Page

Admins can view, edit, and delete user accounts. The page also provides information about user activity and order history. User Management Page

Add Product Page

Admins can add new products by providing product details, images, and other relevant information. Add Product Page

Product Management Page

This page allows admins to manage existing products, including editing details, updating stock, and deleting products. Product Management Page Product Management Page

Order Management Page

Admins can view and manage all orders, update order statuses, and track shipment information. Order Management Page

Resources Used

  • React.js: Frontend library
  • Node.js: Backend runtime environment
  • Express.js: Backend framework
  • MongoDB: Database
  • Mongoose: MongoDB object modeling tool

Other Resources Used

  • Axios: HTTP client
  • nodemon: Restart server on changes
  • reduxjs/toolkit: Central Store details
  • mui/icons-material: Material UI icons
  • jsonwebtoken: JWT token
  • tailwind: easy CSS with responsive
  • react-chartjs-2: Display charts effectively
  • crypto-js: Encryption
  • Stripe: Payment gateway
  • multer: Image storage
  • Cloudinary: Image storage

Installation

  1. Clone the repository:
    git clone https://github.com/harsha335/easy-cart.git
  2. Navigate to the project directory:
    cd easy-cart
  3. Install dependencies for both backend and frontend:
    cd frontend
    npm install
    cd ../backend
    npm install
  4. Create a .env file in the root directory and add your environment variables.

Usage

  1. Start the backend server:
    npm run dev
  2. Start the frontend development server:
    cd client
    npm start

Contributing

Contributions are welcome! Please open an issue or submit a pull request for any changes or enhancements.

License

This project is licensed under the MIT License. See the LICENSE file for details.


Feel free to add any additional information or modify the content as needed.

easycart's People

Contributors

harsha335 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.