How to create simple login form using Php, Mysql and jQuery

In this post I am going to create simple login form using Php, Mysql and jquery. What I am going to do is, First of all I will create login form using email and password field, then I fill that form.

If I add correct email and password then I will login otherwise wrong email and password message will appear. I will also add some jquery validation for checking my client side errors. I will check all my code on local server using Xampp software. If you don’t know how to install xampp on local machine, then check my previous post. Now lets start

Steps to follow

  • Create database and table
  • Create config file and connect to database
  • Create HTML file and add php logic
  • Create Css file
  • Create jQuery file for client side validation

Step 1: Create database and table

Goto localhost/phpmyadmin and create database as ‘my_website’ and then create table ‘user_table’ in my_website database. Once table is created add single dummy record for testing.

Step 2: Create config file and connect to database

Now its time to create database connection file name as “config.php”.

For database connection and queries I am using MySQLi built-in class. I have also covered tutorial on MySQLi Object Oriented for beginners.

Step 3: Create HTML file and add php logic

Now, I am creating login.php file.In this file I will add config.php file, setup login condition, validate user, add logout code, include css file for html, add google jquery and custom js validation file and most important login form.

Never store plain password in database. Below code is just an example for absolute beginners. For better understanding for password read my post How to use PHP password_hash in Registration and Login form

Step 4: Create Css file

Now I am going to add css for html

Step 5: Create jQuery file for client side validation

If you will follow all steps one by one I hope you won’t have any problem.

use user@example.com as email and pass123 as password

 

Posted in PHP

Leave a Reply

Your email address will not be published. Required fields are marked *