SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";
CREATE TABLE `users` (
`id` int(11) NOT NULL,
`name` varchar(70) NOT NULL,
`username` varchar(50) NOT NULL,
`email` varchar(50) NOT NULL,
`password` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
ALTER TABLE `users`
ADD PRIMARY KEY (`id`);
ALTER TABLE `users`
MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=8;
COMMIT;
3. Create file index.php
<?php
//inisialisasi session
session_start();
//mengecek username pada session
if (!isset($_SESSION['username'])) {
$_SESSION['msg'] = 'anda harus login untuk mengakses halaman ini';
header('Location: login.php');
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<body>
<nav class='navbar navbar-expand-lg navbar-dark bg-dark text-light '>
<div class="container">
<a href="index.php" class="navbar-brand">HOME</a>
<button class="navbar-toggler" type="button" data-togle="collapse">
<span class="navbar-toggler-icon"></span>
</button>
<ul class="navbar-nav ml-auto pt-2 pb-2">
<li class="nav-item">
<a href="index.php" class="nav-link text-light">Home</a>
</li>
<li class="nav-item ml-4">
<a href="logout.php" class="nav-link text-light"> Log Out </a>
</li>
</ul>
</div>
</nav>
<div class="jumbotron jumbotron-fluid bg-light" style="height:90vh">
<div class="container">
<h1 class="display-4 text-center mt-4">HOME</h1>
<p class="lead text-center">LOGIN OR REGISTER SUCCESSFULLY ):</p>
</div>
</div>
</body>
<!-- Bootstrap requirement jQuery pada posisi pertama, kemudian Popper.js, dan yang terakhit Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>
4. Create koneksi.php
<?php
$host = 'localhost';
$user = 'root'; // diisi dengan user database kalian biasanya
// defaultnya bernama root jika kita belum
// merubahnya
$password = 'root'; //diisi dengan password database kalian biasanya
// defaultnya kosong
$db = 'regis'; //diisi dengan nama database kalian
$con = mysqli_connect($host, $user, $password, $db) ;
?>
5. Create login.php
<?php
//menyertakan file program koneksi.php pada register
require('koneksi.php');
//inisialisasi session
session_start();
$error = '';
$validate = '';
//mengecek apakah sesssion username tersedia atau tidak jika tersedia maka akan diredirect ke halaman index
if (isset($_SESSION['username'])) header('Location: index.php');
//mengecek apakah form disubmit atau tidak
if (isset($_POST['submit'])) {
// menghilangkan backshlases
$username = stripslashes($_POST['username']);
//cara sederhana mengamankan dari sql injection
$username = mysqli_real_escape_string($con, $username);
// menghilangkan backshlases
$password = stripslashes($_POST['password']);
//cara sederhana mengamankan dari sql injection
$password = mysqli_real_escape_string($con, $password);
//cek apakah nilai yang diinputkan pada form ada yang kosong atau tidak
if (!empty(trim($username)) && !empty(trim($password))) {
//select data berdasarkan username dari database
$query = "SELECT * FROM users WHERE username = '$username'";
$result = mysqli_query($con, $query);
$rows = mysqli_num_rows($result);
if ($rows != 0) {
$hash = mysqli_fetch_assoc($result)['password'];
if (password_verify($password, $hash)) {
$_SESSION['username'] = $username;
header('Location: index.php');
}
//jika gagal maka akan menampilkan pesan error
} else {
$error = 'Register User Gagal !!';
}
} else {
$error = 'Data tidak boleh kosong !!';
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<!-- costum css -->
<link rel="stylesheet" href="style.css">
</head>
<body>
<section class="container-fluid mb-4">
<!-- justify-content-center untuk mengatur posisi form agar berada di tengah-tengah -->
<section class="row justify-content-center">
<section class="col-12 col-sm-6 col-md-4">
<form class="form-container" action="login.php" method="POST">
<h4 class="text-center font-weight-bold"> Sign-In </h4>
<?php if ($error != '') { ?>
<div class="alert alert-danger" role="alert"><?= $error; ?></div>
<?php } ?>
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" id="username" name="username" placeholder="Masukkan username">
</div>
<div class="form-group">
<label for="InputPassword">Password</label>
<input type="password" class="form-control" id="InputPassword" name="password" placeholder="Password">
<?php if ($validate != '') { ?>
<p class="text-danger"><?= $validate; ?></p>
<?php } ?>
</div>
<button type="submit" name="submit" class="btn btn-primary btn-block">Sign In</button>
<div class="form-footer mt-2">
<p> Belum punya account? <a href="register.php">Register</a></p>
</div>
</form>
</section>
</section>
</section>
<!-- Bootstrap requirement jQuery pada posisi pertama, kemudian Popper.js, dan yang terakhit Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>
6. Create logout.php
<?php
session_start(); //inisialisasi session
if(session_destroy()) {//menghapus session
header("Location: index.php"); //jika berhasil maka akan diredirect ke file index.php
}
?>
7. Create register.php
<?php
//menyertakan file program koneksi.php pada register
require('koneksi.php');
//inisialisasi session
session_start();
$error = '';
$validate = '';
//mengecek apakah form registrasi di submit atau tidak
if (isset($_POST['submit'])) {
// menghilangkan backshlases
$username = stripslashes($_POST['username']);
//cara sederhana mengamankan dari sql injection
$username = mysqli_real_escape_string($con, $username);
$name = stripslashes($_POST['name']);
$name = mysqli_real_escape_string($con, $name);
$email = stripslashes($_POST['email']);
$email = mysqli_real_escape_string($con, $email);
$password = stripslashes($_POST['password']);
$password = mysqli_real_escape_string($con, $password);
$repass = stripslashes($_POST['repassword']);
$repass = mysqli_real_escape_string($con, $repass);
//cek apakah nilai yang diinputkan pada form ada yang kosong atau tidak
if (!empty(trim($name)) && !empty(trim($username)) && !empty(trim($email)) && !empty(trim($password)) && !empty(trim($repass))) {
//mengecek apakah password yang diinputkan sama dengan re-password yang diinputkan kembali
if ($password == $repass) {
//memanggil method cek_nama untuk mengecek apakah user sudah terdaftar atau belum
if (cek_nama($name, $con) == 0) {
//hashing password sebelum disimpan didatabase
$pass = password_hash($password, PASSWORD_DEFAULT);
//insert data ke database
$query = "INSERT INTO users (username,name,email, password ) VALUES ('$username','$nama','$email','$pass')";
$result = mysqli_query($con, $query);
//jika insert data berhasil maka akan diredirect ke halaman index.php serta menyimpan data username ke session
if ($result) {
//$_SESSION['username'] = $username;
header('Location: login.php');
//jika gagal maka akan menampilkan pesan error
} else {
$error = 'Register User Gagal !!';
}
} else {
$error = 'Username sudah terdaftar !!';
}
} else {
$validate = 'Password tidak sama !!';
}
} else {
$error = 'Data tidak boleh kosong !!';
}
}
//fungsi untuk mengecek username apakah sudah terdaftar atau belum
function cek_nama($username, $con)
{
$nama = mysqli_real_escape_string($con, $username);
$query = "SELECT * FROM users WHERE username = '$nama'";
if ($result = mysqli_query($con, $query)) return mysqli_num_rows($result);
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<!-- costum css -->
<link rel="stylesheet" href="style.css">
</head>
<body>
<section class="container-fluid mb-4">
<!-- justify-content-center untuk mengatur posisi form agar berada di tengah-tengah -->
<section class="row justify-content-center">
<section class="col-12 col-sm-6 col-md-4">
<form class="form-container" action="register.php" method="POST">
<h4 class="text-center font-weight-bold"> Sign-Up </h4>
<?php if ($error != '') { ?>
<div class="alert alert-danger" role="alert"><?= $error; ?></div>
<?php } ?>
<div class="form-group">
<label for="name">Nama</label>
<input type="text" class="form-control" id="name" name="name" placeholder="Masukkan Nama">
</div>
<div class="form-group">
<label for="InputEmail">Alamat Email</label>
<input type="email" class="form-control" id="InputEmail" name="email" aria-describeby="emailHelp" placeholder="Masukkan email">
</div>
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" id="username" name="username" placeholder="Masukkan username">
</div>
<div class="form-group">
<label for="InputPassword">Password</label>
<input type="password" class="form-control" id="InputPassword" name="password" placeholder="Password">
<?php if ($validate != '') { ?>
<p class="text-danger"><?= $validate; ?></p>
<?php } ?>
</div>
<div class="form-group">
<label for="InputPassword">Re-Password</label>
<input type="password" class="form-control" id="InputRePassword" name="repassword" placeholder="Re-Password">
<?php if ($validate != '') { ?>
<p class="text-danger"><?= $validate; ?></p>
<?php } ?>
</div>
<button type="submit" name="submit" class="btn btn-primary btn-block">Register</button>
<div class="form-footer mt-2">
<p> Sudah punya account? <a href="login.php">Login</a></p>
</div>
</form>
</section>
</section>
</section>
<!-- Bootstrap requirement jQuery pada posisi pertama, kemudian Popper.js, dan yang terakhit Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>
Postingan
0 Komentar