Video Demo:

Features

• Multi Vendor E-commerce – customers can register for an account and be able to upload and sell their products.
• User Authentication and Account management.
• Create Product, Edit Product, and Manage Products
• Bulk upload product images, delete product images, and Set Features image of a product,
• User products and Catalog filtering which includes: Per Page Display, Search, Ordering, Sorting and Pagination.
• Word class inline image slider with zooming and panning functionality.
• WYSIWYG rich text editor for writing content
• Responsive web design – utilizes Bootstrap 5.
• All actions are processed via AJAX for better performance.
• Minimum supported version: PHP 7
• It uses procedural programming approach.
• Code made simple so developers can easily understand how it works.
• No nonsense codes

The Pages:

Products Page Front-end

4-grid responsive product page styled using Bootstrap panels.  The page is loaded dynamically using AJAX and it includes filters for Per Page count, Search by Keyword, Order by (Title, Price and Quantity) and weather you want them listed in ascending or descending order.

Single Product Page

The page includes a gmail based image attachment viewer which allow your users to zoom in and out the picture either by on-screen controls or by using the mouse scroll. I added a few non-functional items like the Write a Review link, Add to Cart button and Add to Wishlist, but you can expect these features to be implemented soon in my future releases.

User Products Screen

The page allow users to easily manage their products. Items can be sorted by Name, Price,  Status, Date and Quantity and you can easily add / change these fields to meet your web app requirements. The X button in red automatically deletes the product including its images as soon as you click it. The Add New button and pencil shaped icon in green will open up the product editing page / create page.

Single Product Editing Screen

The product editing screen is pretty much based on WordPress’s post editing screen. The features included are:

• Rich text editor using CKEditor,
• A date and time picker,
• Excerpt field which you can use to populate your meta content description,
• Full blown dynamic image uploader
• Allow users to set a featured image of the product by clicking on the star located on top of the picture,
• Automatically handles the saving of new fields.
• Scale as much as you want!

Login Page

• The layout is based on Laravel 5.2 Login page,
• It includes validations,
• It uses a Session-based authentication.

Registration Page

• The server code is setup to handle as much fields as you want.
• It includes validations.

Account Page

The accounts page is similar to how the Registration page was built, except that I added a few features:

• Allow users to change their passwords.
• Includes an About Me field.
• Includes validations.

How do I get setup?

• You should have MongdoDB installed and a Web Server to run the application.
• Using composer, navigate to the project using your command prompt, then install the mongodb dependency:
  • composer require mongodb/mongodb
• Change the value of APP_LOCATION  constant, located in inc/constants.php, to the folder name of your project.
• There’s no need to to setup the database, it will automatically be created along with the collections. If you need to change the database name, go to inc/config.php and change the company_product parameter of selectDatabase to any database name you want.

Not Included:

• Checkout system
• Cart Page
• Wish List
• Ratings and Reviews

Node.js

I released a similar Web Application using Node.JS with MongoDB,  click here to view the project