How To Create User Login and Registration in PHP with MySQL

Login and Registration in PHP are essential parts of any website in PHP. Here we will learn the following points in this tutorial on How you can build a simple, lightweight user registration and login in PHP with MySQL database.

Table Of Contents

User Registration
Output
Login Page
User Login Output
Data Base Config
Logout
MySQL database script
Download Source Code

How To Create User Login and Registration in PHP with MySQL 3

User Registration

user-registration.php

1<?php
2use tutorial\Member;
3if (! empty($_POST["signup-btn"])) {
4    require_once './Model/Member.php';
5    $member = new Member();
6    $registrationResponse = $member->registerMember();
7}
8?>
9<HTML>
10<HEAD>
11<TITLE>https://sarveshpathak.com/</TITLE>
12<link href="assets/css/tutorial-style.css" type="text/css"
13    rel="stylesheet" />
14<link href="assets/css/user-registration.css" type="text/css"
15    rel="stylesheet" />
16<script src="vendor/jquery/jquery-3.3.1.js" type="text/javascript"></script>
17</HEAD>
18<BODY>
19    <div class="tutorial-container">
20        <div class="sign-up-container">
21            <div class="login-signup">
22                <a href="index.php">Login</a>
23            </div>
24            <div class="">
25                <form name="sign-up" action="" method="post"
26                    onsubmit="return signupValidation()">
27                    <div class="signup-heading">New User Registration</div>
28                <?php
29    if (! empty($registrationResponse["status"])) {
30        ?>
31                    <?php
32        if ($registrationResponse["status"] == "error") {
33            ?>
34                    <div class="server-response error-msg"><?php echo $registrationResponse["message"]; ?></div>
35                    <?php
36        } else if ($registrationResponse["status"] == "success") {
37            ?>
38                    <div class="server-response success-msg"><?php echo $registrationResponse["message"]; ?></div>
39                    <?php
40        }
41        ?>
42                <?php
43    }
44    ?>
45                <div class="error-msg" id="error-msg"></div>
46                    <div class="row">
47                        <div class="inline-block">
48                            <div class="form-label">
49                                Enter Your Username<span class="required error" id="username-info"></span>
50                            </div>
51                            <input class="input-box-330" type="text" name="username"
52                                id="username">
53                        </div>
54                    </div>
55                    <div class="row">
56                        <div class="inline-block">
57                            <div class="form-label">
58                            Enter Your  Email<span class="required error" id="email-info"></span>
59                            </div>
60                            <input class="input-box-330" type="email" name="email" id="email">
61                        </div>
62                    </div>
63                    <div class="row">
64                        <div class="inline-block">
65                            <div class="form-label">
66                            Enter Your  Password<span class="required error" id="signup-password-info"></span>
67                            </div>
68                            <input class="input-box-330" type="password"
69                                name="signup-password" id="signup-password">
70                        </div>
71                    </div>
72                    <div class="row">
73                        <div class="inline-block">
74                            <div class="form-label">
75                            ReEnter Your Password<span class="required error"
76                                    id="confirm-password-info"></span>
77                            </div>
78                            <input class="input-box-330" type="password"
79                                name="confirm-password" id="confirm-password">
80                        </div>
81                    </div>
82                    <div class="row">
83                        <input class="btn" type="submit" name="signup-btn"
84                            id="signup-btn" value="Sign up">
85                    </div>
86                    <div class="row">
87                        <div class="inline-block">
88                            <div class="form-label">
89                            https://sarveshpathak.com/
90                            </div>
91                             
92                        </div>
93                    </div>
94                     
95                </form>
96            </div>
97        </div>
98    </div>
99 
100    <script>
101function signupValidation() {
102    var valid = true;
103 
104    $("#username").removeClass("error-field");
105    $("#email").removeClass("error-field");
106    $("#password").removeClass("error-field");
107    $("#confirm-password").removeClass("error-field");
108 
109    var UserName = $("#username").val();
110    var email = $("#email").val();
111    var Password = $('#signup-password').val();
112    var ConfirmPassword = $('#confirm-password').val();
113    var emailRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
114 
115    $("#username-info").html("").hide();
116    $("#email-info").html("").hide();
117 
118    if (UserName.trim() == "") {
119        $("#username-info").html("required.").css("color", "#ee0000").show();
120        $("#username").addClass("error-field");
121        valid = false;
122    }
123    if (email == "") {
124        $("#email-info").html("required").css("color", "#ee0000").show();
125        $("#email").addClass("error-field");
126        valid = false;
127    } else if (email.trim() == "") {
128        $("#email-info").html("Invalid email address.").css("color", "#ee0000").show();
129        $("#email").addClass("error-field");
130        valid = false;
131    } else if (!emailRegex.test(email)) {
132        $("#email-info").html("Invalid email address.").css("color", "#ee0000")
133                .show();
134        $("#email").addClass("error-field");
135        valid = false;
136    }
137    if (Password.trim() == "") {
138        $("#signup-password-info").html("required.").css("color", "#ee0000").show();
139        $("#signup-password").addClass("error-field");
140        valid = false;
141    }
142    if (ConfirmPassword.trim() == "") {
143        $("#confirm-password-info").html("required.").css("color", "#ee0000").show();
144        $("#confirm-password").addClass("error-field");
145        valid = false;
146    }
147    if(Password != ConfirmPassword){
148        $("#error-msg").html("Both passwords must be same.").show();
149        valid=false;
150    }
151    if (valid == false) {
152        $('.error-field').first().focus();
153        valid = false;
154    }
155    return valid;
156}
157</script>
158</BODY>
159</HTML>

