Setelah belajar dasar mulai dari variabel dan lain-lain, sekarang mari belajar membuat projek sederhana menggunakan HTML dan bahasa PHP
Apa yang dibuat ? Tentu yang paling sering digunakan dan muncul saat ini adalah autentikasi aplikasi atau Log In. Dengan menggunakan input form username atau email dan password, kita akan mencoba membuat logika sederhana yaitu :
- Bila username dan password benar, maka akan muncul pesan Autentikasi Berhasil.
- Bila username dan password salah, maka muncul pesan Autentikasi Gagal.
Ini menggunakan pemahaman algoritma sekuensial ( pengurutan ), percabangan dan logika AND.
Perhatikan alur log in sederhana menggunakan flowchart berikut :
Sekarang mari buat implementasi kodenya dengan HTML 🚀
Bagian pertama setelah mulai, ada output "Tampil Dashboard Log In". Mari buat UI sederhana untuk Log In
Buat file baru dengan ekstensi *.php
Isi dengan kode HTML untuk membuat input form
Hasilnya :
Dah selesai buat UI, cobalah mengetik di form tersebut...
Ini menandakan ada proses yang dilakukan oleh komputer bukan ? Ingat lagi materi simbol flowchart!
Disini kita perlu memfungsikan tombol Log In saat di klik, cek alur panah kemana perginya
Yah betul! Pengecekan "apakah username dan password benar"
<form action="#" method="get">
- action digunakan agar halaman tidak pindah ( tetap di halaman web tersebut )
- method adalah cara yang digunakan untuk mengirim data dari HTML ke PHP.
Kemudian tambahkan perintah PHP
Mari bahas baris-baris kode PHP yah
- if merupakan salah satu perintah yang ada dalam logika percabangan.
- isset merupakan fungsi dalam PHP untuk menangkap kondisi tertentu dari HTML. Disini if ( isset() memiliki arti "jika di klik"
- $_GET merupakan fungsi untuk menangkap nama dari tag HTML. Terlihat if ( isset($_GET['login'])) , yang artinya menangkat tombol Log In. Sebab tombol Log In dinamai dengan login pada atribut name.<input type="submit" value="Log In" name="login">Perlu dibedakan antara value dan name, value akan tampil sebagai UI. Dan name yang akan digunakan untuk diolah dengan bahasa lain, seperti PHP.
- echo digunakan untuk menampilkan teks "Tombol Log In ditekan!", bila memang tombol di klik. Jika tidak ada klik maka kode PHP tidak akan berjalan.
Singkatnya, baris kode :
<?php
if ( isset($_GET['login'])) {
echo "Tombol <b>Log In</b> ditekan!";
}
?>
Bisa diartikan dengan "kalau tombol login ditekan maka tampilkan tulisan dengan perintah echo"
Mudah bukaaaan😁
Sekarang lanjut lagi, kita coba tambahkan untuk menggunakan logika and sebagai alat cek kebenaran username dan password serta menggunakan percabngan if else
Di kode tersebut kita menggunakan variabel ( diawali dengan $ ) untuk menampung atribut name dari input form HTML. Variabel $namaPengguna mengambil data atribut form name username dan $kataSandi mengambil atribut name form password.
Di dalam if, kita menggunakan logika AND sebagai pembanding dua variabel $namaPengguna dan $kataSandi.
Logika atau gerbang logika AND akan menghasilkan nilai benar apabila keduanya benar. Pelajari kembali tentang gerbang logika!
Dalam PHP, logika and disimbolkan dengan &&.
Dalam else, merupakan blok kode yang akan dijalankan apabila username dan password bukan aistaqiemsy / 123.
Sekarang mari coba jalankan aplikasi log in sederhana kita ini 😁
Nah, sekarang cobalah dengan username dan password lain
Password : 321
Hasilnya gagal 😉
Bagaimana sekarang...
Coba cek kembali, sesuai bukan dengan flowchart kita 😊
⚠ InfoBiasakan untuk menggunakan flowchart dalam membuat program agar program kita jelas arahnya dan diketahui alurnya
Unduh Baris Kode : Aplikasi Log In Sederhana HTML - PHP
Mudah bukan membuat log in sederhana menggunakan HTML - PHP ? Ada pertanyaan tulis saja di kolom komentar dibawah...
Tags:
PHP