Tutorial PHP

Tutorial Membuat Form Login Dengan PHP & bootstrap

Tutorial Membuat Form Login Dengan PHP

Tutorial Tutorial Membuat Form Login Dengan PHPini membahas bagaimana Develindo.com membuat form login menggunakan PHP. Form login pada dasarnya adalah sebuah form untuk mengecek apakah data anda sudah terdapat di database sistem atau belum, jika sudah terdapat data yang sama maka anda akan diperbolehkan masuk namun sebaliknya jika tidak maka anda tidak berhak masuk ke sistem. Beberapa halaman yang menerapkan login merupakan sistem yang bersifat private atau hanya anda yang dapat mengelola.

Contoh script login sederhana dengan menggunakan PHP dan Bootstrap dapat anda praktikan dibawah ini.
>> lihat demo <<
Buat database dan tabel sesuai kebutuhan anda.

Dicontoh ini terdapat database dengan nama praktek dan tabel bernama tb_siswa

Database diatas hanya contoh, dapat anda gunakan database yang telah anda buat sendiri.



Langkah selanjutnya buatlah script koneksi.php untuk mengkoneksikan dengan server

koneksi.php
 

<?php
//set time zone location sesuai negara, jadikan Asia Jakarta
date_default_timezone_set('Asia/Jakarta');
//set koneksi ke server sesuai host, user, password dan database
$server="localhost";
$user="root";
$pass="";
$database="praktek";
mysql_connect($server,$user,$pass)
 or die('Koneksi Ke database Error'); //mengkoneksikan dengan server 
jika tidak akan muncul pesan error
mysql_select_db($database) or 
die('Database Tidak Ditemukan');   //mengkoneksikan dengan database jika
 tidak akan muncul pesan database tidak ada
?>



Langkah selanjutnya buat file index.php untuk menampilkan form login.

index.php
 

<?php
error_reporting(0);
session_start();
include "koneksi.php";
//fungsi anti injeksi pencegah injeksi sql dari hacker
function antiinjection($data){
    $filter_sql = mysql_real_escape_string(stripslashes(strip_tags(htmlspecialchars($data,ENT_QUOTES))));
   return $filter_sql;
 }
    $nama =  antiinjection($_POST['nama']);
    $nisn =  antiinjection($_POST['nisn']);
  if(isset($_POST['login'])){
    if($nama == ""){
    $er_nama="<p class='help-block bg-danger'>Masukan Nama Anda !</p>";
    }
    elseif($nisn == ""){
    $er_nisn="<p class='help-block bg-danger'>Masukan Nisn Anda !</p>";
    }
    else{
        //ambil data dari tb_siswa cocokan dengan inputan nama dan nisn
    $select=mysql_query("select*from tb_siswa where nisn='$nisn' and nama_siswa='$nama'") or die(mysql_error());
    $cek=mysql_num_rows($select);
    if($cek){
        //jika data tersedia arahkan ke halaman admin
        $_SESSION['sesi_nama'] = $nama;
        $_SESSION['sesi_nisn'] = $nisn;
    $er_log="<h2 class='text-center bg-success'>Login Berhasil (Arahkan Ke Halaman Admin)</h2>";
    //echo "<script>document.location='home/'</script>";
    }else{
        //jika gagal muncul pesan ini
    $er_log="<h2 class='text-center bg-danger'>Login Gagal</h2>";
    }
   }
 }
?>
<!DOCTYPE html>
 <html>
      <head>
           <title>Membuat Form Login Admin Dengan PHP - Develindo.com</title>
           <!-- Bootstrap core CSS -->
           <link href="css/bootstrap.css" rel="stylesheet">
           <!-- Bootstrap core JavaScript-->
           <script src="js/jquery.min.js"></script>
           <script src="js/bootstrap.js"></script>
      </head>
      <body>
           <br /><br />
           <div class="container" style="width:800px;">
                <h2 align="center">Membuat Form Login Dengan PHP</h2>
                <br /><br />
            <div class="container" style="width:400px; border:#999 solid 1px; background:#F5F5F5;">
                <div class="text-center">
                    <h2>Login Siswa</h2>
                    <h4>Develindo.com</h4>
                    </div>
                    <?php echo $er_log;?>
                <form class="sign-in-form" role="form" action="" method="post">
                    <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon">Nama</span>
                       
 <input name="nama" class="form-control" placeholder="Nama Lengkap" 
type="text" maxlength="25" value="<?php echo 
$_POST['nama'];?>">
                        </div>
                        <?php echo $er_nama;?>
                    </div>
                    <div class="form-group">
                     <div class="input-group">
                        <span class="input-group-addon">NISN</span>
                       
 <input name="nisn" class="form-control" placeholder="NISN" 
type="text" maxlength="15" value="<?php echo 
$_POST['nisn'];?>">
                        </div>
                        <?php echo $er_nisn;?>
                    </div>
                    <button type="submit" name="login" class="btn btn-danger btn-block">Login Masuk</button>
                </form>
                <div class="text-center">
                    <small>Sesuaikan dengan kebetuhan anda | Develindo.com</small><br>
                    <small>Login Gunakan Nama : Abdul Khodir , NISN : 1442121233</small>
                </div>
            </div>
        </div>
      </body>
 </html>



Silahkan anda cermati struktur dari script index.php.
Login diatas hanya sekedar contoh dengan menggunakan Nama Siswa dan NISN siswa. Anda dapat menggantinya dengan Email atau Password.

>> download project <<
Selamat Mencoba.

Download Source Code Preview Demo

Develindo Web | Tutorial Pemrograman Website