Bagian 02: Membuat Sistem Login

Membuat Sistem Login Sederhana – Selamat datang kembali di blog saya, terima kasih sudah berkunjung. Sekarang ini saya akan lanjutkan pembahasan kita di seri Pembuatan Aplikasi SPP berbasis Web sederhana. Kita lanjutkan ke tahap selanjutnya yaitu Membuat Sistem Login Sederhana. Langsung disimak aja ya.

Pertamatama, teman teman Jalankan terlebih dahulu XAMPPnya atau Web Server yang kalian gunakan setelah itu buka Editor kalian, entah itu Notepad++, Visual Studio Code, Atom, Sublime Text  dkk. Tampilan yang akan kita buat ini sederhana saja ya tanpa ada CSS atau JS, untuk itu teman teman coba hias sesuka kalian. Nanti tampilannya seperti ini :

Tampilan login

1. Jika Sudah dibuka Editornya, kita akan buat koneksi ke database nya terlebih dahulu yaa.

Membuat Koneksi ke Database PHP MySQLi

2. Selanjutnya kita akan buat halaman login nya.

Coding login

Jika sudah diketikkan Save dengan nama login.php !

Perhatikan di coding nya, disana terdapat sebuah tag <form> dengan action=”proseslogin.php” dan method=”POST” . Itu artinya form yang disubmit nanti akan diproses pada file yang bernama proseslogin.php dan datanya akan dikirimkan kehalaman tersebut menggunakan metode POST. Di baris selanjutnya kita membuat input untuk petugas dalam sebuah table supaya nanti keliatan rapi yaa. Perhatikan, ada tag <input> dengan attribute type=”text” dan name=”username”. Input yang akan petugas masukkan akan dikirimkan ke halaman proseslogin.php yang nanti akan kita buatkan logic disana untuk proses data.

3. Selanjutnya kita buat Proses Login nya

Coding proses login

Jika sudah save dengan nama proseslogin.php !

Perhatikan kembali ya di codingnya, pada baris pertama kita buat sesi dengan session_start(); dan kita akan panggil database kita yang ada pada file koneksi dengan require_once(“koneksi.php”);.  Lihat logic yang kita buat, jika nanti tombol submit yang ada pada login.php itu ditekan dan sudah kita kasih name dengan login logika nya seperti ini if(isset($_POST[‘login’]){ jika kondisinya ini true maka dia akan menjalankan perintah yang ada dibawahnya, perintahnya akan saya jelaskan. Kondisi true, dia akan membuat variable dengan nama $username yang didalamnya adalah $_POST[‘username’], jadi variable tersebut mengambil data dari form yang sebelumnya kita inputkan yang mana didalam tag <input> kita sudah menambahkan attribute name=”username” begitupun sama dengan $password. Setelah itu kita akan memilih data yang ada pada database kita dengan cara membuat variable terlebih dahulu dengan nama $cari diisi dengan mysqli_query($db, “SELECT * FROM petugas WHERE username=’$username’); jadi mysql ini nanti akan memilih sebuah data yang ada pada table petugas dengan username sama dengan username yang kita inputkan. Lalu kita akan menangkap semua data yang username nya sama dengan username yang diinput dengan menambahkan sebuah variable yang diisi dengan mysqli_fetch_assoc($cari); yang nantinya akan menghasilkan data berupa array associative. Lanjut ke kondisi selanjut nya, Jika data yang kita cari itu kosong maka nanti akan tampil “username belum terdaftar” dengan perintah mysqli_num_rows($cari) == 0 dan jika password yang kita panggil di database dengan $hasil[‘password’] <> $password itu tidak sama dengan yang diinput maka nanti akan tampil  “Password salah” selain dari itu kita akan membuat sebuah sesi dengan username dan akan redirect ke halaman index.php .

4. Kita buat halaman index

Coding index

Teman teman save dengan nama index.php !

Baris pertama coding yang kita buat adalah session_start(); karena kita menggunakan system sesi yaa. Lalu baris kedua kita memanggil database, karena nanti halaman utama ini akan berinteraksi dengan database. Setelah itu kita menyisipkan sebuah baris kondisi, jika sesi belum dibuat if(!isset($_SESSION[‘username’])) maka nanti akan dikembalikan kehalaman login dengan perintah header(“location: login.php”);. Dan jika selain dari itu kita buat variable dengan nilai sesi login username, karena kita akan mengambil data dari username.

Index / halaman utama

Sudah bisa login ya teman teman, coba perharikan url nya sedang berada pada halaman index.php .

Index/Halaman utama ini kita buat sederhana saja sebagai percobaan apakah login nya sudah berjalan dengan benar atau tidak. Selanjutnya nanti akan kita perbaiki halaman utama ini

Baca Juga

Bagian 01: Pembahasan Soal UKK SPP

Bagian 02: Membuat Sistem Login

Bagian 03: Membuat Menu Navigasi

Bagian 04: Membuat CRUD Data Siswa dan Join Table

Bagian 05: Membuat Entry Transaksi Pembayaran

Bagian 06: Membuat Pencarian Data History Pembayaran

Bagian 07: Membuat Pagging Data

Bagian 08: Membuat Login Siswa

Sudah dulu ya. Post selanjutnya kita akan membuat menu yang ada pada halaman index tadi, dan akan kita sisipkan sebuah statement kondisi jika level admin > maka menu yang dapat diakses apa saja dan jika level petugas > yang dapat diakses apa saja dan jika siswa maka akan seperti apa.