incruder1 / ecommerce-fullStack

FullStack Ecommerce Website. (MERN).

Home Page:https://easy-gray-bear-belt.cyclic.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

MERN Full Stack Ecommerce Website with Admin Panel

Website Screenshot

HOMEPAGE SCREENSHOT

Screenshot (99)

ADMIN PANEL

Screenshot (101)

ADD, DELETE, EDIT THE LISTED ITEMS.

Screenshot (100)

This project is a MERN (MongoDB, Express, React, Node.js) Full Stack Ecommerce Website with an integrated admin panel for managing the item list. It provides a comprehensive solution for setting up an online store, allowing users to browse products, add items to their cart, and make purchases. The admin panel offers the capability to add, delete, and edit items easily.

Features

User-Friendly Frontend: A responsive and intuitive frontend for customers to browse and shop for products.

Authentication: User authentication and authorization for secure login and account management.

Product Management: An admin panel to add, edit, and delete products, including details like name, description, price, and images.

Shopping Cart: Users can add items to their cart and proceed to checkout.

Payment Integration: Integration with popular payment gateways to facilitate secure online payments.

Order History: Users can view their order history and track the status of their orders.

Installation

Follow these steps to set up the project:

Clone the Repository: Clone this repository to your local machine using Git.

 
 git clone https://github.com/your-username/mern-ecommerce.git

Install Dependencies: Navigate to the project directory and install server-side dependencies.

 
cd mern-ecommerce
npm install

Client Dependencies: Go to the client directory and install client-side dependencies.

 

cd client
npm install

Environment Variables: Create a .env file in the project root directory and set the required environment variables (e.g., database connection string, secret key).

Copy code
PORT=5000
MONGODB_URI=your_mongodb_connection_string
SECRET_KEY=your_secret_key

Start the Development Server: Return to the project root directory and start both the server and client.

Copy code
npm run dev

Access the Website: Open your web browser and visit http://localhost:3000 to access the ecommerce website.

Access the Admin Panel: To access the admin panel, navigate to http://localhost:3000/admin and log in with admin credentials.

Usage Admin Panel Add New Product:

Log in to the admin panel. Click the "Add Product" button to create a new product, providing all necessary details. Edit Existing Product:

Navigate to the admin panel. Select a product from the list and click the "Edit" button to modify its details. Delete Product:

Access the admin panel. Choose a product from the list and click the "Delete" button to remove it. Shopping Browse Products: Visit the main website and browse through the available products.

Add to Cart: Click the "Add to Cart" button on a product to add it to your shopping cart.

Checkout: When ready, proceed to checkout, enter shipping and payment information, and place your order.

Contributing

We welcome contributions from the community. If you have any feature suggestions, bug reports, or code improvements, please open an issue or submit a pull request. Let's make this project even better together!

Support and Feedback

If you encounter any issues or have questions about using this ecommerce website and admin panel, please feel free to reach out by creating an issue.

About

FullStack Ecommerce Website. (MERN).

https://easy-gray-bear-belt.cyclic.app/


Languages

Language:JavaScript 96.3%Language:HTML 3.7%