Cara Membuat Web Dinamis Sederhana(Sistem Login dan Logout) Bagian 2

Untuk melanjutkan postingan sebelumnya mengenai cara membuat web dinamis sederhana, Kali ini saya akan posting cara membuat Sistem login untuk admin.
Pertama anda harus membuat database untuk admin, seperti yang sudah ada di postingan sebelumnya

1. Buka XAMPP lalu aktifkan Apache dan Mysql, lalu ketikkan di URL Browser : localhost/phpmyadmin Setelah muncul laman phpmyadmin, pertama anda buat database dengan nama db_web, lalu buat table untuk admin ketikkan kode di bawah ini di tab SQL :

create table admin (
username varchar(15) not null primary key,
password varchar(35) not null,
level varchar(15) not null
)

lalu insert data dengan :

username : admin

password : admin (md5)

level : admin

* untuk password input dengan enksripsi md5 agar lebih aman

setelah berhasil membuat tabel admin, lalu kita akan membuat koneksi menuju databasenya

2. buat folder di dalam htdocs dan beri nama web lalu buka notepad (disarankan notepad ++) lalu ketikkan kode di bawah ini dan Simpan di folder htdocs/web dengan nama koneksi.php:

<?php
$server= “localhost”;
$username = “root”;
$password = “”;
$database = “db_web”;

mysql_connect($server,$username,$password) or die (“Koneksi Gagal”);

mysql_select_db($database) or die (“Database Tidak Bisa Di Buka ” );

?>

3. selanjutnya kita membuat form untuk login, ketikkan kode dibawah ini dan Simpan di folder htdocs/web dengan nama index.php:

<?php
session_start();
if (isset($_SESSION[‘username’])){
echo”Anda Telah Login, Silahkan masuk ke <a href=’admin.php’>Admin</a><br>Jika Anda Ingin Logout <a href=’logout.php’>Klik Di Sini</a>”
?>

<?php
}else{
?>
<html>
<title>Login Admin</title>
<style type=”text/css”>
<!–
.judul {
background-color: #00FF00;
}
–>
</style>
<body bgcolor=”black”>
<style type=”text/css”>
<!–
.style2 {color: #166D12}
–>
</style>
<div align=”center”>
<p> </p>
<h1 class=”judul”><strong>—>LOGIN ADMIN<—</strong></h1>
<br /><br />
<form method=”post” action=”login.php”>
<table width=”329″ height=”198″ border=”0″ align=”center” bgcolor=”#00FF00″>
<tr>
<th width=”24″ rowspan=”3″ scope=”row”> </th>
<th height=”35%” colspan=”3″ scope=”row”> </th>
<td width=”22″ rowspan=”3″> </td>
</tr>
<tr>
<th width=”85″ height=”45″ scope=”row”> <div align=”left”>Username</div></th>
<td width=”15″>:</td>
<td width=”161″>
<input type=”text” name=”username” /></td>
</tr>
<tr>
<th height=”47″ scope=”row”><div align=”left”>Password</div></th>
<td>:</td>
<td><input type=”password” name=”password” /></td>
</tr>
<tr>
<th height=”45″ colspan=”5″ scope=”row”>
<input type=”submit” name=”Submit” value=”Login” />
<input name=”reset” type=”reset” value=”Reset” /></th>
</tr>
<tr>
<th height=”27″ colspan=”5″ scope=”row”> </th>
</tr>
</table>
</form>
</div>
</body>
</html>
<?php
}
?>

4. Selanjutnya kita akan membuat kode untuk mengecek data admin (username dan password) , ketikkan kode di bawah ini dan Simpan di folder htdocs/web dengan nama login.php:

<?php session_start();
ob_start();
include “koneksi.php”;
$username = $_POST[‘username’];
$pass = md5($_POST[‘password’]);

$login=mysql_query(“SELECT * FROM admin WHERE username=’$username’ AND password=’$pass'”);
$ketemu = mysql_num_rows($login);
$r=mysql_fetch_array($login);

if ($ketemu > 0) {

$_SESSION[username] = $r[username];

$_SESSION[password] = $r[password];

$_SESSION[level]= $r[level];
header(‘location:admin.php’);
}else{
?><script>alert(“Login gagal!”);document.location.href=”index.php”</script>
<?php
echo mysql_error();
}
?>

5. Selanjutnya kita membuat halaman admin jika berhasil login akan muncul halaman ini, ketikkan kode dibawah ini dan Simpan di folder htdocs/web dengan nama admin.php:

<h1> Anda Berhasil Login </h1>
<br>Jika Anda Ingin Logout <a href=’logout.php’>Klik Di Sini</a>

6. Selanjutnya kita akan membuat logout ketikkan kode dibawah ini dan Simpan di folder htdocs/web dengan nama logout.php:

<?php session_start(); ob_start();
session_destroy();
header(‘location:index.php’);
?>

Jika berhasil logout anda akan langsung menuju halaman form login..

7. yang terakhir kita akan membuat proteksi untuk hal. admin, jika user tidak login dan mengakses langsung dari url address maka akan langsung di alihkan ke halaman login..

ketikkan kode dibawah ini dan Simpan di folder htdocs/web dengan nama proteksi.php:

<?php
if (!isset($_SESSION)) {
session_start();
}
if(isset($_SESSION[‘username’])){
}
else{

header(“location:index.php”);
}
?>

lalu tinggal panggil file proteksi.php di halaman admin.php :

<?php include “proteksi.php”; ?>
<h1> Anda Berhasil Login </h1>
<br>Jika Anda Ingin Logout <a href=’logout.php’>Klik Di Sini</a>

Sekian tutorial sederhana ini, jika ada yang di tanyakan silahkan beri komentar 🙂
semoga saya bisa menjawab :v
Postngan selanjutnya saya akan membuat Input, Edit dan Delete data pada tabel…

#SelamatMencoba

* sori gan, ane tidak bisa membalas komen satu persatu, jika ada pertanyaan silahkan hubungi wa ane ada di CONTACT ME makasih..

Source: New feed