Cara membuat website CRUD sederhana menggunakan PHP dan MySQL - Kali ini saya akan memberikan sebuah tutorial mengenai cara membuat website dengan sistem CRUD ( Create Read Update Delete ) sederhana. Dan untuk database yang saya gunakan yaitu menggunakan database kesayangan kita semua MySQL.
Oke langsung saja masuk ke bagian struktur folder
Struktur folder yang nanti saya gunakan akan seperti ini :
Di head.php hanya akan ada tag head dan isinya, untuk css saya menggunakan bootstrap yang tadi ada di folder assets jika kalian menggunakan CDN ganti saja dengan CDN dari bootstrap. Karena menggunakan bootstrap, css dari datatables juga saya include yang versi bootstrap.
Selanjutnya isi dari file footer.php yaitu jquery, 2 script bootstrap 4 ( popper & js ), dan 2 script dari datatables untuk bootstrap. Script yang terakhir untuk menginisialisasi datatable yang nanti digunakan, dengan id tabel table_id .Oke langsung saja masuk ke bagian struktur folder
Struktur folder yang nanti saya gunakan akan seperti ini :
Saya akan jelaskan mengenai struktur foldernya, di bagian folder _partials nantinya akan berisi dua file. file foot.php akan berisi script - script yang di butuhkan contohnya nanti saya akan menambahkan script jquery, dan datatables. dan file head.php akan berisi tag head untuk memanggil css.
Di folder assets diisi dengan file css dari bootstrap 4 , Kalau kalian mau include sekalian dengan menggunakan CDN berarti tidak perlu menambahkan file tersebut, tinggal dipanggil saja di header nanti.
Folder menu nantinya file - file tersebut akan dipanggil berdasarkan menunya. File - file tersebut akan dipanggil melalui file index.php.
Selanjutnya file CRUD.php , file ini nantinya akan saya gunakan sebagai class yang dapat dipanggil untuk melakukan query - query ke database, koneksi ke database, maupun form validasi data.
File yang terakhir yaitu index.php akan digunakan sebagai routing dan templating.
Untuk struktur data di database silahkan kalian membuat database dengan nama terserah kalian ( saya menggunakan nama database tugas_1 ) dan buat tabel dengan nama tabel users dengan kolom - kolom seperti dibawah ini :
Oke let's code!
1. Membuat file head.php dan footer.php
2. Membuat file CRUD.php
Di sana kita akan membuat sebuah class yang bernama CRUD yang nantinya akan berisi fungsi - fungsi untuk melakukan query dan sebagainya. Yang pertama kita akan membuat sebuah fungsi constructor, yang nantinya ketika class ini di buat sebuah objek fungsi ini yang dijalankan pertama kali.
Fungsi tersebut berisi fungsi untuk melakukan koneksi ke database dengan menggunakan keyword new mysqli yang artinya kita akan membuat sebuah objek mysqli, dengan beberapa parameter yaitu nama host, username, password, dan database.
Saya menggunakan nama host localhost dengan username root dan passwordnya string kosong, selanjutnya nama database tugas_1 . Hasil dari keyword new mysqli akan di masukkan ke dalam properti db yang nantinya objek tersebut akan terus digunakan untuk melakukan query ke dalam database.
Jika ada error, objek db akan memiliki sebuah properti bernama connect_error berisi pesan error yang nantinya akan ditampilkan. Tidak lupa saya akan berikan sebuah properti nama tabel yaitu nama tabel yang saya gunakan users .
3. Membuat templating dan routing di index.php
Sebelum itu buatlah, folder menu tadi yang berisi file tabel.php tambah.php ubah.php . Selanjutnya kita akan masuk ke file index.php
Di line yang ke 2 kita memanggil file CRUD.php nya, yang nantinya class CRUD akan dibuatkan objeknya dengan variabel CRUD. Selanjutnya memanggil file - file yang ada di _partials sesuai dengan letaknya. Untuk routingnya saya menggunakan fungsi switch case, untuk meload file - file sesuai dengan aksinya.
4. Mengatur fungsi CRUD di setiap halaman
Sebelumnya masuk ke dalam file CRUD.php untuk membuat fungsi menampilkan semua data. Koding dibawah melanjutkan koding dari membuat file CRUD.
Karena kita sudah membuat objek dari class CRUD, jadi kita bisa memanggil fungsi getAll untuk menampilkan semua data di dalam tabel users.
Tombol tambah nantinya akan mengarahkan ke aksi tambah, tombol edit juga akan mengarahkan ke aksi edit dengan id user yang di pilih, dan tombol delete nantinya akan diarahkan ke aksi hapus.
Selanjutnya kita akan membuat fungsi tambah dan form validasinya.
Fungsi getByUsername nantinya akan digunakan dalam validasi untuk mengecek username sudah digunakan atau belum. Berikut fungsi validasinya.
Fungsi ini nantinya akan menerima data inputan untuk divalidasi. Pertama kita membuat variable error dengan isinya array kosong, jadi ketika tidak ada error atau validasi berhasil maka fungsi ini akan mengembalikan array kosong.
Untuk pengecekan pertama yaitu jika inputan kosong maka variable array diisi dengan array asosiatif dengan key error dan key field yang inputannya kosong. Jadi setiap key field akan berbeda - beda tergantung yang kosong mana.
Setelah itu jika ada variable dengan key error, maka variable error akan di kembalikan. Jika tidak ada alias semua field terisi maka akan dilanjutkan ke pengecekan nama. Saya menggunakan fungsi preg_match yaitu fungsi untuk mengecek data dengan Regular Expression atau Regex, yang nantinya akan mengecek hanya boleh huruf dari huruf kecil maupun kapital mulai dari huruf a sampai z. Jika berhasil maka akan dilanjutkan ke pengecekan berikutnya, jika gagal variable error akan diisi dengan array dengan key error dan key field dengan message errornya.
Selanjutnya untuk pengecekan email, yaitu email harus memiliki symbol @ di tengah nya, jika berhasil maka akan dilanjutkan ke pengecekan berikutnya. Yaitu password, jika password bernilai false itu berarti tidak dilakukan pengecekan password. Password minimal 8 karakter dengan kombinasi angka.
Jika berhasil selanjutnya pengecekan username, saya menggunakan fungsi getByUsername untuk mengecek ketersediaan username. Jika berhasil maka yang terakhir akan di kembalikan variable error dari semua pengecekan diatas.
Selanjutnya membuat form tambah, atau halaman tambah bisa dilihat dibawah.
Jika tombol simpan di submit maka form akan mengembalikan ke halaman ini lagi, jika terdapat variable POST maka akan menjalankan fungsi insert yang tadi dibuat dan jika bernilai true maka akan dialihkan ke index.php, jika gagal maka akan mengembalikan pesan error nya dan ditampilkan.
Selanjutnya membuat fungsi update dan delete.
Fungsi getById nantinya akan digunakan di form update nantinya, untuk update jika username tidak berubah maka akan diisi dengan false yang artinya ketika melewati validasi tidak di validasi lagi. begitu juga dengan password.
Kita akan membuat file ubah.php
Jika ada GET dengan id, maka akan dicari dengan fungsi getById jika ada maka akan ditampilkan di form ubah. Ketika form ubah di submit akan kembali ke halaman ubah dan menjalankan fungsi update.
Untuk delete bisa tambahkan baris kode di file index.php jadi seperti ini
Oke sudah selesai, untuk hasilnya bisa lihat beberapa screenshot dibawah :
 |
| Menu tambah |
 |
| Tabel |
 |
| Hapus |
 |
| Menu edit |