User Registration CSS

1.sign-up-container {
2    border: 1px solid;
3    border-color: #9a9a9a;
4     
5    border-radius: 4px;
6    padding: 10px;
7    width: 350px;
8    margin: 50px auto;
9    box-shadow: 0 1rem 9rem 9px rgb(0 0 0 / 18%) !important;
10    border: 1px solid #cbcbcb;
11    background: #eaeaea;
12}
13 
14.page-header {
15    float: right;
16}
17 
18.login-signup {
19    margin: 10px;
20    text-decoration: none;
21    float: right;
22}
23 
24.login-signup a {
25    text-decoration: none;
26    font-weight: 700;
27}
28 
29.signup-heading {
30    font-size: 2em;
31    font-weight: bold;
32    padding-top: 60px;
33    text-align: center;
34}
35 
36.inline-block {
37    display: inline-block;
38}
39 
40.row {
41    margin: 15px 0px;
42    text-align: center;
43}
44 
45.form-label {
46    margin-bottom: 5px;
47    text-align: left;
48}
49 
50input.input-box-330 {
51    width: 250px;
52}
53 
54.sign-up-container .error {
55    color: #ee0000;
56    padding: 0px;
57    background: none;
58    border: #ee0000;
59}
60 
61.sign-up-container .error-field {
62    border: 1px solid #d96557;
63}
64 
65.sign-up-container .error:before {
66    content: '*';
67    padding: 0 3px;
68    color: #D8000C;
69}
70 
71.error-msg {
72    padding-top: 10px;
73    color: #D8000C;
74    text-align: center;
75}
76 
77.success-msg {
78    padding-top: 10px;
79    color: #176701;
80    text-align: center;
81}
82 
83input.btn {
84    width: 250px
85}
86 
87.signup-align {
88    margin: 0 auto;
89}
90 
91.page-content {
92    font-weight: bold;
93    padding-top: 60px;
94    text-align: center;
95}

Output

User Login and Registration in PHP — User Registration Output

Login Page

