DEV Community

Cover image for Basic Signup,Login & Logout system in PHP
Madhuban Khatri
Madhuban Khatri

Posted on

Basic Signup,Login & Logout system in PHP

Hello Friends, In thi post, I will show you how to create a Simple Signup, Login & Logout system using PHP. I am using bootstrap for FRONTEND and PHP & MySQL is used for BACKEND.

Users can create an account and their details are saved to database. After registration users can login and redirect to home page. Home page can not be shown if user is not loggedin. There is a logout option for users.

Here is the source code-

dbconnect.php

<?php

    $servername = "localhost";
    $username = "root";
    $password = "";
    $database = "mady_ka_login_system";

    $conn = mysqli_connect($servername,$username,$password,$database);
    if(!$conn)
    {
        die("Connection Failed".mysqli_error($conn));
    }

?>
Enter fullscreen mode Exit fullscreen mode

login.php

<?php
    include "navbar.php";
    require "dbconnect.php";

    if($_SERVER['REQUEST_METHOD'] == 'POST')
    {
        $username = $_POST['user_name'];
        $password = $_POST['pwd'];

        if(empty($username) and empty($password))
        {
            echo '<div class="alert alert-warning alert-dismissible fade show" role="alert">
            <strong>Warning!</strong> Please fill the fields.
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
          </div>';
        }
        else
        {
            $sql_query = "SELECT * FROM `registration_table` WHERE `name`='$username' and `password`='$password'";
            $result = mysqli_query($conn,$sql_query);
            $rows = mysqli_num_rows($result);
            if($rows==1)
            {
                $_SESSION['user_name'] = $username;
                header("location: home.php");
            }
            else
            {
                echo '<div class="alert alert-warning alert-dismissible fade show" role="alert">
                <strong>Warning!</strong> Wrong user details.
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
              </div>';
            }

        }
    }
?>
<?php
    if(!isset($_SESSION['user_name']))
    {
        echo '<html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Login</title>
        </head>
        <body>
            <div class="container my-5 w-50">
                <h1>Login</h1>
                <hr>
                <form action="/iSystem_bootstrap/login.php" method="post">
                    <div class="mb-3">
                        <input type="text" class="form-control" name="user_name" id="exampleFormControlInput1" placeholder="Username">
                    </div>
                    <div class="mb-3">
                        <input type="password" class="form-control" name="pwd" id="exampleFormControlInput1" placeholder="Password">
                    </div>
                    <div class="mb-3">
                        <input type="submit" class="form-control btn btn-primary" id="exampleFormControlInput1" value="Login">
                    </div>
                </form>
            </div>
        </body>
        </html>';
    }
    else
    {
        header("location: home.php");
    }

?>

Enter fullscreen mode Exit fullscreen mode

signup.php

<?php
    include "navbar.php";
    require "dbconnect.php";
    if($_SERVER['REQUEST_METHOD']=='POST')
    {
        $user_name = $_POST['username'];
        $email = $_POST['email'];
        $password = $_POST['password'];

        if(empty($user_name) or empty($email) or empty($password))
        {
            echo '<div class="alert alert-warning alert-dismissible fade show" role="alert">
            <strong>Warning!</strong> Please fill the fields.
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
          </div>';
        }
        else
        {
            $user_name = $_POST['username'];
            $email = $_POST['email'];
            $password = $_POST['password'];

            $sql_query = "SELECT * FROM `registration_table` WHERE `name`='$user_name' or `email`='$email'";
            $result = mysqli_query($conn, $sql_query);
            $rows = mysqli_num_rows($result);
            if($rows==0)
            {
                $sql_query = "INSERT INTO `registration_table` (`name`,`email`,`password`) VALUES ('$user_name','$email','$password')";
                $result = mysqli_query($conn, $sql_query);
                if($result)
                {
                    echo '<div class="alert alert-success alert-dismissible fade show" role="alert">
                    <strong>Success!</strong> Your account has been created.
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>';
                }
                else
                {
                    echo '<div class="alert alert-warning alert-dismissible fade show" role="alert">
                    <strong>Warning!</strong> Please fill the fields.
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>';
                }
            }
            else
            {
                echo '<div class="alert alert-danger alert-dismissible fade show" role="alert">
                    <strong>Error!</strong> Username and Email are exists. Please select unique.
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>';
            }

        }
    }
?>
<?php
    if(!isset($_SESSION['user_name']))
    {
        echo '<html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Signup</title>
        </head>
        <body>
        <div class="container my-5 w-50">
                <h1>Signup</h1>
                <hr>
                <form action="/iSystem_bootstrap/signup.php" method="post">
                    <div class="mb-3">
                        <input type="text" class="form-control" name="username" id="exampleFormControlInput1" placeholder="Username">
                    </div>
                    <div class="mb-3">
                        <input type="email" class="form-control" name="email" id="exampleFormControlInput1" placeholder="Email">
                    </div>
                    <div class="mb-3">
                        <input type="password" class="form-control" name="password" id="exampleFormControlInput1" placeholder="Password">
                    </div>
                    <div class="mb-3">
                        <input type="submit" class="form-control btn btn-primary" value="Signup">
                    </div>
            </form>
        </div>
        </body>
        </html>';
    }
    else
    {
        header("location: home.php");
    }
?>

Enter fullscreen mode Exit fullscreen mode

logout.php

<?php
    include "navbar.php";
    require "dbconnect.php";
    session_start();
    session_unset();
    session_destroy();

    header("location: login.php");

?>
Enter fullscreen mode Exit fullscreen mode

home.php

<?php
    include "navbar.php";
    require "dbconnect.php";

    if(isset($_SESSION['user_name']))
    {
        echo '<div class="alert alert-success my-4" role="alert">
        <h4 class="alert-heading">Welcome!</h4>
        <p>You are loggedin as <b>'. $_SESSION["user_name"].'</b></p>
        <hr>
        <p class="mb-0">You can not access the home page without login. You will get an error message, if you  do this.</p>
      </div>';
    }
    else
    {
        echo '<div class="alert alert-danger alert-dismissible fade show" role="alert">
                    <strong>Error!</strong> You are not loggedin.
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>';
    }
?>
Enter fullscreen mode Exit fullscreen mode

Thank you for reading my post. Check out my other posts and share your own thoughts. We will build together.

Top comments (0)