Categories: CSS3HTMLphp

Creating a simple PHP Login and Register Project with MySQL: A Step-by-Step Guide

In this tutorial, we’ll walk you through the process of creating a simple PHP Login and Register Project with MySQL as the database. We’ll deploy the project on localhost using XAMPP, a popular web development environment, and add some basic inline CSS styles to enhance the user interface.

Prerequisites for PHP Login and Register Project:

XAMPP is installed on your local machine. You can download it from the official website: https://www.apachefriends.org/ and install the XAMPP.
Basic knowledge of PHP, HTML, and MySQL.

Step 1: Setting up the PHP Login and Register Project

Open the XAMPP control panel and start the Apache and MySQL services.
Navigate to the htdocs folder inside your XAMPP installation directory for eg. “C:\xampp\htdocs\”.
Create a new folder here for your project, let’s call it “login_project”.

Step 2: Database Setup

Open your web browser and navigate to http://localhost/phpmyadmin/.
Click on “Databases” in the top menu and create a new database. Name it “login_db”.
Inside the “login_db” database, create two tables: “users”.
- For the “users” table, use the following columns: userID (auto-increment), userName, userEmail, userPassword, and userRegisterDate.

Step 3: Creating the Config.php and connect database.

Inside the “login_project” folder, create a new PHP file: config.php and add the below code to it.

<?php 
$server = 'localhost'; //for server add localhost.
$user = 'root'; // default "root". If your user is something else, please add here.
$pass = ''; // default is blank. If your user has password please add here.
$db = 'login_db'; // Add database name we have created.
 
$con = new mysqli($server, $user, $pass, $db);

if ($con->connect_error) {
 die("Connection failed:". $con->connect_error);
} else {
 session_start();
}
?>

Step 4: Creating the Login and Register Pages

Inside the “login_project” folder, create two new PHP files: login.php and register.php.

Now, let’s edit “login.php” file. Copy the following code into it:

<?php 
include 'config.php';  // Include the config file.
?>
<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Login</title>
</head>
<body>
<h1>Login </h1>
<?php 
if (isset($_POST['login'])) {
 $userEmail = md5(strtolower($_POST['userEmail']));
 $userPassword = md5($_POST['userPassword']);

 $getUser = mysqli_query($con, "SELECT `userID` FROM `users` WHERE `userEmail` = '$userEmail' and `userPassword`= '$userPassword'");
 if (mysqli_num_rows($getUser)>0) {
  $row = mysqli_fetch_assoc($getUser);
  $_SESSION['userID'] = $row['userID'];
  header('Location: index.php');

  // code...
 } else {
  echo "Email or Password is wrong.";
 }
}

?>

<form method="post" action-xhr="#">
 <input type="email" name="userEmail" placeholder="Email">
 <input type="password" name="userPassword" placeholder="Password">
 <input type="submit" name="login" value="Sign in">
 <p>Already have a account <a href="register.php">Register here</a></p>
</form>
</body>
</html>

Now, let’s edit “register.php” file. Copy the following code into it:

<?php 
include 'config.php';
?>
<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Register</title>
</head>
<body>
<h1>Register </h1>
<?php 
if (isset($_POST['register'])) {
 $userName = $_POST['userName'];
 $userEmail = md5(strtolower($_POST['userEmail']));
 $userPassword = md5($_POST['userPassword']);

 $getUser = mysqli_query($con, "SELECT * FROM `users` WHERE `userEmail` = '$userEmail'");

 if (mysqli_num_rows($getUser)>0) {
  echo "User already exists, please enter another email.";
  // code...
 } else {
  $insert = mysqli_query($con, "INSERT INTO `users`(`userName`, `userEmail`, `userPassword`) VALUES ('$userName','$userEmail','$userPassword')");
  if ($insert == true) {
   echo "Data added";
   // code...
  } else {
   echo "There is an error.";
  }
 }
}

?>

<form method="post" action-xhr="#">
 <input type="text" name="userName" placeholder="User Name">
 <input type="email" name="userEmail" placeholder="Email">
 <input type="password" name="userPassword" placeholder="Password">
 <input type="submit" name="register" value="Sign up">
 <p>Do not have an account <a href="login.php">Login here</a></p>
</form>
</body>
</html>

Step 5: Creating the Dashboard

Inside the “login_project” folder, create a new file called dashboard.php. This file will serve as the user’s dashboard after a successful login:

<?php 
include 'config.php';

if (!empty($_SESSION['userID'])) {
 $userID = $_SESSION['userID'];
} else {
 header('Location: login.php');
}

?>

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Dashboard</title>
</head>
<body>
 <?php 
 $getUser = mysqli_query($con, "SELECT * FROM `users` WHERE `userID` = '$userID'");
 if (mysqli_num_rows($getUser)>0) {
  $row = mysqli_fetch_assoc($getUser);
  $userName = $row['userName'];
  // code...
 } else {
  header('Location: login.php');
 }

 ?>
<h1>Dashboard: <?php echo $userName; ?></h1>
<p><a href="logout.php">Logout as <?php echo $userName; ?></a></p>
</body>
</html>

Step 6: Creating the Logout Page

Inside the “login_project” folder, create a new file called logout.php. This file will handle the logout functionality:

<?php
include 'config.php';

session_destroy();
header('Location: login.php');

?>

Step 7: Testing the Project

Open your web browser and navigate to http://localhost/login_project/login.php.
You should see the login page. Try logging in with valid credentials or click the “Register” link to create a new account.
After successful login, you will be redirected to the dashboard page, where you will see a welcome message with your username.
Click the “Logout” link to log out and return to the login page.

Congratulations! You’ve successfully created a PHP-based login and registration system with MySQL and deployed it on localhost using XAMPP. Remember that this is a basic example, and in a real-world scenario, you’d want to add more security measures, error handling, and possibly use a different method for storing passwords (e.g., using password_hash and password_verify). Happy coding!

Note: This tutorial assumes that you have XAMPP installed and running with default settings. If you have a different configuration, make sure to adjust the database connection details in the PHP files accordingly.

Anil Kumar

Next Easy Guide: Installing WordPress on Localhost or Control Panel »

Previous « How to create a custom post type in WordPress?

Published by

Anil Kumar

2 years ago

Creating a simple PHP Login and Register Project with MySQL: A Step-by-Step Guide

Prerequisites for PHP Login and Register Project:

Step 1: Setting up the PHP Login and Register Project

Step 2: Database Setup

Step 3: Creating the Config.php and connect database.

Step 4: Creating the Login and Register Pages

Step 5: Creating the Dashboard

Step 6: Creating the Logout Page

Step 7: Testing the Project

Recent Posts

Best Ways to Create or Convert Images to Ghibli-Style.

Top 10 WordPress Benefits Compared to Other CMS Platforms

10 Must-Have Essential WordPress Plugins for a Simple Website

How to Select the Best WordPress Theme for Your Site

How to Secure Your WordPress Website from Hackers

WordPress Speed Optimization for Better Performance