Codeigniter Login &logout system. We would love to share with you how to create login and logout system in codeigniter. You will learn in this tutorial how to authenticate users by it’s credential.
In Every website wants to login our users for some activity. Without login users can not do something in any website, because they want to login our users in website.
In otherwords, Login script is used to provide the authentication for our web pages.
Codeigniter Login
Contents
- Download Codeigniter Latest
- Basic Configurations
- Create Database With Table
- Setup Database Credentials
- Make New Controller
- Create Views
- Start Development server
- Conclusion
Download Codeigniter Project
In this step we will download the latest version of Codeigniter, Go to this link Download Codeigniter download the fresh setup of codeigniter and unzip the setup in your local system xampp/htdocs/ . And change the download folder name “demo”
Basic Configurations
Next we will set the some basic configuration on config.php file, so let’s go to application/config/config.php and open this file on text editor.
Set Base URL like this
$config['base_url'] = 'http://localhost/demo';
Create Database With Table
In this step, we need to create database name demo, so let’s open your phpmyadmin and create the database with the name demo . After successfully create a database, you can use the below sql query for creating a table in your database.
CREATE TABLE IF NOT EXISTS users(
id int(10) unsigned NOT NULL auto_increment,
user_name varchar(150) collate latin1_general_ci NOT NULL,
password varchar(100) collate latin1_general_ci NOT NULL,
first_name varchar(45) collate latin1_general_ci NOT NULL,
last_name varchar(45) collate latin1_general_ci NOT NULL,
PRIMARY KEY (id)
);
Setup Database Credentials
In this step, We need to connect our project to database. we need to go application/config/ and open database.php file in text editor. After open the file in text editor, We need to setup database credential in this file like below.
$db['default'] = array( 'dsn' => '', 'hostname' => 'localhost', 'username' => 'root', 'password' => '', 'database' => 'demo', 'dbdriver' => 'mysqli', 'dbprefix' => '', 'pconnect' => FALSE, 'db_debug' => (ENVIRONMENT !== 'production'), 'cache_on' => FALSE, 'cachedir' => '', 'char_set' => 'utf8', 'dbcollat' => 'utf8_general_ci', 'swap_pre' => '', 'encrypt' => FALSE, 'compress' => FALSE, 'stricton' => FALSE, 'failover' => array(), 'save_queries' => TRUE );
Create Controller
Now we need to create a controller name Auth.php. In this controller we will create some method/function. We will build some of the methods like :
- Index() – This is used to showing a login form
- post_login() – This function authenticates user credentials and starts moving forward
- logout() – It is used to destroy the built-in session
- dashboard – After successfully logging in, the user can redirect this method
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Auth extends CI_Controller {
public function __construct()
{
parent::__construct();
$this->load->model('Form_model');
$this->load->library(array('form_validation','session'));
$this->load->helper(array('url','html','form'));
$this->user_id = $this->session->userdata('user_id');
}
public function index()
{
$this->load->view('login');
}
public function post_login()
{
$this->form_validation->set_rules('email', 'Email', 'required');
$this->form_validation->set_rules('password', 'Password', 'required');
$this->form_validation->set_error_delimiters('<div class="error">', '</div>');
$this->form_validation->set_message('required', 'Enter %s');
if ($this->form_validation->run() === FALSE)
{
$this->load->view('login');
}
else
{
$data = array(
'email' => $this->input->post('email'),
'password' => md5($this->input->post('password')),
);
$check = $this->Form_model->auth_check($data);
if($check != false){
$user = array(
'user_id' => $check->id,
'email' => $check->email,
'first_name' => $check->first_name,
'last_name' => $check->last_name
);
$this->session->set_userdata($user);
redirect( base_url('dashboard') );
}
$this->load->view('login');
}
}
public function logout(){
$this->session->sess_destroy();
redirect(base_url('auth'));
}
public function dashboard(){
if(empty($this->user_id)){
redirect(base_url('auth'));
}
$this->load->view('dashboard');
}
}
Create Model
Next step Go to models and create Form_model.php, We need to create Form_model.php file for checking the credential from database. This file contain business logic for login. So puth below code inside this file.
<?php
class Form_model extends CI_Model {
public function __construct()
{
$this->load->database();
}
public function auth_check($data)
{
$query = $this->db->get_where('users', $data);
if($query){
return $query->row();
}
return false;
}
}
Create Views
Now we need to create views for showing login form also showing dashbaord. So now create first view name login.php and put the below html in this file.
<html>
<head>
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
<title>Sign in</title>
</head>
<style type="text/css">
body {
background-color: #F3EBF6;
font-family: 'Ubuntu', sans-serif;
}
div.error {
margin-bottom: 15px;
margin-top: -6px;
margin-left: 58px;
color: red;
}
.main {
background-color: #FFFFFF;
width: 400px;
height: 400px;
margin: 7em auto;
border-radius: 1.5em;
box-shadow: 0px 11px 35px 2px rgba(0, 0, 0, 0.14);
}
.sign {
padding-top: 40px;
color: #8C55AA;
font-family: 'Ubuntu', sans-serif;
font-weight: bold;
font-size: 23px;
}
.un {
width: 76%;
color: rgb(38, 50, 56);
font-weight: 700;
font-size: 14px;
letter-spacing: 1px;
background: rgba(136, 126, 126, 0.04);
padding: 10px 20px;
border: none;
border-radius: 20px;
outline: none;
box-sizing: border-box;
border: 2px solid rgba(0, 0, 0, 0.02);
margin-bottom: 50px;
margin-left: 46px;
text-align: center;
margin-bottom: 27px;
font-family: 'Ubuntu', sans-serif;
}
form.form1 {
padding-top: 40px;
}
.pass {
width: 76%;
color: rgb(38, 50, 56);
font-weight: 700;
font-size: 14px;
letter-spacing: 1px;
background: rgba(136, 126, 126, 0.04);
padding: 10px 20px;
border: none;
border-radius: 20px;
outline: none;
box-sizing: border-box;
border: 2px solid rgba(0, 0, 0, 0.02);
margin-bottom: 50px;
margin-left: 46px;
text-align: center;
margin-bottom: 27px;
font-family: 'Ubuntu', sans-serif;
}
.un:focus, .pass:focus {
border: 2px solid rgba(0, 0, 0, 0.18) !important;
}
.submit {
cursor: pointer;
border-radius: 5em;
color: #fff;
background: linear-gradient(to right, #9C27B0, #E040FB);
border: 0;
padding-left: 40px;
padding-right: 40px;
padding-bottom: 10px;
padding-top: 10px;
font-family: 'Ubuntu', sans-serif;
margin-left: 35%;
font-size: 13px;
box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.04);
}
.forgot {
text-shadow: 0px 0px 3px rgba(117, 117, 117, 0.12);
color: #E1BEE7;
padding-top: 15px;
}
button {
text-shadow: 0px 0px 3px rgba(117, 117, 117, 0.12);
color: #E1BEE7;
text-decoration: none
}
@media (max-width: 600px) {
.main {
border-radius: 0px;
}
</style>
<body>
<div class="main">
<p class="sign" align="center">Sign in</p>
<form action="<?php echo base_url('auth/post_login') ?>" method="post" accept-charset="utf-8">
<input class="un " type="text" align="center" name="email" placeholder="email">
<?php echo form_error('email'); ?>
<input class="pass" type="password" align="center" name="password" placeholder="Password">
<?php echo form_error('password'); ?>
<button type="submit" align="center" class="submit">Sign in</button>
</form>
</div>
</body>
</html>
Now we need to create dashboard.php, After login user can redirect this page. So create dashboard.php and put the below html here.
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<h3>Login Successful <?=$this->session->userdata('first_name')?> <?=$this->session->userdata('last_name')?></h3>
<a href="<?= base_url();?>auth/logout">Logout</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Start Development server
For start development server, Go to the browser and hit below the url.
http://localhost/demo/auth
Conclusion
In this codeigniter login and logout tutorial – we have created a login form with its functionality. We have certified users using authentication. After successfully being authenticate, the users redirect to the dashboard page.
If you have any questions or thoughts to share, use the comment form below to reach us.
Hello, tutsmake, i really love your tutorials, would you kindly do a tutorial on roles and permissions using codeigniter, thanks in advance.
Thank you so much , very helpful login & logout concept.