E-Commerce App Prototype

This project entails the development of an online E-Commerce prototype application, offering users a platform to purchase a variety of products. The application is built using the MERN (MongoDB, Express, React, NodeJS) stack with a REST API architectural implementation.

You can view the live website here.

Note: Note: The codebase has been refactored and enhanced to ensure a functional version of the repository. Key improvements include optimizing user interface responsiveness, utilizing local storage for JWT token storage, and reconfiguring relationships between Admin, User, Shop Owner, etc.## Main Objective/s

The main objectives of this project were to:

1. Understand and refactor the existing codebase, encompassing concepts like RESTful APIs, JWT Authentication, Web Sockets, and state management with Redux.
2. Develop a mind map to facilitate efficient navigation and comprehension of the application.
3. Submit a pull request to the original repository, presenting significant improvements to the codebase.

Key Features

• User and Admin Authentication: Users and administrators can securely authenticate themselves.
• Wishlist and Cart Functionality: Users can add items to their wishlist and cart for easy tracking and purchasing.
• User and Admin Profiles: Users and administrators have dedicated profiles with personalized information.
• Browse Products: Users can explore a wide range of products available on the platform.
• Payment Page using Stripe: Secure and seamless payment processing via the Stripe payment gateway.
• Online Messaging with Web Sockets: Real-time messaging functionality enabled through Web Sockets.
• Stateless Authentication using JWT: Implementation of stateless authentication using JSON Web Tokens (JWT).
• REST API Implementation with Express.js: Utilization of Express.js for implementing a RESTful API.
• Image Upload with Cloudinary: Integration of Cloudinary for smooth image uploading.
• State Management with Redux Toolkit: Effective state management accomplished using Redux Toolkit.

What I've Learned

Through this project, I gained the following knowledge and skills:

• Proficiency in Redux state management.
• Secure password hashing (salting).
• Image uploading to Cloudinary.
• Role assignment for specific individuals within the application.
• Integration of the Stripe payment gateway.
• Sending emails via SMTP.
• Displaying app notification status using React Lottie.
• Building a comprehensive mind map to enhance accessibility and information retrieval.

Quick Installation

1. Clone the repository to your local machine:

   git clone https://github.com/MiDo-kun/Ecommerce-App.git

2. Navigate to each folder and install the dependencies for every folder - frontend, backend and socket:

   • Frontend:

     cd frontend && npm install

   • Backend:

     cd backend && npm install

   • Socket:

     cd socket && npm install

3. Start the development server:

   • On the frontend

     npm run dev

   • On the backend

     npm run dev

   • On the socket

     npm run dev

Open your web browser and navigate to http://localhost:5172 to view the website.

Contributing

Contributions are welcome! If you want to contribute to the project, please follow these guidelines:

1. Fork the repository to your own GitHub account.

2. Clone the repository to your local machine:

   git clone https://github.com/MiDo-kun/Ecommerce-App.git

3. Create a new branch for your changes:

   git checkout -b your-branch-name

4. Make your changes to the code.

5. Commit your changes:

   git commit -m "Your commit message"

6. Push your changes to your fork:

   git push origin your-branch-name

7. Create a pull request from your fork to the main repository.

License

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