jQuery & PHP Powered User Manager

Posted on July 26th, 2015. Written by Dave.

Here is a brief tutorial on how to create a simple and secure jQuery, MySQL & PHP user manager.

Before we start here is the final product.

This script and tutorial is for beginners to PHP and jQuery an is created to give an idea of how to go about creating a modern and secure user system.

A few features of the user manager are

• Unobtrusive Ajax login box.
• Modern CSS3 styling.
• Tiny size (Just 8kb)
• Slick Ajax backend.
• Loads More..

This script uses a MySQL database to store user information and the necessary SQL is as follows :

CREATE TABLE IF NOT EXISTS `users` (
  `id` int(5) NOT NULL AUTO_INCREMENT,
  `username` varchar(50) NOT NULL,
  `password` varchar(50) NOT NULL,
  `email` varchar(50) NOT NULL,
  `reg_date` date NOT NULL,
  `confirm_code` int(50) NOT NULL,
  KEY `id` (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1;

From here on I won’t be posting any further code as to really understand how the system works you should download

the source files and have a look.

The Login

First we’ll look at the login section. This section consists of 2 files, login.php and login_2.php. Login.php houses all the jQuery, CSS styling and HTML while the login_2.php has all the PHP which handles the login data sent from Login.php

The Registration

Login.php also has the registration box which when submitted submits an ajax request to register.php and creates a new user account.

New user registrations can also be done the admin’s user management section.

The Admin Section

Within the user manager is a simple admin section which allows you to quickly add, delete and edit users. This section uses jQuery to make almost all actions smooth and free from page refreshes.

Securing Pages

Adding protection to pages using the script couldn’t be easier, simply add the following PHP code to the top of any page you wish to secure :

<?php secure(); ?>

An example of this can be seen in the index.php file contained in the source files.

Conclusion

I hope you find this script somewhat useful in creating your own user manager and welcome and feedback / question

Dave