E-commerce with MongoDB and PHP

Features

• Programmed to easily handle scaling of fields.
• Includes a simple session-based authentication.
• Designed using Bootstrap 3.
• It uses procedural programming approach.
• Code made simple so developers can easily understand how it works.
• No nonsense codes,
• 100% free to use.

Checkout the repository on Github

---

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.

Home Page

The home page is a static template made using bootstrap. Its minimalistic design will catch the eyes of your customers, dragging them to browse further into the pages of your site. You can use the template, change or style it to fit your requirements.

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.

---

JS Plugins Used:

• ImageViewer
• Lobibox
• jQuery Form

---

How do I get setup?

• You should have MongdoDB installed and a Web Server to run the application.
• Simply change the value of APP_LOCATION constant, located in inc/constants.php, to the path 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 selectDB to any database name you want.

---

Node.js

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

---