1<?php
2use tutorial\Member;
3 
4if (! empty($_POST["login-btn"])) {
5    require_once __DIR__ . '/Model/Member.php';
6    $member = new Member();
7    $loginResult = $member->loginMember();
8}
9?>
10<HTML>
11<HEAD>
12<TITLE>https://sarveshpathak.com/</TITLE>
13<link href="assets/css/tutorial-style.css" type="text/css"
14    rel="stylesheet" />
15<link href="assets/css/user-registration.css" type="text/css"
16    rel="stylesheet" />
17<script src="vendor/jquery/jquery-3.3.1.js" type="text/javascript"></script>
18</HEAD>
19<BODY>
20    <div class="tutorial-container">
21        <div class="sign-up-container">
22            <div class="login-signup">
23                <a href="user-registration.php">Sign up</a>
24            </div>
25            <div class="signup-align">
26                <form name="login" action="" method="post"
27                    onsubmit="return loginValidation()">
28                    <div class="signup-heading">Login</div>
29                <?php if(!empty($loginResult)){?>
30                <div class="error-msg"><?php echo $loginResult;?></div>
31                <?php }?>
32                <div class="row">
33                        <div class="inline-block">
34                            <div class="form-label">
35                                Enter Your Username<span class="required error" id="username-info"></span>
36                            </div>
37                            <input class="input-box-330" type="text" name="username"
38                                id="username">
39                        </div>
40                    </div>
41                    <div class="row">
42                        <div class="inline-block">
43                            <div class="form-label">
44                                Enter Your Password<span class="required error" id="login-password-info"></span>
45                            </div>
46                            <input class="input-box-330" type="password"
47                                name="login-password" id="login-password">
48                        </div>
49                    </div>
50                    <div class="row">
51                        <input class="btn" type="submit" name="login-btn"
52                            id="login-btn" value="Login">
53                    </div>
54                    <div class="row">
55                        <div class="inline-block">
56                            <div class="form-label">
57                            https://sarveshpathak.com/
58                            </div>
59                             
60                        </div>
61                    </div>
62                </form>
63            </div>
64        </div>
65    </div>
66 
67    <script>
68function loginValidation() {
69    var valid = true;
70    $("#username").removeClass("error-field");
71    $("#password").removeClass("error-field");
72 
73    var UserName = $("#username").val();
74    var Password = $('#login-password').val();
75 
76    $("#username-info").html("").hide();
77 
78    if (UserName.trim() == "") {
79        $("#username-info").html("required.").css("color", "#ee0000").show();
80        $("#username").addClass("error-field");
81        valid = false;
82    }
83    if (Password.trim() == "") {
84        $("#login-password-info").html("required.").css("color", "#ee0000").show();
85        $("#login-password").addClass("error-field");
86        valid = false;
87    }
88    if (valid == false) {
89        $('.error-field').first().focus();
90        valid = false;
91    }
92    return valid;
93}
94</script>
95</BODY>
96</HTML>

User Login Output

Create a Model for the User Registration and Login

1<?php
2namespace tutorial;
3 
4class Member
5{
6 
7    private $ds;
8 
9    function __construct()
10    {
11        require_once __DIR__ . '/../lib/DataSource.php';
12        $this->ds = new DataSource();
13    }
14 
15    public function isUsernameExists($username)
16    {
17        $query = 'SELECT * FROM tbl_users where username = ?';
18        $paramType = 's';
19        $paramValue = array(
20            $username
21        );
22        $resultArray = $this->ds->select($query, $paramType, $paramValue);
23        $count = 0;
24        if (is_array($resultArray)) {
25            $count = count($resultArray);
26        }
27        if ($count > 0) {
28            $result = true;
29        } else {
30            $result = false;
31        }
32        return $result;
33    }
34 
35    
36    public function isEmailExists($email)
37    {
38        $query = 'SELECT * FROM tbl_users where email = ?';
39        $paramType = 's';
40        $paramValue = array(
41            $email
42        );
43        $resultArray = $this->ds->select($query, $paramType, $paramValue);
44        $count = 0;
45        if (is_array($resultArray)) {
46            $count = count($resultArray);
47        }
48        if ($count > 0) {
49            $result = true;
50        } else {
51            $result = false;
52        }
53        return $result;
54    }
55 
56    
57    public function registerMember()
58    {
59        $isUsernameExists = $this->isUsernameExists($_POST["username"]);
60        $isEmailExists = $this->isEmailExists($_POST["email"]);
61        if ($isUsernameExists) {
62            $response = array(
63                "status" => "error",
64                "message" => "Username already exists."
65            );
66        } else if ($isEmailExists) {
67            $response = array(
68                "status" => "error",
69                "message" => "Email already exists."
70            );
71        } else {
72            if (! empty($_POST["signup-password"])) {
73 
74                
75                $hashedPassword = password_hash($_POST["signup-password"], PASSWORD_DEFAULT);
76            }
77            $query = 'INSERT INTO tbl_users (username, password, email) VALUES (?, ?, ?)';
78            $paramType = 'sss';
79            $paramValue = array(
80                $_POST["username"],
81                $hashedPassword,
82                $_POST["email"]
83            );
84            $memberId = $this->ds->insert($query, $paramType, $paramValue);
85            if (! empty($memberId)) {
86                $response = array(
87                    "status" => "success",
88                    "message" => "You have registered successfully."
89                );
90            }
91        }
92        return $response;
93    }
94 
95    public function getMember($username)
96    {
97        $query = 'SELECT * FROM tbl_users where username = ?';
98        $paramType = 's';
99        $paramValue = array(
100            $username
101        );
102        $memberRecord = $this->ds->select($query, $paramType, $paramValue);
103        return $memberRecord;
104    }
105 
106    
107    public function loginMember()
108    {
109        $memberRecord = $this->getMember($_POST["username"]);
110        $loginPassword = 0;
111        if (! empty($memberRecord)) {
112            if (! empty($_POST["login-password"])) {
113                $password = $_POST["login-password"];
114            }
115            $hashedPassword = $memberRecord[0]["password"];
116            $loginPassword = 0;
117            if (password_verify($password, $hashedPassword)) {
118                $loginPassword = 1;
119            }
120        } else {
121            $loginPassword = 0;
122        }
123        if ($loginPassword == 1) {
124           
125            session_start();
126            $_SESSION["username"] = $memberRecord[0]["username"];
127            session_write_close();
128            $url = "./home.php";
129            header("Location: $url");
130        } else if ($loginPassword == 0) {
131            $loginStatus = "Invalid username or password.";
132            return $loginStatus;
133        }
134    }
135}

