Membuat login sederhana di simdes

- April 26, 2017

A. Pengertian

SIMDES adalah program aplikasi komputer yang berbasis desktop yang dapat digunakan oleh kantor kelurahan maupun kabupaten, untuk mencatat data kependudukan mulai informasi Kartu Keluarga, kematian warga, kelahiran dan surat pengantar. Aplikasi SIMDES ini dibuat dengan menggunakan bahasa pemrograman PHP, MySql, serta Twitter Bootstraps untuk desain yang responsive dan menarik.

B. Latar Belakang

Karena simdes sangat mudah di masuki orang sehingga tinggkat keamanannya kurang

C. Alat dan Bahan

1. Pc/Laptop

2. Koneksi Internet

D. Jangka Waktu

15 menit

E. Tahap Pelaksanaan

1. Pertama buat database login nya terlebih dahulu

2. Buka terminal, masuk sebagai super user(root)

3. Kemudian masuk ke direktory simdes dengan perintah

#cd /var/www/html/simdes

4. Lalu buat folder login nya

#mkdir login

5. Masuk ke direktory login

#cd login/

6. Untuk menambahkan skrip , ketikan perintah

#nano index.php

7. Kemudian tambahkan skrip dengan mengcopy skrip di bawah ini.

<!DOCTYPE html>
<html>
<head>
<title>Login Sederhana Dengan MySqli</title>
<style>
.form {
margin: 10% 0 0 25%;
float: left;
width: 60%;
}
.input {
padding: 1%;
color: #777777;
font-size: 14pt;
float: left;
width: 80%;
margin-bottom: 1%;
}
.submit {
padding: 1%;
color: #fff;
background-color: #11b022;
font-size: 14pt;
font-family: Times New Roman;
float: left;
width: 25%;
}
.welcome {
color: #11bb22;
font-size: 20pt;
font-weight: 900;
font-family: Centaur;
}

</style>
</head>
<body>

<div class="form">
<span class="welcome">Harap Login Terlebih Dahulu !</span>
<form action="login.php" method="post">
<input class="input" type="text" name="username" placeholder="Username">
<input class="input" type="text" name="password" placeholder="Password">
<input class="submit" type="submit" value="Login">
</form>
</div>
</body>
</html>

8. Masukan skrip lagi dengan perintah

#nano connect.php

9. Copy skrip di bawah ini untuk connect.php

$host = 'localhost';
$user = 'root';
$pass = '';
$db = 'loginmysqli';

$connect = new mysqli($host, $user, $pass, $db);
if($connect->connect_error){
echo 'Terjadi Kesalahan';
}

?>

10. Konfigurasi login.php dengan perintah

#nano login.php

11. Masukan scrip di bawah ini

<?php
include 'connect.php';

$username = $_POST['username'];
$password = $_POST['password'];

$query = "SELECT * FROM admin WHERE username = '$username' AND password = '$password'";
$runquery = $connect->query($query);

if($runquery->num_rows > 0){
session_start();
$_SESSION['username'] = $username;
header("Location: home.php");
} else {
echo '<h1>
Username atau Kata Sandi Salah!</h1>
';
}

?>

12. Konfigurasi pada home.php

#nano home.php

13. Lalu tambahkan skrip di bawah

<?php
session_start();
if(!isset($_SESSION['username'])) {
header("Location: index.php?access_denied");
}

?>

<!DOCTYPE html>
<html>
<head>
<title>Halaman Admin</title>
<style>
.welcome {
color: #11bb22;
font-size: 35pt;
font-weight: 900;
font-family: Centaur;
}
</style>
</head>
<body>

<h1 class="welcome">
Selamat Datang <?php echo $_SESSION['username']; ?>!</h1>
<a href="logout.php">Log Out >></a>

</body>
</html>