Membuat Form Login Dan Registrasi Siswa PHP Dan MYSQL || Biodata Siswa
Assalamu'alaikum Wr.Wb
Salam Dan Bahagia
A. Pendahuluan
Pada Kali ini saya akan Membuat Fitur Login Dan Registrasi Untuk Siswa, Nah Nantinya Jika Siswa Ingin Melihat identitasnya Maka Siswa Harus Login Terlebih Dahulu, jika Belum Memiliki Akun Untuk Login Maka Siswa Dapat Melakukan Registrasi Pada Form Yang Sudah Disediakan,Untuk Form Registrasi Nantinya Akan saya buat terdiri Dari Nama Lengkap, Kelas, Jenis Kelamin, No.Induk Dan Password Yang Dibuat Dengan Bahasa PHP Dan Mysql, Untuk Cara Pembuatan Langsung saja dibaca dan dipahami
B. Latar Belakang
Latar Belakang Saya Membuat Form Login Dan Registrasi Untuk Siswa Ini Adalah Agar Data Setiap Siswa Aman Dan Siswa Lain Tidak Bisa Melihat Data Temannya Sendiri
C. Maksud Dan Tujuan
Tujuan Saya Membuat Form Login Untuk Siswa Ini Adalah Agar Data Siswa Lebih Aman, Dan Persiswa Memiliki User masing-Masing Yang Nantinya digunakan Untuk Login Dan Melihat Data Dirinya,
D. Alat Dan Bahan
Laptop
Teks Editor ( Sublime Text )
E. Jangka Waktu Yang Dibutuhkan
5 Jam
F. Langkah Kerja
Nah Langka Pertama Yang Harus Dilakukan Adalah Membuka Text Editor Kesayangan Kalian Terlebih dahulu :v, Disini Saya Menggunakan Sublime Text, Setelah Itu Saya Membuat Bagian FrontEnd nya Terlebih Dahulu, Nah Seperti Biasa Untuk Membuat Bagian Tampilan Depan Atau FrontEnd Saya Hanya Menggunakan HTML Dan CSS Saja,karna nantinya Form Login Dan Registrasi Ini Saya Buat Sangat Sederhana Mungkin Maka Dari Itu Dalam Pembuatan Hanya Menggunakan HTML Dan CSS Saja :)
Yang Saya Lakukan Setelah Itu Adalah Membuat File Baru Dengan Nama login_siswa.php, Kemudian Saya Buat Script Html Sederhana Seperti Berikut :
Setelah Itu Save Dan Coba Lihat Hasilnya Pasti Tidak Memuaskan :v, Nah Agar Tampilan Login Ini Terlihat Lebih Indah tataletaknya Maupun Warna nya, Disini Saya Menambahkan Script CSS, Buat File Baru Dengan Nama style.css Setelah Itu Isi File nya Dengan Script Css Berikut :
Setelah Itu Save dan lihat Maka Hasilnya Akan Seperti Berikut :
Pembuatan Form Login Sudah Selesai, Nah Setelah Itu Saya Membuat Form Registrasi Siswa, Form - Form Regitrasi Siswa ini Akan Terdiri Dari Nama Lengkap,Kelas,Jenis Kelamin,Nomor Induk, Dan Passsword, Pembuatannya Hampir Sama Dengan Form Login Hanya Menggunakan HTML Dan CSS saja, Cuma Menambahkan Jenis Inputan Baru, Untuk Script Nya Seperti Berikut
Buat File Baru Dengan Nama registrasi.php, Setelah Itu Isi File Nya Dengan Script HTML Seperti Berikut :
Kemudian Tambahkan Script CSS Dibawah ini Pada File Style.css yang Sudah Dibuat Sebelumnya :
Setelah Itu Save dan lihat Maka Hasilnya Akan Seperti Berikut :
Pembuatan Tampilan Form Login dan Registrasi Siswa Sudah Selesai, Nah Sekarang dilanjut Pembuatan Bagian Backend nya atau Biasa disebut Bagian Dapurnya Kalau kata anak tataboga :v
Nah Untuk Dibagian Backend nya ini saya menggunakan bahasa pemrograman PHP Dan MYSQL, Langkah Pertama Yang Harus Dilakukan Adalah Pastikan Sudah Terkoneksi Dengan Database,Jika Sudah Terkoneksi Ke database Masuk Ke database Utama Dan buat tabel baru dengan nama user_siswa, Setelah Itu isikan field tabel seperti ini :
Nah setelah itu save,Kemudian kembali ke teks editor dan buat file baru dengan nama proses.php dan isikan script PHP seperti Berikut :
Nah jangan Sampai lupa Dibagian file registrasi.php tepatnya di bagian form action panggil file proses.php lebih jelasnya seperti ini :
Sampai disini pembuatan Fitur Registrasi Sudah Selesai, Setelah Itu Kita buat Bagian Backend nya pada form login
Tambahkan Script PHP berikut pada file login_siswa.php :
Sampai Disini kita bisa mencoba login dengan user yang sudah tersedia di database, jika user yang login dan data usernya tidak terdapat pada database maka akan muncul notifikasi kalau data user belum tersedia
G. Kesimpulan
Kesimpulan yang dapat diambil adalah dalam pembuatan backend ini Kita harus paham dan mengerti tentang bahasa pemrograman PHP dan MYSQL,Terutama pada login system
H. Referensi
w3schools.com
Sekian yang dapat saya sampaikan mohon maaf bila ada kesalahan dalam penulisan maupun tatabahasa sekian dan terima kasih
Wassalamu'alaikum Wr.Wb
Salam Dan Bahagia
A. Pendahuluan
Pada Kali ini saya akan Membuat Fitur Login Dan Registrasi Untuk Siswa, Nah Nantinya Jika Siswa Ingin Melihat identitasnya Maka Siswa Harus Login Terlebih Dahulu, jika Belum Memiliki Akun Untuk Login Maka Siswa Dapat Melakukan Registrasi Pada Form Yang Sudah Disediakan,Untuk Form Registrasi Nantinya Akan saya buat terdiri Dari Nama Lengkap, Kelas, Jenis Kelamin, No.Induk Dan Password Yang Dibuat Dengan Bahasa PHP Dan Mysql, Untuk Cara Pembuatan Langsung saja dibaca dan dipahami
B. Latar Belakang
Latar Belakang Saya Membuat Form Login Dan Registrasi Untuk Siswa Ini Adalah Agar Data Setiap Siswa Aman Dan Siswa Lain Tidak Bisa Melihat Data Temannya Sendiri
C. Maksud Dan Tujuan
Tujuan Saya Membuat Form Login Untuk Siswa Ini Adalah Agar Data Siswa Lebih Aman, Dan Persiswa Memiliki User masing-Masing Yang Nantinya digunakan Untuk Login Dan Melihat Data Dirinya,
D. Alat Dan Bahan
Laptop
Teks Editor ( Sublime Text )
E. Jangka Waktu Yang Dibutuhkan
5 Jam
F. Langkah Kerja
Nah Langka Pertama Yang Harus Dilakukan Adalah Membuka Text Editor Kesayangan Kalian Terlebih dahulu :v, Disini Saya Menggunakan Sublime Text, Setelah Itu Saya Membuat Bagian FrontEnd nya Terlebih Dahulu, Nah Seperti Biasa Untuk Membuat Bagian Tampilan Depan Atau FrontEnd Saya Hanya Menggunakan HTML Dan CSS Saja,karna nantinya Form Login Dan Registrasi Ini Saya Buat Sangat Sederhana Mungkin Maka Dari Itu Dalam Pembuatan Hanya Menggunakan HTML Dan CSS Saja :)
Yang Saya Lakukan Setelah Itu Adalah Membuat File Baru Dengan Nama login_siswa.php, Kemudian Saya Buat Script Html Sederhana Seperti Berikut :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login Siswa</title>
<link rel="stylesheet" href="../asset/asli.css">
<link rel="stylesheet" href="../asset/font/css/all.css" />
</head>
<body>
<div class="wrapper">
<form action="" method="post">
<div class="dasar">
<div class="ats">
<h2 style="line-height: 45px;margin-left: 20px;"><i style="margin-right: 10px;" class="fa fa-lock"></i>Login Siswa</h2>
</div>
<div class="username">
<div class="ico"><i style="float: left;margin-left: 5px;margin-top: 3px;" class="fa fa-user fa-2x"></div></i><input class="user" type="text" name="no_induk" placeholder="No.Induk" required="">
</div>
<div class="usernam">
<div class="ico"><i style="float: left;margin-left:7px;margin-top: 3px;" class="fa fa-lock fa-2x style="color:white"></div></i><input class="user" name="password" style="margin-left: 8px;" type="Password" placeholder="Password" required="">
<button class="btn" name="masuk">MASUK</button>
</form>
</div>
<p class="pp">Belum Punya akun? <a class="p-a" href="../admin/registrasi_siswa.php">Klik Disini</p></a>
</div>
</div>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login Siswa</title>
<link rel="stylesheet" href="../asset/asli.css">
<link rel="stylesheet" href="../asset/font/css/all.css" />
</head>
<body>
<div class="wrapper">
<form action="" method="post">
<div class="dasar">
<div class="ats">
<h2 style="line-height: 45px;margin-left: 20px;"><i style="margin-right: 10px;" class="fa fa-lock"></i>Login Siswa</h2>
</div>
<div class="username">
<div class="ico"><i style="float: left;margin-left: 5px;margin-top: 3px;" class="fa fa-user fa-2x"></div></i><input class="user" type="text" name="no_induk" placeholder="No.Induk" required="">
</div>
<div class="usernam">
<div class="ico"><i style="float: left;margin-left:7px;margin-top: 3px;" class="fa fa-lock fa-2x style="color:white"></div></i><input class="user" name="password" style="margin-left: 8px;" type="Password" placeholder="Password" required="">
<button class="btn" name="masuk">MASUK</button>
</form>
</div>
<p class="pp">Belum Punya akun? <a class="p-a" href="../admin/registrasi_siswa.php">Klik Disini</p></a>
</div>
</div>
</body>
</html>
Setelah Itu Save Dan Coba Lihat Hasilnya Pasti Tidak Memuaskan :v, Nah Agar Tampilan Login Ini Terlihat Lebih Indah tataletaknya Maupun Warna nya, Disini Saya Menambahkan Script CSS, Buat File Baru Dengan Nama style.css Setelah Itu Isi File nya Dengan Script Css Berikut :
* {
padding: 0;
margin: 0;
}
body {
background-color: #B4B4B4FF;
}
.dasar {
width: 380px;
height: 280px;
background:white;
margin: 150px auto;
/*opacity: 0.3;*/
background-color: white;
}
.user {
height: 36px;
width: 215px;
margin-left: 5px;
vertical-align: top;
border:1px white;
text-align: center;
outline-color: white;
margin-top: 1px;
}
.username {
width: 255px;
height: 38px;
background: white;
margin: 30px auto;
border: 1px solid black;
}
.usernam {
width: 260px;
height: 38px;
background: white;
margin: 30px auto;
margin-top: -20px;
border: 1px solid black;
}
.btn {
width: 250px;
height: 30px;
background: #006766FF;
border: 0;
color: white;
margin-top: 30px;
cursor: pointer;
font-weight: bold;
}
.btn:active {
transform: translateY(3px);
background-color: white;
}
.logo {
width: 100px;
height: 60px;
margin:40px auto;
}
.ats {
width: 380px;
height: 45px;
background-color: #006766FF;
color: white;
}
.pp {
margin-top: 70px;
margin-left: 85px;
color: black;
font-weight: bold
}
.p-a {
text-decoration: none;
}
@media screen and (max-width: 430px) {
.dasar {
width: 250px;
}
.ats {
width: 250px;
}
.username {
width: 230px;
}
.usernam {
width: 230px;
}
.user {
width: 180px;
}
.btn {
width: 230px;
}
.pp {
font-size: 12px;
margin-left: 5px;
}
}
padding: 0;
margin: 0;
}
body {
background-color: #B4B4B4FF;
}
.dasar {
width: 380px;
height: 280px;
background:white;
margin: 150px auto;
/*opacity: 0.3;*/
background-color: white;
}
.user {
height: 36px;
width: 215px;
margin-left: 5px;
vertical-align: top;
border:1px white;
text-align: center;
outline-color: white;
margin-top: 1px;
}
.username {
width: 255px;
height: 38px;
background: white;
margin: 30px auto;
border: 1px solid black;
}
.usernam {
width: 260px;
height: 38px;
background: white;
margin: 30px auto;
margin-top: -20px;
border: 1px solid black;
}
.btn {
width: 250px;
height: 30px;
background: #006766FF;
border: 0;
color: white;
margin-top: 30px;
cursor: pointer;
font-weight: bold;
}
.btn:active {
transform: translateY(3px);
background-color: white;
}
.logo {
width: 100px;
height: 60px;
margin:40px auto;
}
.ats {
width: 380px;
height: 45px;
background-color: #006766FF;
color: white;
}
.pp {
margin-top: 70px;
margin-left: 85px;
color: black;
font-weight: bold
}
.p-a {
text-decoration: none;
}
@media screen and (max-width: 430px) {
.dasar {
width: 250px;
}
.ats {
width: 250px;
}
.username {
width: 230px;
}
.usernam {
width: 230px;
}
.user {
width: 180px;
}
.btn {
width: 230px;
}
.pp {
font-size: 12px;
margin-left: 5px;
}
}
Setelah Itu Save dan lihat Maka Hasilnya Akan Seperti Berikut :
Pembuatan Form Login Sudah Selesai, Nah Setelah Itu Saya Membuat Form Registrasi Siswa, Form - Form Regitrasi Siswa ini Akan Terdiri Dari Nama Lengkap,Kelas,Jenis Kelamin,Nomor Induk, Dan Passsword, Pembuatannya Hampir Sama Dengan Form Login Hanya Menggunakan HTML Dan CSS saja, Cuma Menambahkan Jenis Inputan Baru, Untuk Script Nya Seperti Berikut
Buat File Baru Dengan Nama registrasi.php, Setelah Itu Isi File Nya Dengan Script HTML Seperti Berikut :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Registrasi || ZnSystem</title>
<link rel="stylesheet" href="default.css">
<link rel="stylesheet" href="../asset/font/css/all.min.css">
</head>
<body>
<div class="wrapper">
<div class="head">
<h2 class="head-title"><i style="margin-left: 10px;" class="fa fa-user"></i> Form Registrasi</h2>
</div>
<form action="proses_registrasi.php" method="post">
<table class="tab">
<tr>
<td>Nama Lengkap</td>
<td>:</td>
<td><input class="in" type="text" name="nama" required="" placeholder="Nama Lengkap..." autofocus="autofocus"></td>
</tr>
<tr>
<td>Kelas</td>
<td>:</td>
<td><input class="in" type="radio" name="kelas" value="X" required="">X <input type="radio" name="kelas" value="XI" required="">XI <input type="radio" name="kelas" value="XII" required="" >XII</td>
</tr>
<tr>
<td>Jenis Kelamin</td>
<td>:</td>
<td><input class="in" type="radio" name="jk" value="Laki-Laki" required="">Laki-Laki <input type="radio" name="jk" value="Perempuan" required="">Perempuan</td>
</tr>
<tr>
<td>No.Induk</td>
<td>:</td>
<td><input class="in" type="text" name="no_induk" maxlength="4" required="" placeholder="Pastikan No.Induk Benar!"></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input class="in" type="password" name="password" required="" placeholder="Buat Password. . ."></td>
</tr>
<tr>
<td><input class="sub" type="submit" name="sub" value="Registrasi"></td>
</tr>
</table>
</form>
<p class="log">Udah Punya Akun? <a class="qw" href="../data/log_siswa.php">Login</a></p>
</div>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Registrasi || ZnSystem</title>
<link rel="stylesheet" href="default.css">
<link rel="stylesheet" href="../asset/font/css/all.min.css">
</head>
<body>
<div class="wrapper">
<div class="head">
<h2 class="head-title"><i style="margin-left: 10px;" class="fa fa-user"></i> Form Registrasi</h2>
</div>
<form action="proses_registrasi.php" method="post">
<table class="tab">
<tr>
<td>Nama Lengkap</td>
<td>:</td>
<td><input class="in" type="text" name="nama" required="" placeholder="Nama Lengkap..." autofocus="autofocus"></td>
</tr>
<tr>
<td>Kelas</td>
<td>:</td>
<td><input class="in" type="radio" name="kelas" value="X" required="">X <input type="radio" name="kelas" value="XI" required="">XI <input type="radio" name="kelas" value="XII" required="" >XII</td>
</tr>
<tr>
<td>Jenis Kelamin</td>
<td>:</td>
<td><input class="in" type="radio" name="jk" value="Laki-Laki" required="">Laki-Laki <input type="radio" name="jk" value="Perempuan" required="">Perempuan</td>
</tr>
<tr>
<td>No.Induk</td>
<td>:</td>
<td><input class="in" type="text" name="no_induk" maxlength="4" required="" placeholder="Pastikan No.Induk Benar!"></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input class="in" type="password" name="password" required="" placeholder="Buat Password. . ."></td>
</tr>
<tr>
<td><input class="sub" type="submit" name="sub" value="Registrasi"></td>
</tr>
</table>
</form>
<p class="log">Udah Punya Akun? <a class="qw" href="../data/log_siswa.php">Login</a></p>
</div>
</body>
</html>
Kemudian Tambahkan Script CSS Dibawah ini Pada File Style.css yang Sudah Dibuat Sebelumnya :
* {
padding: 0;
margin: 0;
}
body {
background: #D6D6D6FF;
}
.wrapper {
width: 100%;
height: 150px;
background: white;
border-radius: 30px;
}
.text-logo {
width: 400px;
height: 150px;
}
.btn-kiri {
width: 200px;
height: 150px;
float: right;
margin-top: -150px;
}
.btn {
width: 120px;
height: 30px;
margin-top: 60px;
background: #4BCE48FF;
color: white;
font-weight: bold;
border:none;
border-radius: 20px;
cursor: pointer;
}
.btn:hover {
box-shadow: 2px 3px 5px grey;
}
.form {
width: 100%;
height:auto;
background: white;
overflow: hidden;
}
.kiri {
width: 50%;
height: 600px;
float: left;
}
.kanan {
width: 50%;
height: 490px;
float: left;
}
.sub {
width: 200px;
margin-top: 30px;
height: 30px;
background: #334EFFFF;
color: white;
font-weight: bold;
border:none;
}
.sub:hover {
box-shadow: 2px 4px 6px grey;
}
.nav {
width: 100%;
height: 60px;
background-color: #334EFFFF;
position: fixed;
}
.log {
width: 150px;
height: 60px;
float: right;
}
.id {
width: 100%;
height: 120px;
border-bottom: 1px solid #B1B1B1FF;
background-image: url(../img/as.jpg);
background-repeat: no-repeat;
background-size: cover;
}
.kos {
width: 100%;
height: 60px;
}
.idd {
line-height: 30px;
font-weight: bold;
}
.kotak {
width: 50px;
height: 50px;
margin: auto;
}
.ii {
text-align: center;
margin-top: 20px;
color: white;
text-shadow: 3px 2px 2px black;
}
.fooot {
width: 100%;
height: 30px;
background: white;
border-top: 1px solid #B8B8B8FF;
}
.search {
width: 100%;
height: 50px;
}
.tak {
width: 300px;
height: 50px;
float: right;
}
.se {
height: 25px;
width: 200px;
border-radius: 10px;
margin-top: 10px;
background: none;
border: 1px solid #4A6BFFFF;
outline: none;
color: blue;
text-align: center;
}
.re {
height: 25px;
width: 60px;
border-radius: 5px;
border: none;
background: #4A6BFFFF;
color: white;
font-weight: bold;
}
.dass {
width: 800px;
height: 600px;
background: #F8F8F8FF;
margin: auto;
border-radius: 20px;
}
.w {
text-align: center;
padding-top: 20px;
}
.nam {
margin:30px auto;
}
.na {
width: 400px;
height: 30px;
background: #6586FFFF;
color: white;
border-right: 1px solid #E1E1E1FF;
}
.ke {
width: 150px;
background: #6586FFFF;
color: white;
border-right: 1px solid #E1E1E1FF;
}
.vie {
width: 100px;
background: #6586FFFF;
color: white;
border-right: 1px solid #E1E1E1FF;
}
@media screen and (max-width: 977px) {
}
padding: 0;
margin: 0;
}
body {
background: #D6D6D6FF;
}
.wrapper {
width: 100%;
height: 150px;
background: white;
border-radius: 30px;
}
.text-logo {
width: 400px;
height: 150px;
}
.btn-kiri {
width: 200px;
height: 150px;
float: right;
margin-top: -150px;
}
.btn {
width: 120px;
height: 30px;
margin-top: 60px;
background: #4BCE48FF;
color: white;
font-weight: bold;
border:none;
border-radius: 20px;
cursor: pointer;
}
.btn:hover {
box-shadow: 2px 3px 5px grey;
}
.form {
width: 100%;
height:auto;
background: white;
overflow: hidden;
}
.kiri {
width: 50%;
height: 600px;
float: left;
}
.kanan {
width: 50%;
height: 490px;
float: left;
}
.sub {
width: 200px;
margin-top: 30px;
height: 30px;
background: #334EFFFF;
color: white;
font-weight: bold;
border:none;
}
.sub:hover {
box-shadow: 2px 4px 6px grey;
}
.nav {
width: 100%;
height: 60px;
background-color: #334EFFFF;
position: fixed;
}
.log {
width: 150px;
height: 60px;
float: right;
}
.id {
width: 100%;
height: 120px;
border-bottom: 1px solid #B1B1B1FF;
background-image: url(../img/as.jpg);
background-repeat: no-repeat;
background-size: cover;
}
.kos {
width: 100%;
height: 60px;
}
.idd {
line-height: 30px;
font-weight: bold;
}
.kotak {
width: 50px;
height: 50px;
margin: auto;
}
.ii {
text-align: center;
margin-top: 20px;
color: white;
text-shadow: 3px 2px 2px black;
}
.fooot {
width: 100%;
height: 30px;
background: white;
border-top: 1px solid #B8B8B8FF;
}
.search {
width: 100%;
height: 50px;
}
.tak {
width: 300px;
height: 50px;
float: right;
}
.se {
height: 25px;
width: 200px;
border-radius: 10px;
margin-top: 10px;
background: none;
border: 1px solid #4A6BFFFF;
outline: none;
color: blue;
text-align: center;
}
.re {
height: 25px;
width: 60px;
border-radius: 5px;
border: none;
background: #4A6BFFFF;
color: white;
font-weight: bold;
}
.dass {
width: 800px;
height: 600px;
background: #F8F8F8FF;
margin: auto;
border-radius: 20px;
}
.w {
text-align: center;
padding-top: 20px;
}
.nam {
margin:30px auto;
}
.na {
width: 400px;
height: 30px;
background: #6586FFFF;
color: white;
border-right: 1px solid #E1E1E1FF;
}
.ke {
width: 150px;
background: #6586FFFF;
color: white;
border-right: 1px solid #E1E1E1FF;
}
.vie {
width: 100px;
background: #6586FFFF;
color: white;
border-right: 1px solid #E1E1E1FF;
}
@media screen and (max-width: 977px) {
}
Setelah Itu Save dan lihat Maka Hasilnya Akan Seperti Berikut :
Pembuatan Tampilan Form Login dan Registrasi Siswa Sudah Selesai, Nah Sekarang dilanjut Pembuatan Bagian Backend nya atau Biasa disebut Bagian Dapurnya Kalau kata anak tataboga :v
Nah Untuk Dibagian Backend nya ini saya menggunakan bahasa pemrograman PHP Dan MYSQL, Langkah Pertama Yang Harus Dilakukan Adalah Pastikan Sudah Terkoneksi Dengan Database,Jika Sudah Terkoneksi Ke database Masuk Ke database Utama Dan buat tabel baru dengan nama user_siswa, Setelah Itu isikan field tabel seperti ini :
Nah setelah itu save,Kemudian kembali ke teks editor dan buat file baru dengan nama proses.php dan isikan script PHP seperti Berikut :
<?php
include "../data/config.php";
if (isset($_POST['sub'])) {
$nama = filter_input(INPUT_POST, 'nama', FILTER_SANITIZE_STRING);
$kelas = filter_input(INPUT_POST, 'klas', FILTER_SANITIZE_STRING);
$jk = filter_input(INPUT_POST, 'jk', FILTER_SANITIZE_STRING);
$no_induk = filter_input(INPUT_POST, 'no_induk', FILTER_SANITIZE_STRING);
$password = password_hash($_POST['password'], PASSWORD_DEFAULT);
$sql = "INSERT INTO user_siswa (nama,kelas,jk, no-induk, password) VALUES ('$nama','$kelas','$jk', '$no_indik', '$password')";
$query = mysqli_query($conn, $sql);
if ($query) {
header('Location: ../data/log_siswa.php');
}else {
echo "gagal";
}
}
?>
include "../data/config.php";
if (isset($_POST['sub'])) {
$nama = filter_input(INPUT_POST, 'nama', FILTER_SANITIZE_STRING);
$kelas = filter_input(INPUT_POST, 'klas', FILTER_SANITIZE_STRING);
$jk = filter_input(INPUT_POST, 'jk', FILTER_SANITIZE_STRING);
$no_induk = filter_input(INPUT_POST, 'no_induk', FILTER_SANITIZE_STRING);
$password = password_hash($_POST['password'], PASSWORD_DEFAULT);
$sql = "INSERT INTO user_siswa (nama,kelas,jk, no-induk, password) VALUES ('$nama','$kelas','$jk', '$no_indik', '$password')";
$query = mysqli_query($conn, $sql);
if ($query) {
header('Location: ../data/log_siswa.php');
}else {
echo "gagal";
}
}
?>
Nah jangan Sampai lupa Dibagian file registrasi.php tepatnya di bagian form action panggil file proses.php lebih jelasnya seperti ini :
Sampai disini pembuatan Fitur Registrasi Sudah Selesai, Setelah Itu Kita buat Bagian Backend nya pada form login
Tambahkan Script PHP berikut pada file login_siswa.php :
<?php
session_start();
include "../data/config.php";
if (isset($_POST['sub'])) {
$username = filter_input(INPUT_POST, 'username', FILTER_SANITIZE_STRING);
$password = filter_input(INPUT_POST, 'password', FILTER_SANITIZE_STRING);
$sql = "SELECT * FROM user WHERE username = '$username';";
$query = mysqli_query($conn, $sql);
if (mysqli_num_rows($query) === 1) {
$s = mysqli_fetch_assoc($query);
if (password_verify($password, $s["password"])) {
$_SESSION['nama'] = $s['nama'];
$_SESSION['level'] = $s['level'];
if ($s['level']=='admin') {
header('Location: index.php?page=home');
}
if ($s['level']=='guru') {
header('Location: ../ads');
}
}
}
$error = true;
}
session_start();
include "../data/config.php";
if (isset($_POST['sub'])) {
$username = filter_input(INPUT_POST, 'username', FILTER_SANITIZE_STRING);
$password = filter_input(INPUT_POST, 'password', FILTER_SANITIZE_STRING);
$sql = "SELECT * FROM user WHERE username = '$username';";
$query = mysqli_query($conn, $sql);
if (mysqli_num_rows($query) === 1) {
$s = mysqli_fetch_assoc($query);
if (password_verify($password, $s["password"])) {
$_SESSION['nama'] = $s['nama'];
$_SESSION['level'] = $s['level'];
if ($s['level']=='admin') {
header('Location: index.php?page=home');
}
if ($s['level']=='guru') {
header('Location: ../ads');
}
}
}
$error = true;
}
Sampai Disini kita bisa mencoba login dengan user yang sudah tersedia di database, jika user yang login dan data usernya tidak terdapat pada database maka akan muncul notifikasi kalau data user belum tersedia
G. Kesimpulan
Kesimpulan yang dapat diambil adalah dalam pembuatan backend ini Kita harus paham dan mengerti tentang bahasa pemrograman PHP dan MYSQL,Terutama pada login system
H. Referensi
w3schools.com
Sekian yang dapat saya sampaikan mohon maaf bila ada kesalahan dalam penulisan maupun tatabahasa sekian dan terima kasih
Wassalamu'alaikum Wr.Wb