Data Base Config

This class is a wrapper for MySQL / mysqli with PreparedStatement for User Login and Registration in PHP example. You can use it in any of your PHP projects to connect with databases. It is available in the download source code linked at the end of this tutorial.

1<?php
2 
3namespace tutorial;
4 
5 
6class DataSource
7{
8 
9 
10    const HOST = 'localhost';
11 
12    const USERNAME = 'root';
13 
14    const PASSWORD = '201819';
15 
16    const DATABASENAME = 'tutorial';
17 
18    private $conn;
19 
20 
21    function __construct()
22    {
23        $this->conn = $this->getConnection();
24    }
25 
26 
27    public function getConnection()
28    {
29        $conn = new \mysqli(self::HOST, self::USERNAME, self::PASSWORD, self::DATABASENAME);
30 
31        if (mysqli_connect_errno()) {
32            trigger_error("Problem with connecting to database.");
33        }
34 
35        $conn->set_charset("utf8");
36        return $conn;
37    }
38 
39 
40    public function getPdoConnection()
41    {
42        $conn = FALSE;
43        try {
44            $dsn = 'mysql:host=' . self::HOST . ';dbname=' . self::DATABASENAME;
45            $conn = new \PDO($dsn, self::USERNAME, self::PASSWORD);
46            $conn->setAttribute(\PDO::ATTR_ERRMODE, \PDO::ERRMODE_EXCEPTION);
47        } catch (\Exception $e) {
48            exit("PDO Connect Error: " . $e->getMessage());
49        }
50        return $conn;
51    }
52 
53 
54    public function select($query, $paramType = "", $paramArray = array())
55    {
56        $stmt = $this->conn->prepare($query);
57 
58        if (!empty($paramType) && !empty($paramArray)) {
59 
60            $this->bindQueryParams($stmt, $paramType, $paramArray);
61        }
62        $stmt->execute();
63        $result = $stmt->get_result();
64 
65        if ($result->num_rows > 0) {
66            while ($row = $result->fetch_assoc()) {
67                $resultset[] = $row;
68            }
69        }
70 
71        if (!empty($resultset)) {
72            return $resultset;
73        }
74    }
75 
76 
77    public function insert($query, $paramType, $paramArray)
78    {
79        $stmt = $this->conn->prepare($query);
80        $this->bindQueryParams($stmt, $paramType, $paramArray);
81 
82        $stmt->execute();
83        $insertId = $stmt->insert_id;
84        return $insertId;
85    }
86 
87 
88    public function execute($query, $paramType = "", $paramArray = array())
89    {
90        $stmt = $this->conn->prepare($query);
91 
92        if (!empty($paramType) && !empty($paramArray)) {
93            $this->bindQueryParams($stmt, $paramType, $paramArray);
94        }
95        $stmt->execute();
96    }
97 
98 
99    public function bindQueryParams($stmt, $paramType, $paramArray = array())
100    {
101        $paramValueReference[] = &$paramType;
102        for ($i = 0; $i < count($paramArray); $i++) {
103            $paramValueReference[] = &$paramArray[$i];
104        }
105        call_user_func_array(array(
106            $stmt,
107            'bind_param'
108        ), $paramValueReference);
109    }
110 
111 
112    public function getRecordCount($query, $paramType = "", $paramArray = array())
113    {
114        $stmt = $this->conn->prepare($query);
115        if (!empty($paramType) && !empty($paramArray)) {
116 
117            $this->bindQueryParams($stmt, $paramType, $paramArray);
118        }
119        $stmt->execute();
120        $stmt->store_result();
121        $recordCount = $stmt->num_rows;
122 
123        return $recordCount;
124    }
125}

