Senin, 02 Januari 2017

PHP - CRUD Berbasis OOP Menggunakan PDO dan Bootstrap Versi 2


Hallo pembaca setia Otrust!!
Selamat Tahun Baru 2017 guys? Semoga hari ini baik-baik saja dan sehat selalu. Melanjutkan tutorial yang saya tulis kemarin. Ini adalah tutorial versi ke-dua dari Otrust. Sebenarnya sama sih dengan yang kemarin bedanya kita akan melakukan perintah CRUD dengan penambahan file berupa foto. Jadi hanya sedikit yang berbeda.
Baiklah, mari kita kembali ke laptop dan ikutilah langkah-langkah dibawah ini:

1. Buatlah folder dan file seperti gambar berikut (Folder Database tidak perlu dibuat): 

Nah, silahkan perhatikan dari gambar tersebut:
  • Folder induk (crud-image-pdo-oop) memiliki 3 folder (folder database hanya digunakan sebagai tempat backup database bila perlu) yaitu, app, asset dan photo.
  • Folder app memiliki 2 folder(model dan view) dan 1 file .htaccess. Didalam folder model digunakan untuk melakukan perintah connection database dan execution of crud. Yang mana connection terletak pada file database.php dan execution of crud dimiliki file class.profile.php. Sedangkan folder view ditempati file-file yang mana Otrust beri index .blade (Mengikuti aturan dari laravel) untuk mengindikasikan bahwa file-file ini hubungannya hanya sebatas tampilan front-end nya saja. Dan file .htaccess digunakan sebagai perintah hak akses-nya. Untuk memahami tentang .htaccess bisa dibaca disini. Untuk file .htaccess silahkan tulis source berikut ini:

Deny From All

         Gunanya adalah untuk mencegah seseorang yang ingin mengakses file yang ada di folder app.

  • Didalam folder asset terdapat 3 folder. Sebenarnya folder tersebut tidak perlu dibuat, karena kita akan mengambil-nya dari website officialnya bootstrap. Untuk framework css bootstrap silahkan download disini. Lalu folder css, font dan js silahkan di copy dan paste didalam folder asset. Selanjutnya download file jquery disini. Dan letakkan didalam folder js lalu rename nama file menjadi jquery sehingga nanti hasilnya jquery.js.
  • Folder photo digunakan sebagai tempat penyimpanan file-file berupa foto yang akan kita upload.
Nah, demikian penjelasan dari folder tersebut. Apabila ada pertanyaan silahkan ajukan dikolom komentar, terima kasih.

2. Dalam tahap ini kita akan menyiapkan databasenya, silahkan buat databasenya dengan source code berikut ini:

3. Pada file database.php tulislah kode seperti berikut ini:

Source code didalam file database.php digunakan untuk melakukan koneksi database. Otrust yakin teman-teman paham tentang ini 😊.

4. Selanjutnya kita akan membuat eksekusi perintah CRUD, tepatnya pada file class.profile.php. berikut source code-nya:


5. Mengkoneksikan database dan perintah CRUD telah kita buat. Sekarang perhatikan pada folder view, kita akan membuat tampilan website dengan memanfaatkan bootstrap. Pertama kita akan menulis source code pada file header.blade.php:


kode menu.blade.php disini:


kode index.blade.php disini:


kode footer.blade.php disini:


6. Langkah-langkah nomor 5 telah kita tulis selanjutnya pada file index.php kita tulis seperti berikut ini:


Perhatikan pada source code tersebut, terdapat perintah untuk menghapus (delete) data. Jadi disini kita sudah membuat eksekusi untuk menghapus data. Selanjutnya nanti kita akan membuat perintah Insert dan Update.

7. Selanjutnya kita akan membuat form untuk menambahkan data. Tulislah source code pada file profile-add.blade.php:


Lalu tulislah source code berikut didalam file profile-add.php:


Apabila selesai coba jalankan dan lakukan insert data. Semoga berhasil πŸ˜€


Perhatian: Untuk melakukan penyimpanan data dengan file, cantumkan enctype="multipart/form-data" pada form. Perhatikan pada source code tampilan yang Otrust buat
8. Proses insert data selesai kita buat, selanjutnya kita akan membuat eksekusi perintah untuk Update data. Tulislah source code berikut pada file profile-edit.blade.php:


Lalu pada file profile-edit.php tulislah kode berikut:


Langkah-langkah CRUD pada tutorial ini telah selesai kita buat dan jalankan pada browser kalian. Apabila berhasil tampilannya akan menjadi seperti ini: 

Sekian tutorial dari Otrust, apabila ingin source code-nya cukup like fanspage facebook Otrust Tutorial disini. Lalu share postingan ini di facebook kalian. Otrust akan mengirimkan link source code ke inbox kalian. Apabila dalam waktu 24 jam belum dikirim silahkan inbox Otrust Tutorial yaah. Namanya juga manusia, pasti lupa atau mungkin Otrust belum cek pemberitahuan πŸ˜‚.

Maaf guys! Selain promosi fanspage, alasan Otrust tidak mencamtumkan link secara langsung adalah supaya teman-teman mau membaca. Tidak hanya copas dan atau Cuma download-download saja. Terima Kasih dan Happy CodingπŸ˜‡.
Location: Malang, Malang City, East Java, Indonesia

0 comments:

Posting Komentar