E-Commerce Website using MySQL, PHP and Bootstrap
- User should not be allowed to register if he/she tries to provide the already registered email ID.
- Implementation of export button in admin module to export all details of users to an excel sheet.
- Install XAMPP web server
- Any Editor (Preferably VS Code or Sublime Text)
- Any web browser with latest version
- HTML5/CSS3
- JavaScript (to create dynamically updating content)
- Bootstrap (An HTML, CSS, and JS library)
- XAMPP (A web server by Apache Friends)
- PHP
- MySQL (An RDBMS that uses SQL)
- Download and install XAMPP in your machine.
- Clone or download the repository.
- Extract all the files and move it to the 'htdocs' folder of your XAMPP directory.
- Make a new folder 'project' in the 'htdocs' folder of your XAMPP directory. Extract all the files and move it to this folder.
- Start the Apache and Mysql in your XAMPP control panel.
- Click on Admin button in the Mysql Module. Alternatively you can open your web browser and type 'http://localhost/phpmyadmin/'.
- In phpmyadmin page, create a new database from the left panel and name it as 'project'.
- In this 'project' database, click on "New" button.
- On the navigation bar click on SQL, paste the following SQL commands and click on Go.
CREATE TABLE `users` (
`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`firstname` varchar(100) NOT NULL,
`Lastname` varchar(100) NOT NULL,
`gender` varchar(100) NOT NULL,
`DOB` date NOT NULL,
`email` varchar(100) NOT NULL,
`password` varchar(100) NOT NULL,
`num` int(11) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
- In the 'project' database, again click on "New" button.
- On the navigation bar click on SQL, paste the following SQL commands and click on Go.
CREATE TABLE `admin` (
`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`username` varchar(100) NOT NULL,
`password` varchar(100) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
- In the 'project' database, again click on "New" button.
- On the navigation bar click on SQL, paste the following SQL commands and click on Go.
CREATE TABLE `testing` (
`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`Product` varchar(100) NOT NULL,
`Price` int(11) NOT NULL,
`Email` varchar(100) NOT NULL,
`Quantity` int(11) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
- In the 'project' database, again click on "New" button.
- On the navigation bar click on SQL, paste the following SQL commands and click on Go.
CREATE TABLE `orders` (
`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`Product` varchar(100) NOT NULL,
`Price` int(11) NOT NULL,
`Email` varchar(100) NOT NULL,
`Quantity` int(11) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
NOTE: EVERYTHING IS CASE SENSITIVE
- Open a new tab and type 'http://localhost/project/index.php' in the url of your browser
- Hurray! That's it!
- XAMPP was installed on windows and APACHE Server and MySQL were initialized. And, files were built inside C:\xampp\htdocs\project.
- VS Code was used as a text editor.
- Google Chrome Version 91.0.4472.124 was used to run the project.
The XAMPP Control Panel allows you to manually start and stop Apache and MySQL. To start Apache or MySQL manually, click the ‘Start’ button under ‘Actions’.
This website has a ‘Home’ page which contains links to the following from where the user & admin can login into their accounts by toggling the tabs accordingly.
It contains following sections:-
A) Services
B) Live Updates
C) Useful Youtube Videos
This Section (in the home page itself) contains link to various services like Register for Vaccine, donate to PM Care Fund, find nearest vaccination center and read information about COVID-19 and its prevention.
This Section (in the home page itself) displays (COVID-19) statistics of confirmed Covid Cases, Deaths and number of people vaccinated. The user can select any country and can also compare covid cases by region.
This Section (in the home page itself) displays various embedded Youtube videos on Symptoms, Precautions and Prevention of Coronavirus.
'About Us' page (Fig 1.2) allows us to get some more information about goals and the services of our E-commerce website.
The website consists of 2 modules:
- User Module
- Admin Module
This module allows customers to create their account, login to their account, view products, add/delete products to their cart and place/cancel their orders.
The registration page asks customers to enter their First Name, Last Name, DOB, Email Address, Password, Home Address, Phone Number, and radio buttons to select their gender.
Once the user has created his/her own account after clicking the ‘Register’ button, then he/she will be redirected to Login Page.
After successful registration, the user has to log in with the email and password provided on the registration page.
After successful login, the user gets redirected to Easy Shop Page. Here the user can choose any product as well as the quantity. To add an item to their cart, the user needs to click the "Add to cart" button.
This Page displays all the products choosen by the user with their ID, Quantity and Price (per item). The user can also Remove an item by clicking on the "Remove" Button.
The user can also place the order by clicking on "Place Order" Button.
This Page displays all the orders placed by the user with their ID, Quantity and Price (per item). The user can also cancel an order by clicking on the "Cancel Order" Button.
This module allows an Admin to log in to their existing account, view orders of other users, cancel an order, and add a new Admin.
Firstly, the Admin has to log in to their existing account using his username and password.
After successful login, the Admin gets redirected to Order Manager Page. Here the Admin can see all the products choosen by the users with their ID, Quantity, Price (per item), Email ID and Address. The Admin can also cancel the order of any user.
The Admin can also add another Admin by clicking on "Add Admin" button on Order Manager Page. The Admin needs to enter the Username and Password and then click on "Add Admin" button.
Updates to this Project will be added here.
Click Here to Download Project Report
This project is licensed under the MIT License.