Logout

This is the logout script for User Login and Registration in PHP.. You can use it in any of your PHP projects. It clears the complete user session and redirects the user to the index page.

1<?php
2// clear all the session variables and redirect to index
3session_start();
4session_unset();
5session_write_close();
6$url = "./index.php";
7header("Location: $url");?>

MySQL database script

This is the script to create a table with five collum for this example of User Login and Registration in PHP. You can add more collum as per your requirement.

1Table structure for table `tbl_users`
2--
3 
4CREATE TABLE `tbl_users` (
5  `id` int(11) NOT NULL,
6  `username` varchar(255) NOT NULL,
7  `password` varchar(200) NOT NULL,
8  `email` varchar(255) NOT NULL,
9  `create_at` timestamp NOT NULL DEFAULT current_timestamp() ON UPDATE current_timestamp()
10) ENGINE=InnoDB DEFAULT CHARSET=latin1;
11ALTER TABLE `tbl_users`
12  ADD PRIMARY KEY (`id`);
13 
14--
15-- AUTO_INCREMENT for dumped tables
16--
17 
18--
19-- AUTO_INCREMENT for table `tbl_users`
20--
21ALTER TABLE `tbl_users`
22  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=2;
23COMMIT;

Home.php

1<?php
2session_start();
3if (isset($_SESSION["username"])) {
4    $username = $_SESSION["username"];
5    session_write_close();
6} else {
7     
8    session_unset();
9    session_write_close();
10    $url = "./index.php";
11    header("Location: $url");
12}
13 
14?>
15<HTML>
16<HEAD>
17<TITLE>https://sarveshpathak.com/</TITLE>
18<link href="assets/css/tutorial-style.css" type="text/css"
19    rel="stylesheet" />
20<link href="assets/css/user-registration.css" type="text/css"
21    rel="stylesheet" />
22</HEAD>
23<BODY>
24    <div class="tutorial-container">
25        <div class="page-header">
26            <span class="login-signup"><a href="logout.php">Logout</a></span>
27        </div>
28        <div class="page-content">Welcome <?php echo $username;?></div>
29    </div>
30</BODY>
31</HTML>

index.php

1 <?php

`2`	`require_once __DIR__ . "/login.php";`

Download Source Code

About Post Author

Admin

See author's posts

Tags: Login and Registration in PHP PHP

Admin

How to Insert PHP Array into MySQL Database Download free source code.

PHP Array

Integrate Sweetalert 2 in PHP & MySQL Using Ajax Download Free Example

Youtube

Recent Posts

User Registration

user-registration.php

User Registration CSS

Output

Login Page

User Login Output

Create a Model for the User Registration and Login

Data Base Config

Logout

MySQL database script

Home.php

index.php

Download Source Code

About Post Author

Admin

More Stories

How to Insert PHP Array into MySQL Database Download free source code.

PHP Array

Integrate Sweetalert 2 in PHP & MySQL Using Ajax Download Free Example

Leave a Reply Cancel reply

Categories

Recent Posts

Pouplar Tags