How to create a Registration and Login System with PHP and MySQL. Here is the step by step easy solution to build a registration and login form in php and mysql. Now a days almost every online website supports Registration and login functionality. So, it is required to add a login system in latest web applications.
In this Example, i walk through the complete process of creating a user registration system. Here Users can create an account by providing profile membername, password, Birthdate, email. And then the account was created successfully, the member can log in(sign in) to their own account. Once the member login, it will redirect to the main Home or Dashboard page. Moreover, the member can logout(session destroy) from his admin panel. This Full system we are developed using PHP and MySQL.
Furthermore, i will learn you how to build secure pages that are only accessed by logged in users. Without any types of the login, the member can not access the page.
How to create a Registration and Login System with PHP and MySQL
Here are Seven Basic simple steps you have to follow to create a login system & registration and login form in php and mysql with validation code free download.
Also Read: JQuery Ajax Secure Login Registration System In PHP And MySQL
- Create a MySQL Database and Database Table
- Simple Connect to the Database
- Session Create for Logged in User
- Create a Registration and Login Form
- Make a Dashboard Page
- Create a Logout (Destroy session)
- CSS File Create
Create a Database and Database Table
First of all, you have to log in to PHPMyAdmin. And then, click on the MySQL Database tab to create a new database. And then Enter your database name as well as click on create database button. As soon as PHPMyAdmin will create a new database.
Similarly, you can execute the below query to create a database.
CREATE DATABASE member_master;
Once you create a database, the second step to creating a member table. The member’s table will have the following fields.
- id – int(11)
- membername – varchar(100)
- email – varchar(100)
- password – varchar(100)
- created_at – datetime
CREATE TABLE IF NOT EXISTS `members` ( `id` int(11) NOT NULL AUTO_INCREMENT, `membername` varchar(50) NOT NULL, `email` varchar(50) NOT NULL, `password` varchar(50) NOT NULL, `created_at` datetime NOT NULL, PRIMARY KEY (`id`) );
Copy the above query and execute it in the SQL query area.
Connect to the Database
After creating the table, i have to create a PHP MySQL connector script to connect to the MySQL database server. Create a file named db.php and put the following code inside it.
db.php
<?php
$con = mysqli_connect("localhost","jdk_4cgnadhi","DSFds5f47578ere","user_master");
if (mysqli_connect_errno()){
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
?>
Session Create for Logged in User
Next, i have to create a session for the member. here simply Create a file named auth_session.php and paste the codes below.
auth_session.php
<?php
session_start();
if(!isset($_SESSION["membername"])) {
header("Location: signin.php");
exit();
}
?>
Creating a Registration Form
Furthermore, create PHP file registration.php as well as paste the following example code in it. This will create an HTML form. It will allow members to register.
registration.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Registration - www.pakainfo.com</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<?php
require('db.php');
if (isset($_REQUEST['membername'])) {
$membername = stripslashes($_REQUEST['membername']);
$membername = mysqli_real_escape_string($con, $membername);
$email = stripslashes($_REQUEST['email']);
$email = mysqli_real_escape_string($con, $email);
$password = stripslashes($_REQUEST['password']);
$password = mysqli_real_escape_string($con, $password);
$created_at = date("Y-m-d H:i:s");
$query = "INSERT into `members` (membername, password, email, created_at)
VALUES ('$membername', '" . md5($password) . "', '$email', '$created_at')";
$result = mysqli_query($con, $query);
if ($result) {
echo "<div class='form'>
<h3>You are registered successfully.</h3><br/>
<p class='link'>Click here to <a href='signin.php'>Login</a></p>
</div>";
} else {
echo "<div class='form'>
<h3>Required fields are missing.</h3><br/>
<p class='link'>Click here to <a href='registration.php'>registration</a> again.</p>
</div>";
}
} else {
?>
<form class="form" action="" method="post">
<h2 class="signin-title">Registration</h2>
<input type="text" class="signin-input" name="membername" placeholder="Username" required />
<input type="text" class="signin-input" name="email" placeholder="Email Adress">
<input type="password" class="signin-input" name="password" placeholder="Password">
<input type="submit" name="submit" value="Register" class="signin-button">
<p class="link"><a href="signin.php">Click to Login</a></p>
</form>
<?php
}
?>
</body>
</html>
Creating a Login Form
Similarly, create a PHP file signin.php and put the following example code in it. This file code contains a form that allows members to enter membername and password.
signin.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Login - WWW.pakainfo.com</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<?php
require('db.php');
session_start();
if (isset($_POST['membername'])) {
$membername = stripslashes($_REQUEST['membername']);
$membername = mysqli_real_escape_string($con, $membername);
$password = stripslashes($_REQUEST['password']);
$password = mysqli_real_escape_string($con, $password);
$query = "SELECT * FROM `members` WHERE membername='$membername'
AND password='" . md5($password) . "'";
$result = mysqli_query($con, $query) or die(mysql_error());
$rows = mysqli_num_rows($result);
if ($rows == 1) {
$_SESSION['membername'] = $membername;
header("Location: dashboard.php");
} else {
echo "<div class='form'>
<h3>Incorrect Username/password.</h3><br/>
<p class='link'>Click here to <a href='signin.php'>Login</a> again.</p>
</div>";
}
} else {
?>
<form class="form" method="post" name="signin">
<h2 class="signin-title">Login</h2>
<input type="text" class="signin-input" name="membername" placeholder="Username" autofocus="true"/>
<input type="password" class="signin-input" name="password" placeholder="Password"/>
<input type="submit" value="Login" name="submit" class="signin-button"/>
<p class="link"><a href="registration.php">New Registration</a></p>
</form>
<?php
}
?>
</body>
</html>
Similarly, the output of the above code will look like this.
Making a Dashboard Page
Once member signin i will redirect to the member dashboard page. Create a PHP file named dashboard.php and paste the below code in it.
dashboard.php
<?php
include("auth_session.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dashboard - Client area</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="form">
<p>Hey, <?php echo $_SESSION['membername']; ?>!</p>
<p>You are now member dashboard page.</p>
<p><a href="logout.php">Logout</a></p>
</div>
</body>
</html>
Similarly, you can create another secure page. Only you need to add the below code first in your PHP file.
<?php
require('db.php');
include("auth_session.php");
?>
Create a Logout (Destroy session)
When clicking on the logout button i have to destroy member sessions. It will redirect to the signin page. Thus, create a file named logout.php and add the below code.
logout.php
<?php
session_start();
if(session_destroy()) {
header("Location: signin.php");
}
?>
CSS File Create
Finally, important step for a member experience perspective. Create CSS file style.css and put the below code.
style.css
body {
background: #3e4144;
}
.form {
margin: 50px auto;
width: 300px;
padding: 30px 25px;
background: white;
}
h1.signin-title {
color: #666;
margin: 0px auto 25px;
font-size: 25px;
font-weight: 300;
text-align: center;
}
.signin-input {
font-size: 15px;
border: 1px solid #ccc;
padding: 10px;
margin-bottom: 25px;
height: 25px;
width: calc(100% - 23px);
}
.signin-input:focus {
border-color:#6e8095;
outline: none;
}
.signin-button {
color: #fff;
background: #55a1ff;
border: 0;
outline: 0;
width: 100%;
height: 50px;
font-size: 16px;
text-align: center;
cursor: pointer;
}
.link {
color: #666;
font-size: 15px;
text-align: center;
margin-bottom: 0px;
}
.link a {
color: #666;
}
h3 {
font-weight: normal;
text-align: center;
}
And Last step, our login system is ready to use. here You can use download the full source code from the below download link.