How to Link Login Form With Database

PHP MySQL Login System

In this topic, we will learn how to create a PHP MySQL Login System with the help of PHP and MySQL database. There are few steps given for creating a login system with MySQL database.

Before creating the login system first, we need to know about the pre-requisites to create the login module.

Requirements

• We should have knowledge of HTML, CSS, PHP and MySQL for creating the login system.
• Text Editor - For writing the code. We can use any text editor such as Notepad, Notepad++, Dreamweaver, etc.
• XAMPP - XAMPP is a cross-platform software, which stands for Cross-platform(X) Apache server (A), MySQL (M), PHP (P), Perl (P). XAMPP is a complete software package, so, we don't need to install all these separately.

Environment Setup

Now, we need to start the webserver and create the files for the login system. There are few steps that are given below to setup the environment.

• Open the XAMPP Control Panel.
• Start the Apache server by clicking on the Start button.
• Start the MySQL by clicking on the Start button.
• Create all the files needed for login.
• Create login table in the database using phpMyAdmin in XAMPP.

Now, we will create four files here for the login system.

1. index.html - This file is created for the GUI view of the login page and empty field validation.
2. style.css - This file is created for the attractive view of the login form.
3. connection.php - Connection file contains the connection code for database connectivity.
4. authentication.php - This file validates the form data with the database which is submitted by the user.

Save all these files in the htdocs folder inside the Xampp installation folder. The detailed description and code for these files are discussed below.

index.html

First, we need to design the login form for the website user to interact with it. This login form is created using html and also contains the empty field validation, which is written in JavaScript. The code for the index.html file is given below:

After executing the above code on the browser, the login page will appear as below if it does not contain style.css file.

style.css

Now, we will create style.css file to provide a more attractive view to the login form. The CSS code for the style.css file is given below:

After including above CSS file in index.html, the login form will be like -

Note: All these files should be saved in the same folder, so we can easily access them without any interruption.

Database and Table Creation

Now, the next step is to create the database and the login table inside the database.

• Access the phpMyAdmin on the browser using localhost/phpmyadmin/ and create a table in the database. Here we will create a database and table using GUI based phpMyAdmin rather than queries execution.
• Click on New and enter the database name and then click on Create button.

• Now we will create a login table in the database. Create a table by name login in the database which you have created earlier.

• Specify the column Name and their Type and Length in the table in which we will store the username and password for the different users and save it by clicking on the save button.

• Click on the insert, from where we can insert the records in columns. So insert the username and password here and click on Go button to save the record.

connection.php

Next step is to do the connectivity of login form with the database which we have created in the previous steps. We will create connection.php file for which code is given below:

authentication.php

Now, we have our database setup, so we can go with the authentication of the user. This file handles the login form data that sent through the index.html file. It validates the data sent through the login form, if the username and password match with the database, then the login will be successful otherwise login will be failed.

How to run the login form?

• To run the login form, open the xampp control panel and run the apache server and PHP.
• Now, type localhost/xampp/folder name/file name in the browser and press Enter key.
• All setup is done now. Enter the username and password in the login form and click the login button.

• Here, we have inserted an incorrect username, so the user is unable to log in, and it will give the login failed error.

Output:

• Now, we will provide correct value in the username and password. So, the user will be successfully logged in. See in the below example.

Output

---

How to Link Login Form With Database

Source: https://www.javatpoint.com/php-mysql-login-system

Share this post