0% menganggap dokumen ini bermanfaat (0 suara)
26 tayangan92 halaman

Modul WP2

Modul Web Programming II ini ditulis oleh Raja Sabaruddin M.Kom untuk membantu mahasiswa memahami pembuatan web menggunakan Framework CodeIgniter. Modul ini mencakup materi dari pertemuan 1 hingga 15, termasuk penilaian akhir berupa presentasi proyek kelompok. Penulis berharap modul ini dapat menjadi referensi yang bermanfaat meskipun menyadari adanya kekurangan yang mungkin ada.

Diunggah oleh

Fakhrul Arifin
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
0% menganggap dokumen ini bermanfaat (0 suara)
26 tayangan92 halaman

Modul WP2

Modul Web Programming II ini ditulis oleh Raja Sabaruddin M.Kom untuk membantu mahasiswa memahami pembuatan web menggunakan Framework CodeIgniter. Modul ini mencakup materi dari pertemuan 1 hingga 15, termasuk penilaian akhir berupa presentasi proyek kelompok. Penulis berharap modul ini dapat menjadi referensi yang bermanfaat meskipun menyadari adanya kekurangan yang mungkin ada.

Diunggah oleh

Fakhrul Arifin
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 92

Modul Web Programming II

Penulis : Raja Sabaruddin M.Kom


Kata Pengantar

Segala puji syukur kepada Tuhan Yang Maha Esa karena berkat rahmatNya
penulisan modul Mata Kuliah Web Programming II dapat terselesaikan dengan baik.
Modul ini disusun untuk memenuhi kebutuhan mahasiswa dalam mata kuliah Web
Programming II yang disajikan dalam bentuk praktikum dan diharapkan dapat
membekali mahasiswa dalam memahami Pembuatan web dengan menggunakan
Framework Codeigniter.
Codeigniter merupakan salah satu framework terbaik yang ada saat ini. Banyak
website-website besar telah menggunakan codeigniter sabagai framwork utama dalam
membangun website maupun aplikasi. Selain kemudahkan dalam menggunakan,
codeigniter juga cepat, mudah di kustomisasi dan integrasikan dengan library atau
framework lainnya.
Penulis berharap Modul Web Programming II dapat menjadi acuan dan referensi
dalam membangun web aplikasi berbasis framework. Dimana pada penyusunan
materi web programming II mahasiswa mendapatkan materi dari pertemuan 1 s/d 10,
pada pertemuan 11 akan dilakukan review materi, selanjutnya pada pertemuan 12 a/d
15 mahasiswa mempresentasikan hasil dari membangun web berbasis framework
yang dimana kelompok dan tema sudah ditentukan pada awal kontrak perkuliahan.
Penilaian hasil dari presentasi projek kelompok mahasiswa akan menjadi nilai ujian
akhir semester.
Penulis menyadari sepenuhnya bahwa modul ini tentu memiliki banyak
kekurangan. Untuk itu penulis dengan lapang dada menerima masukan dan kritik
yang konstruktif dari berbagai pihak demi kesempurnaannya di masa yang akan
datang. Semoga modul ini dapat bermanfaat bagi para pembaca.

Pontianak, September 2021


Penulis,

Raja Sabaruddin, M.Kom

2
Daftar Isi

Modul Web Programming II .......................................................................................... 1


Kata Pengantar ............................................................................................................... 2
Daftar Isi ........................................................................................................................ 3
Apa Sih Pemrograman Web? ......................................................................................... 5
Bahasa Pemrograman Web .................................................................................... 5
Mengenal Apa itu Framework ....................................................................................... 7
Fungsi Framework ................................................................................................. 7
Jenis-Jenis Framework ........................................................................................... 7
Jadi, Apa itu Framework? ...................................................................................... 9
Rekomendasi Framework PHP Populer di 2021 ......................................................... 10
Apa itu framework PHP? ..................................................................................... 10
Mengapa perlu menggunakannya? ...................................................................... 10
Framework PHP yang populer di tahun 2021 ...................................................... 11
Model View Controller(MVC) .................................................................................... 12
Pengertian MVC .................................................................................................. 12
Alur Model View Controller ................................................................................ 12
Manfaat dari MVC ............................................................................................... 13
Framework yang Menggunakan Konsep MVC ................................................... 13
Contoh Kasus ....................................................................................................... 14
CodeIgniter .................................................................................................................. 15
Apakah CodeIgniter Tepat untuk Digunakan? .................................................... 15
Perbedaan CodeIgniter 3 dan CodeIgniter 4 ........................................................ 15
Dasar-Dasar Penggunaan CodeIgniter 4 .............................................................. 17
Spesifikasi yang dibutuhkan oleh codeigniter 4 .................................................. 17
Install CodeIgniter 4 .................................................................................................... 18
Menginstall Secara Manual.................................................................................. 18
Menginstall dengan Composer ............................................................................ 18
Masalah saat menginstall extention intl belum aktif............................................ 19
Menjalankan Codeigniter 4 .................................................................................. 19
Menggunakan cara manual .................................................................................. 19
Mengakses dengan local development server ...................................................... 20
Cara Membuat Controller ............................................................................................ 21
Cara Membuat Method di Controller ................................................................... 22
PASSING URI Segment ke Method Controller .................................................. 24
Membuat Private Method .................................................................................... 25
Membuat Controller di Sub direktori ................................................................... 26
Mengatur Routing di Codeigniter 4 ............................................................................. 28
Mengenal Routing ................................................................................................ 28
Membuka File untuk setting Routing .................................................................. 28
Menambahkan Routing baru ................................................................................ 29
Membuat Routing Baru........................................................................................ 30
Mengatur Route Name ......................................................................................... 30
Membuat Closure di Routing ............................................................................... 32
Membuat Placeholder di Routing ........................................................................ 32
Membuat Multiple Routing.................................................................................. 34
Membuat Group Route ........................................................................................ 36

3
Membuat View di Codeigniter 4.................................................................................. 38
Cara Membuat View ............................................................................................ 38
Cara Menampilkan View ..................................................................................... 38
Cara Menampilkan Views di dalam Subdirektori ................................................ 39
Mengakses Multiple View ................................................................................... 40
Menampilkan data dari Controller ke View......................................................... 42
Menampilkan data berupa array dari controller ke view menggunakan Looping 43
Membuat Model dan Interaksi Database melalui model di Codeigniter 4 .................. 46
Cara Membuat Model .......................................................................................... 46
Cara Mengakses Model........................................................................................ 46
Persiapan Database & Koneksikan Codeigniter dengan database ............................... 49
Koneksikan Codeigniter 4 dengan database ........................................................ 50
Konfigurasi Model agar dapat mengakses database ............................................ 50
Perintah Insert Data.............................................................................................. 54
Perintah Update Data ........................................................................................... 55
Perintah Save ....................................................................................................... 56
Method Save untuk update data ........................................................................... 57
Method Save untuk insert data ............................................................................. 57
Method Save untuk update tanpa array ................................................................ 58
Perintah Delete ..................................................................................................... 59
Menghapus data dengan beberapa ID .................................................................. 59
Menghapus data dengan perintah where .............................................................. 60
Menghapus Permanent Seluruh data dari fitur SoftDeletes ................................ 60
Menghapus Data secara permanen....................................................................... 60
Menampilkan Data ............................................................................................... 60
Menggunakan method find ................................................................................. 60
Menggunakan method find Column .................................................................... 61
Menggunakan method findAll ............................................................................ 62
Menggunakan method findAll dengan withDeleted ............................................ 63
Ujian Tengah Semester ................................................................................................ 64
Membuat Layout / Template di Codeigniter 4 ............................................................. 65
Preview Tampilan Template ................................................................................ 66
Membuat View untuk bagian template ................................................................ 66
Mengatur bagian content agar bersifat dinamis ................................................... 68
Menggunakan Layout dibagian View .................................................................. 71
Method Include untuk menambahkan View Partial............................................. 73
Penanganan Form dan Form Validasi di Codeigniter 4 ............................................... 79
Buat Sebuah Controller Siswa ............................................................................. 79
Membuat File View dengan nama formSiswa.php .............................................. 79
Mengakses Inputan Form di Controller ....................................................... 81
MEMBUAT VALIDASI FORM ......................................................................... 83
Testing Form Validation ...................................................................................... 85
Hasil Akhir ........................................................................................................... 86
PRESENTASI PROJEK .............................................................................................. 89
Tugas Projek (Kelompok) .................................................................................... 89
UJIAN AKHIR SEMESTER ....................................................................................... 91
DAFTAR PUSTAKA .................................................................................................. 92

4
Apa Sih Pemrograman Web?

Web Programming atau Pemrograman Web merupakan istilah yang erat


kaitannya dengan internet dan website. Memang benar, karena pemrograman web
merupakan suatu proses pembuatan website untuk keperluan internet. Orang banyak
mengenal web dengan istilah WWW atau World Wide Web. World Wide Web adalah
halaman-halaman website yang terkoneksi satu dengan lainnya atau disebut juga
dengan hyperlink yang membentuk samudera informasi yang berjalan dengan
protokol HyperText Transfer Protocol (HTTP).

Bahasa Pemrograman Web

Dalam semua ilmu tentang pemrograman baik itu desktop, mobile, game maupun
software atau aplikasi lainnya pasti selalu ada bahasa-bahasa pemrograman yang
digunakan untuk membuat aplikasi tersebut yang berisi statement-statement, perintah,
atau pun fungsi agar aplikasi yang dibuat sesuai dengan apa yang telah didesain oleh
si programmer. Oleh karena itu pemrograman web pun memiliki banyak bahasa yang
digunakan, di antaranya:
• HyperText Markup Language (HTML)
HTML sebenarnya bukan sebuah bahasa pemrograman, melainkan markup
language atau bahasa penandaan yang terdiri dari kumpulan tag. Pada dasarnya
HTML hanya mendeskripsikan bahwa bagian tertentu dalam sebuah halaman web
adalah isi yang harus ditampilkan oleh browser dengan cara tertentu. HTML
merupakan standar internet yang didefinisikan dan dikendalikan oleh World Wide
Web Consortium (W3C).
• Cascading Style Sheet (CSS)
CSS merupakan bahasa stylesheet yang digunakan untuk mengatur tampilan suatu
dokumen yang ditulis dengan HTML. CSS juga memiliki css framework dan
digunakan untuk menambah desain-desain tertentu pada halaman web agar desain
halaman menarik untuk dilihat. Penggunaan CSS paling umum adalah untuk
mengatur halaman web yang ditulis dengan HTML atau XHTML.
• Hypertext Preprocessor (PHP)
Bahasa pemrograman PHP merupakan salah satu bahasa scripting yang wajib
dikuasai oleh seorang web developer. Karena sifatnya yang server-side scripting,
maka untuk menjalankan bahasa pemrograman PHP tidak bisa hanya memanggil file
yang berekstensi PHP saja. Bahasa pemrograman PHP memerlukan sebuah web
server untuk menjalankannya. PHP juga dapat diintegrasikan dengan HTML,
JavaScript, jQuery, Ajax dan lain sebagainya. Akan tetapi pada umumnya bahasa
pemrograman PHP digunakan bersamaan dengan file yang bertipe HTML agar file
tersebut dapat menjalankan berbagai fungsi.
• JavaScript
JavaScript adalah bahasa scripting yang berjalan pada sisi client. Maksudnya
adalah pemrosesan script dilakukan sendiri pada komputer user. Biasanya JavaScript
digunakan untuk membuat animasi-animasi dan bentuk interaktif lain pada halaman
web. Terbukti dari banyaknya library-library JavaScript yang dapat digunakan
oleh programmer untuk membuat halaman web yang dibuat menjadi lebih interaktif.
Untuk menjalankan script yang ditulis dalam JavaScript, kita membutuhkan browser

5
yang mendukung dan mampu menjalankan JavaScript atau sering disebut
dengan javascript-enabled browser.
• Structured Query Language (SQL)
SQL merupakan domain-spesific language yang digunakan untuk mengolah data
dalam Relational Database Management System (RDBMS). Aplikasi RDBMS yang
banyak digunakan oleh para programmer aplikasi web untuk mengolah basis data
mereka adalah MySQL. Biasanya digunakan fungsi-fungsi dalam bahasa
pemrograman PHP untuk membuat, membaca, mengubah atau pun menghapus data
dalam SQL yang kemudian dapat ditampilkan pada halaman web.
Selain bahasa di atas, bisa dikatakan hampir semua bahasa pemrograman dapat
digunakan dalam pemrograman web selama bahasa tersebut dapat bekerja dalam web
server dan dapat menciptakan HTML, XML, dan XHTML. Beberapa bahasa
pemrograman web yang populer di antaranya yaitu PHP, ASP.NET, Ruby on Rails,
PERL, ASP classic, Python, dan JSP.

6
Mengenal Apa itu Framework

Framework adalah sebuah kerangka kerja yang digunakan untuk


mengembangkan website. Framework ini diciptakan untuk membantu web developer
dalam menulis baris kode. Dengan menggunakan framework penulisan kode akan
jauh lebih mudah, cepat, dan terstruktur rapi.

Fungsi Framework

Framework memiliki fungsi utama untuk memudahkan web developer dalam


membuat sebuah website. Selain itu, framework juga memiliki fungsi lain. Berikut di
antaranya:
• Membuat kode program menjadi lebih terstruktur
Framework biasanya memiliki pola arsitektur dalam menuliskan kode. Sehingga,
kode yang dituliskan lebih mudah dan struktur. Dampaknya, kamu dapat dengan cepat
menemukan kesalahan dan langsung memperbaikinya.
• Meningkatkan keamanan
Selain membuat kode lebih terstruktur, framework dapat meningkatkan keamanan
website kamu. Seperti contohnya framework Laravel yang sudah mengadopsi
berbagai sistem keamanan seperti autentikasi, enkripsi, dan hashing.
• Mempercepat pembuatan website
Berikutnya adalah framework ini dapat mempercepat pembuatan website. Hal itu
karena pengembang dapat menggunakan komponen-komponen yang sudah
disediakan dan tidak perlu menulis kode dari awal, sehingga dapat mempercepat
pembuatan sebuah website.
• Pemeliharaan dan perawatan website lebih mudah
Framework ini dapat mempermudah kamu dalam memperbaiki dan merawat
website. Perbaikan bug, maintenance menambah fitur dan meningkatkan keamanan
website akan jadi lebih mudah karena kebanyakan framework sudah menggunakan
pola arsitektur yang beragam.

Jenis-Jenis Framework

Ada beragam jenis framework yang sering digunakan untuk membuat website.
Setiap framework memiliki fungsinya masing-masing dan juga menggunakan bahasa
pemrograman yang berbeda juga. Nah, berikut ini adalah jenis-jenis framework untuk
membuat suatu website.
⚫ Framework CSS
Cascading Style Sheet atau yang disingkat menjadi CSS adalah bahasa
pemrograman yang digunakan untuk mengatur layout dan tampilan pada HTML agar
menjadi lebih menarik. Biasanya CSS ini dibuat oleh front end developer. Berikut ini
adalah beberapa contoh dari framework CSS.
• Bootstrap
Yang pertama adalah Bootstrap. Framework ini memiliki tampilan yang modern,
dinamis, dan juga lebih ramah pengguna. Fitur lain dari framework ini adalah website
yang dibuat menggunakan bootstrap ini akan responsive jika dibuat dengan mengikuti
aturan-aturan yang disediakan bootstrap.

7
• Semantic UI
Framework ini memiliki kelebihan dalam penulisan class yang lebih mudah
dibandingkan framework lain. Selain itu ia juga menyediakan banyak komponen UI
yang berguna untuk membuat tampilan HTML menjadi lebih menarik.
• Materialize
Framework ini dibuat dengan tujuan untuk mengembangkan desain yang
memungkinkan pengguna merasakan pengalaman yang serupa saat menggunakan
produk di semua platform. Materialize ini mengadaptasi Material Design yang dibuat
dan dikembangkan oleh Google.

⚫ Framework JavaScript
JavaScript merupakan bahasa pemrograman yang sering digunakan oleh para
front end developer dalam pembuatan tampilan website menjadi lebih interaktif.
JavaScript merupakan bahasa pemrograman yang berjalan pada sisi front end dan
masuk ke dalam golongan bahasa pemrograman tingkat tinggi. Berikut ini merupakan
beberapa framework JavaScript yang sering digunakan.

• AngularJS
Framework AngularJS ini bersifat open source dan ia berjalan pada sisi client
dengan menggunakan konsep MVC untuk membuat tampilan dari website menjadi
lebih dinamis.
• ReactJS
ReactJS adalah framework yang dikembangkan oleh Facebook. Ia sering
digunakan untuk membuat UI untuk suatu website atau aplikasi mobile karena
ReactJS ini dapat digunakan secara multi platform. ReactJS ini merupakan inti dari
React Native yang dapat memungkinkan kamu untuk mengembangkan aplikasi
mobile di dua sistem operasi secara bersamaan, yaitu Android dan iOS.
⚫ Framework PHP

PHP atau Hypertext Preprocessor adalah bahasa pemrograman yang digunakan


untuk komunikasi dari sisi server. Berikut ini adalah beberapa framework PHP yang
populer digunakan dalam pembuatan website.

• CodeIgniter
CodeIgniter atau dapat disingkat menjadi CI merupakan framework dengan
arsitektur yang khas, yaitu arsitektur MVC (Model, View, controller). Dengan begitu
kamu dapat menulis kode dengan lebih terstruktur dan spesifik.

• Laravel
Laravel ini biasanya digunakan oleh para developer untuk mengembangkan
website dengan kompleksitas yang tinggi. Ia memiliki library yang lengkap serta
memilih sintaksis atau kode yang elegan, ringkas, dan rapi.

• Symfony
Symfony ini cocok digunakan untuk mengembangkan website dengan skala yang
besar dan kompleks. Ia juga memakan sedikit memori jika dibandingkan dengan
framework lainnya dan menghasilkan performa yang tinggi.

8
Jadi, Apa itu Framework?

Jadi, itulah pembahasan kali ini. Framework ini dapat diartikan sebagai kerangka
kerja yang digunakan untuk mempermudah web developer dalam mengembangkan
website. Banyak fungsi yang menguntungkan para developer jika ia menggunakan
framework ini seperti dapat menghemat waktu dan biaya pembuatan aplikasi. Kamu
juga dapat menggunakan berbagai jenis framework sesuai dengan kebutuhanmu. Ada
tiga jenis framework yang sering digunakan oleh para web developer, yaitu
framework CSS, framework JavaScript, dan framework PHP.
Masing-masing framework memiliki fungsi dan kegunaan masing-masing ya, jadi
pilihlah framework yang sesuai dengan kebutuhanmu.

9
Rekomendasi Framework PHP Populer di 2021

Jika dulu proses pembuatan sebuah website terkenal sangat rumit dan memakan
banyak waktu? Itu karena tidak adanya struktur paling dasar yang membantu para
developer dalam membuat sebuah website. Namun sejak munculnya beragam
framework PHP proses pembuatan website terasa lebih cepat dan mudah.Mengapa
membuat website dengan framework akan terasa lebih mudah? Hal itu karena
framework menyediakan struktur dasar untuk sebuah website. Terlebih, PHP adalah
salah satu bahasa pemrograman yang banyak digunakan oleh web developer.
Pada pembahasan kali ini, kami akan memberikan informasi mengenai
framework PHP. Mulai dari alasan menggunakan framework PHP sampai dengan
rekomendasi framework PHP yang populer di tahun 2021.

Apa itu framework PHP?

Framework PHP adalah sebuah software yang berfungsi untuk mempermudah


proses pengembangan website dengan cara menyediakan struktur dasar untuk
membuat suatu website. Dengan menggunakan framework, proses pembuatan suatu
website akan jauh lebih cepat.

Mengapa perlu menggunakannya?

Ada banyak alasan mengapa kamu dapat menggunakan framework PHP untuk
membangun websitemu, berikut adalah beberapa alasannya.

⚫ Proses development menjadi lebih cepat


Seperti yang sudah dijelaskan, proses pembuatan sebuah website dengan
menggunakan framework PHP akan lebih cepat. Hal itu karena ia sudah
menyediakan beragam libraries dan tools yang dapat membantu developer.

⚫ Mengurangi penulisan code


Karena framework ini sudah menyediakan beragam libraries dan tools otomatis
penulisan kode akan jauh lebih pendek, karena developer tidak perlu menuliskan
kode asli yang panjang.

⚫ Menyediakan banyak libraries


Dalam sebuah website terdapat beragam perintah umum yang perlu dibuat oleh
developer untuk mendukung website agar berjalan dengan maksimal. Contohnya
seperti melakukan validasi dan CRUD operations (Create, Read, Update, and
Delete). Penggunaan framework akan sangat membantu kamu dalam membuat itu
semua, daripada kamu harus menuliskan function yang kamu buat sendiri, kamu
cukup menggunakan framework untuk mempermudah hal tersebut.
⚫ Lebih mudah untuk merawat code
Dengan menggunakan framework PHP, kamu tidak perlu khawatir dengan code
yang kamu buat. Code akan lebih mudah untuk di maintenance atau dirawat.

10
Selain itu kamu juga tidak perlu khawatir perihal perawatan dari inti framework,
karena hal tersebut sudah dilakukan oleh pengembang framework.

Framework PHP yang populer di tahun 2021

Jadi kamu sudah tau kan apa itu framework PHP dan alasan menggunakannya?
Nah, sekarang kita masuk ke dalam pembahasan utama, yaitu framework PHP
terpopuler di tahun 2021. Simak baik-baik ya, siapa tau kamu tertarik untuk
menggunakan salah satu framework ini dalam membuat website.
⚫ Laravel
Yang pertama adalah Laravel. Framework ini sangat populer di kalangan web
developer dan diperkenalkan pada tahun 2011. Laravel memiliki sintaksis atau
kode yang elegan, ringkas, dan rapi. Ia digunakan untuk mengembangkan
website yang memiliki tingkat kompleksitas yang tinggi. Selain itu, kelebihan
lain dari Laravel adalah memiliki library yang lengkap, kemampuan yang dapat
diandalkan, dan komunitas yang cukup besar.
⚫ CodeIgniter
Berikutnya adalah CodeIgniter atau disingkat menjadi CI. Framework ini
diluncurkan pada tahun 2006 dan memiliki arsitektur yang khas yaitu Model
View Controller (MVC). Melalui arsitektur MVC, kode yang ditulis lebih
terstruktur karena ia dipisahkan berdasarkan tugas secara spesifik. Jika kamu
adalah developer yang baru ingin mempelajari framework PHP, CodeIgniter ini
dapat menjadi pilihan yang tepat, karena mudah untuk dipahami. Tetapi di balik
kemudahannya itu, framework ini memiliki beberapa kekurangan seperti
library-nya yang kurang lengkap dan proses testing yang cukup rumit.
⚫ Symfony
Selanjutnya adalah Symfony. Jika diurutkan dari yang paling populer symfony ini
menempati urutan ketiga setelah Laravel dan CodeIgniter. Meski diluncurkan
pada tahun 2005, Symfony masih digunakan dalam mengerjakan berbagai proyek,
baik proyek kecil maupun besar. Framework ini cocok digunakan dalam
mengembangkan website yang berskala besar dan kompleks. Kelebihan dari
framework ini adalah dapat mengonsumsi memori lebih sedikit ketimbang
framework lain serta menghasilkan performa yang tinggi. Kamu tidak perlu
khawatir ketika menggunakan Symfony karena ia memiliki komunitas yang
cukup besar.
⚫ CakePHP
Berikutnya ada CakePHP. Framework ini sudah banyak digunakan oleh ribuan
website, baik website yang bersifat statis maupun dinamis. Alasan CakePHP ini
banyak digunakan adalah karena ia dapat mencegah terjadinya SQL Injection,
mendukung MVC, dan mudah untuk dikonfigurasi.
⚫ Yii Framework
Yang terakhir adalah Yii Framework. Framework ini memiliki keamanan dan
kinerja yang baik.. Karena alasan itu ia sangat sesuai digunakan untuk
mengembangkan website modern. Framework ini memiliki kelebihan seperti
mudah untuk dipelajari, memiliki fitur keamanan yang baik, dan dapat
diintegrasikan dengan jQuery.

11
Model View Controller(MVC)

Konsep arsitektur MVC atau Model-View-Controller, kemungkinan besar adalah


istilah yang paling sering disebutkan dalam dunia web-programming beberapa tahun
terakhir ini (Pablo Pastor, 2010)[1]. Orang-orang yang bersinggungan secara langsung
atau pun tidak langsung dengan dunia pembangunan aplikasi berbasis web pasti
pernah mendengar istilah MVC, dikarenakan kepopuleran dan urgensitas-nya.

Pengertian MVC

Model View Controller atau yang dapat disingkat MVC adalah sebuah pola
arsitektur dalam membuat sebuah aplikasi dengan cara memisahkan kode menjadi tiga
bagian yang terdiri dari:
⚫ Model
Bagian yang bertugas untuk menyiapkan, mengatur, memanipulasi, dan
mengorganisasikan data yang ada di database.
⚫ View
Bagian yang bertugas untuk menampilkan informasi dalam bentuk Graphical
User Interface (GUI).
⚫ Controller
Bagian yang bertugas untuk menghubungkan serta mengatur model dan view
agar dapat saling terhubung.

Alur Model View Controller

Setelah kamu mengetahui penjelasan dan komponen dari MVC, sekarang kita
akan membahas alur proses dari MVC. Berikut ini adalah alur prosesnya.
⚫ Proses pertama adalah view akan meminta data untuk ditampilkan dalam bentuk
grafis kepada pengguna.
⚫ Permintaan tersebut diterima oleh controller dan diteruskan ke model untuk
diproses.
⚫ Model akan mencari dan mengolah data yang diminta di dalam database
⚫ Setelah data ditemukan dan diolah, model akan mengirimkan data tersebut
kepada controller untuk ditampilkan di view.
⚫ Controller akan mengambil data hasil pengolahan model dan mengaturnya di
bagian view untuk ditampilkan kepada pengguna.

12
Manfaat dari MVC

Ada beragam manfaat ketika kamu menerapkan MVC ini dalam pembuatan
aplikasi kamu. Berikut ini adalah manfaatnya.
⚫ Proses pengembangan aplikasi menjadi lebih efisien
Penggunaan MVC dapat mempercepat pengembangan aplikasi karena kode dapat
dikerjakan oleh beberapa developer. Contohnya dalam kasus pengembangan
aplikasi web, bagian model dan controller dapat dikerjakan oleh back-end
developer sedangkan bagian view dapat dilakukan oleh front-end developer.
⚫ Penulisan kode menjadi lebih rapi
Karena dibagi menjadi tiga bagian, maka penulisan kode akan jadi lebih rapi dan
memudahkan developer lain untuk mengembangkan kode tersebut.
⚫ Dapat melakukan testing dengan lebih mudah
Untuk memastikan seluruh aplikasi bekerja sesuai dengan rencana maka langkah
testing atau uji coba wajib dilakukan. Dengan menggunakan model view
controller ini, maka proses uji coba dapat dilakukan pada setiap bagian.
⚫ Perbaikan bug atau error lebih cepat untuk diselesaikan
Penggunaan MVC dapat memudahkan developer untuk memperbaiki error atau
bug yang terjadi. Developer dapat fokus untuk menemukan dan memperbaiki
masalah yang terjadi karena kode dituliskan pada bagian-bagian terpisah.
⚫ Mempermudah pemeliharaan
Konsep MVC ini dapat mempermudah pemeliharaan aplikasi, karena script atau
kode yang lebih rapi dan terstruktur sehingga mempermudah developer dalam
proses pemeliharaan aplikasi.

Framework yang Menggunakan Konsep MVC

Untuk framework PHP, ada cukup banyak dan hampir semuanya menggunakan
konsep MVC:
⚫ Laravel
⚫ Symfony
⚫ CakePHP
⚫ Zend
⚫ Yii Framework
⚫ Codeigniter (versi 3 kebawah sudah tidak recommended untuk dipelajari) dll
Untuk framework Python di antaranya:
⚫ Django
⚫ Turbogears2
⚫ Watson-Framework
Untuk framework Nodejs di antaranya:
⚫ Express
⚫ Adonis
⚫ Sails.js
⚫ Total.js
⚫ Mean.js
⚫ Mojito
Dari tulisan ini telah jelaslah mengenai konsep dasar MVC. Dengan memiliki
pemahaman terhadap konsep ini, kita tidak akan menemukan kesulitan yang berarti

13
ketika mempelajari framework baru. Karena framework-framework tersebut bekerja
dengan arsitektur yang kita sudah nyaman dengannya.

Contoh Kasus

1. Ketika anda memasuki perpustakaan kemungkinan anda diminta untuk mengisi


buku tamu. Kebetulan buku tamu di perpustakaan yang anda kunjungi
menggunakan aplikasi web. Jadi di sana sudah terdapat satu komputer, di mana
setiap pengunjung perpustakaan harus melewati dan mengisi datanya melalui
komputer tersebut.
2. Ketika anda melihat layar komputer, di sana ditampilkan form untuk mengisi data
diri pengunjung. Kita bisa simpulkan bahwa di sini, browser (sebagai client)
meminta aksi kepada server (yang ditangani oleh controller) untuk menampilkan
halaman form input data. Lalu controller memutuskan dan mengerti bahwasanya
ia hanya perlu menampilkan view. Maka controller memanggil dan
mengembalikan view (atau halaman) yang diminta.
3. Anda kemudian mengisi data. Lalu menekan tombol submit. Di sini browser
(sebagai client) mengirimkan data anda kepada server. Data itu ditangkap oleh
controller dan controller tahu apa yang harus dia lakukan. Yaitu memanggil
model dan memberi data tersebut untuk kemudian disimpan (oleh model) ke
dalam database. Setelah proses penyimpanan selesai, controller memanggil dan
mengembalikan view kepada user sebagai informasi bahwa data telah masuk.
4. Jika ada pengunjung baru, maka kembali ke step 1.

14
CodeIgniter

CodeIgniter adalah sebuah framework yang digunakan untuk pengembangan


aplikasi. CodeIgniter tergolong sebuah toolkit yang berguna untuk membantu
developer dalam membangun project dalam bahasa PHP. CodeIgniter ditujukan guna
memungkinkan Anda agar lebih cepat dalam mengembangkan proyek daripada yang
Anda bisa jika Anda menulis semua kode dari awal. Untuk mempercepat proses
developing, CodeIgniter menyediakan kumpulan pustaka atau library.
Pustaka ini kaya akan general task yang dibutuhkan developer. Selain itu,
CodeIgniter dilengkapi dengan interface sederhana dan struktur yang logis sehingga
mengakses pustaka ini menjadi jauh lebih mudah. CodeIgniter membantu Anda untuk
mengerjakan berbagai proyek secara kreatif dan fokus.Hal ini pun dilakukan dengan
meminimalkan jumlah kode yang dibutuhkan untuk tugas tertentu.
CodeIgniter juga dibuat sefleksibel mungkin, agar Anda dapat bekerja dengan cara
yang Anda inginkan. Anda pun tidak dipaksa untuk bekerja dengan cara tertentu
seperti yang ada pada framework lain.
Framework ini memiliki bagian inti yang fleksibel karena mudah diperpanjang
atau diganti sepenuhnya untuk membuat sistem bekerja seperti yang Anda inginkan
dan butuhkan. Singkatnya, CodeIgniter adalah framework lunak yang mencoba
menyediakan alat yang Anda butuhkan sambil menghindarinya.

Apakah CodeIgniter Tepat untuk Digunakan?

Beberapa hal yang mungkin Anda inginkan dan Anda butuhkan dalam
membangun sebuah website maupun aplikasi:
⚫ Anda menginginkan framework dengan tapak kecil.
⚫ Anda membutuhkan kinerja yang luar biasa.
⚫ Anda menginginkan framework yang membutuhkan konfigurasi hampir nol.
⚫ Anda ingin sebuah framework yang tidak mewajibkan Anda menggunakan
command line.
⚫ Anda menginginkan framework yang tidak mewajibkan Anda untuk mematuhi
aturan coding yang terbatas.
⚫ Anda tidak tertarik dengan perpustakaan monolitik skala besar seperti PEAR.
⚫ Anda menghindari kerumitan, menyukai solusi sederhana.
⚫ Anda membutuhkan framework dengan dokumentasi yang jelas dan menyeluruh.
Jika semua hal di atas Anda butuhkan dan Anda inginkan, maka CodeIgniter
adalah jawaban dari semua kebutuhan Anda. Saat ini CodeIgniter telah meningkatkan
layanannya dengan mengeluarkan CodeIgniter 4. Apa bedanya dengan CodeIgniter 3?
berikut penjelasnya selengkapnya pada segmen berikut.

Perbedaan CodeIgniter 3 dan CodeIgniter 4

Sebenarnya, CodeIgniter versi 4 sudah dilaunching sejak tahun 2020. Akan tetapi
tidak banyak developer yang menyadari hal tersebut. Hal ini dikarenakan banyak
orang yang sudah terlanjur senang dengan CodeIgniter atau framework PHP lainnya
yang lebih canggih seperti Laravel.

15
Ya, bisa dibilang CodeIgniter merupakan framework PHP yang cukup
ketinggalan zaman, di mana CodeIgniter 3 sudah ada bertahun-tahun lalu. Berbeda
dengan Laravel yang setiap waktu terus menerus memperbarui versinya.
Namun, bukan berarti versi ke-4 dari CodeIgniter ini tidak kalah bagus karena
ada banyak peningkatan yang dilakukan dari versi ketiga. Ini dia perbedaan
CodeIgniter 3 dan CodeIgniter 4:
⚫ Dukungan Versi PHP, CodeIgniter 4 dapat digunakan pada PHP minimal versi
7.2. sementara CodeIgniter 3 dapat beroperasi di PHP versi 5.6, yang mana PHP
versi tersebut telah di-discontinued.
⚫ Pengorganisasian direktori, Struktur file kedua versi ini benar-benar berbeda.
CodeIgniter versi 4 mempunyai struktural yang dibagi ke dalam 5 direktori:
/app,/system,/public,/writable,/tests. Sedangkan CodeIgniter 3 diatur dalam 2
direktori:/applicationand/system`.
⚫ Penggunaan Namespace, CodeIgniter versi 4 sepenuhnya ditulis dalam PHP 7.
Versi terbaru ini juga menggunakan namespace, sedangkan CodeIgniter 3 tidak
menggunakan namespace.
⚫ Autoloading, CodeIgniter4 mempunyai proses autoloading yang sangat efisien
bahkan jauh lebih efisien dari versi sebelumnya. Salah satu faktor yang
membantu hal ini adalah penggunaan namespace. Sementara di CodeIgniter 3,
sebagian besar file yang akan dimuat harus dikonfigurasi secara manual.
⚫ Penggunaan Entitas, CodeIgniter4 memiliki dukungan asli (native support) untuk
penggunaan Entitas yang membantu dalam menyusun bagian database dari suatu
aplikasi, yang mewakili kolom yang ada dalam tabel. CodeIgniter 3 tidak
memiliki fitur ini dan Anda perlu menggunakannya perlu menggunakan
perpustakaan pihak ketiga dan melakukan penyesuaian pada unggahan file untuk
mendukungnya.
⚫ Performa, CodeIgniter versi 4, untuk penggunaan PHP 7 secara tertulis dan
sebagai konfigurasi minimum pada server, dan aspek lainnya, memiliki kinerja
yang lebih baik daripada CodeIgniter 3.
⚫ Pustaka Monolitik, Tidak seperti CodeIgniter 3, dalam versi baru ini penggunaan
perpustakaan monolitik dalam gaya PEAR hampir nol.
⚫ Pengaturan, Dengan versi terbaru CodeIgniter ini, pengaturan awal agar aplikasi
Anda mulai berjalan minimal, sedangkan di CodeIgniter 3 perlu melakukan
sejumlah konfigurasi yang baik.
⚫ Dukungan asli untuk file .env
⚫ CodeIgniter versi terbaru ini memiliki dukungan asli untuk file .env,
memungkinkan pengoptimalan pengaturan lingkungan yang berbeda di mana ia
mungkin berjalan (produksi, pengujian, pengembangan). Fitur ini tidak ada secara
native di CodeIgniter 3.
⚫ Migrasi antara 2 versi, CodeIgniter 4 tidak kompatibel ke belakang, sehingga
proses memperbarui aplikasi dari versi 3 ke versi 4 akan membutuhkan sedikit
lebih banyak pekerjaan, tetapi sama sekali tidak rumit.
Sementara migrasi dari versi 2.x ke 3.x, dan antara versi 3.x yang berbeda hanya
menimpa file di direktori / sistem dan memperbarui nama beberapa file, dari versi 3
ke versi empat diperlukan struktur baru untuk aplikasi dan penulisan ulang semua
kelas yang digunakan di dalamnya untuk beradaptasi dengan standar baru.

16
Dasar-Dasar Penggunaan CodeIgniter 4

CodeIgniter versi keempat mendukung PHP versi 7.2+, jika server web Anda
tidak mendukung PHP 7.2+, kami sarankan untuk mengupgrade versi PHP Anda jika
ingin menggunakan versi terbaru ini. Selain itu, CodeIgniter 4 juga tidak dapat
berjalan jika server web Anda tidak mengaktifkan ekstensi intl, php-json,
php-mbstring, php-mysqlnd, dan php-xml.
Untuk menggunakan CURLRequest, Anda perlu menginstal libcurl. Database
sangat dibutuhkan pada sebagian besar pemrograman aplikasi web. Database yang
mendukung CodeIgniter versi terbaru saat ini adalah:
• MySQL (5.1+) melalui driver MySQLi
• PostgreSQL melalui driver Postgre
• SQLite3 melalui driver SQLite3
• MSSQL melalui driver SQLSRV (hanya versi 2005 ke atas)
Tidak semua driver telah dikonversi/ditulis ulang untuk CodeIgniter4. Penjelasan
tentang driver database akan dijabarkan sebagai berikut:
• MySQL (5.1+) melalui driver pdo
• Oracle melalui driver oci8 dan pdo
• PostgreSQL melalui driver pdo
• MSSQL melalui driver pdo
• SQLite menggunakan sqlite versi kedua dan driver pdo
• CUBRID melalui driver cubrid dan pdo
• Interbase/Firebird melalui driver ibase dan pdo
• ODBC yang digunakan melalui driver odbc dan pdo (Anda harus tahu bahwa
ODBC sesungguhnya adalah lapisan abstraksi)

Spesifikasi yang dibutuhkan oleh codeigniter 4

Saat tutorial ini dibuat codeigniter berada di versi 4.0.3, dan untuk
mengisntallnya anda memerlukan server requirement seperti berikut ini :
• Versi PHP >= 7.2
• intl & mbstring extention yang harus diaktifkan
• jika anda menggunakan CURL Request anda membutuhkan libcurl yang
terinstall

untuk dokumentasi resmi dari codeigniter 4 bisa dilihat di website resmi


codeigniter : https://codeigniter.com/user_guide/intro/requirements.html

17
Install CodeIgniter 4

Untuk proses instalasi dari codeigniter 4 bisa anda lakukan dengan beberapa cara
antara lain :
• Instalasi Secara Manual
• Instalasi Menggunakan Composer

Sebelum proses instalasi, pastikan anda menggunakan versi PHP >= 7.2, secara
terinstall extention yang dibutuhkan, bisa dilihat dulu spesifikasi yang dibutuhkan di
codeigniter 4. kita akan membahasnya menggunakan cara manual terlebih dahulu.

Menginstall Secara Manual

Untuk mendownload file codeigniter 4, anda bisa mengunjungi alamat berikut


ini : https://codeigniter.com/en/download

1. klik dibagian tombol “Download” maka anda akan mendownload file installer
codeigniter 4, dengan nama framework-4.0.3.zip (karena saat tutorial ini dibuat
berada di versi 4.0.3)
2. Copy di dalam folder htdocs/ dan ekstrak.
3. Ubah nama folder misalnya: codeigniter4

Menginstall dengan Composer

Setelah kita belajar bagaimana cara menginstall dengan cara manual, berikutnya
kita akan belajar menginstall dengan menggunakan composer. nah mungkin
teman-teman sudah menggunakan cara install manual, dan memberikan nama ci4app
pada folder codeigniter, ada baiknya teman – teman hapus dulu, karena di instalasi
dengan composer kita akan berikan nama yang sama pada folder yaitu ci4app
Pastikan anda sudah menginstall composer ya, untuk download composer bisa
mengakses halaman berikut ini : https://getcomposer.org/download/ Untuk proses
instalasi silahkan buka CMD / Terminal, lalu berikutnya arahkan folder di CMD itu
berada di direktori web server anda, dalam contoh ini adalah C:/xampp/htdocs lalu
tuliskan perintah :

18
composer create-project codeigniter4/appstarter ci4app
Keterangan :
ci4app adalah nama folder yang akan terbuat dan berisi file codeigniter 4
Tunggu proses instalasinya, lama instalasi tergantung koneksi internet yang anda
gunakan. jika selesai tampilan di CMD / Terminal akan menjadi seperti berikut ini :

Ketika proses instalasi dengan composer selesai, maka didalam folder htdocs
akan terdapat folder dengan nama ci4app, folder ini sesuai perintah yang digunakan
saat menginstall codeigniter4 menggunakan composer sebelumnya.

Masalah saat menginstall extention intl belum aktif

Untuk teman – teman yang menemui masalah yang mengatakan kita belum
mengaktifkan extention intl, masalah ini ditemui saat kita menginstall dengan
menggunakan composer. Cara untuk mengatasinya adalah sebagai berikut, silahkan
buka file php.ini, karena saya menggunakan xampp sehingga saya perlu membuka file
php.ini yang berada di C:/xampp/php/php.ini, bisa dibuka menggunakan text editor
semacam notepad saya asumsikan teman – teman sudah membuka file php.ini
Kemudian cari tulisan seperti ini extension=intl, hilangkan tanda titik koma
diawal sehingga kurang lebih seperti ini :
;extention=intl
menjadi
extention=intl
setelah itu restart service apache

Menjalankan Codeigniter 4

Untuk menjalankan project codeigniter 4, anda bisa menggunakan 2 cara yaitu :


⚫ menggunakan cara manual
⚫ menggunakan local development server

Menggunakan cara manual

Untuk menjalankan codeigniter 4 menggunakan cara manual, pastikan service


apache sudah berjalan karena dalam contoh ini kita menggunakan xampp karena
folder project codeigniter4 ini bernama ci4app, maka anda bisa mengaksesnya dengan
alamat : localhost/ci4app/public

19
Mengakses dengan local development server

Codeigniter 4 memiliki fitur local development server, sehingga anda bisa


menjalankan aplikasi meskipun service apache tidak dijalankan. caranya buka CMD /
Terminal lalu akses folder project anda. dalam contoh ini adalah
c:/xampp/htdocs/ci4app
lalu jalankan perintah :
php spark serve
sehingga kurang lebih seperti berikut ini :

Berikutnya anda bisa mengakses project codeigniter dengan menggunakan alamat :


localhost:8080

20
Cara Membuat Controller

Codeigniter 4 sudah mendukung arsitektur MVC (Model, View, Controller), nah


buat teman – teman yang belum mengenal konsep MVC ini, bisa baca artikel kami
sebelumnya mengenai Konsep MVC di Codeigniter. Pada pertemuan tersebut kita
menjelaskan peran masing – masing bagian MVC (Model,View, Controller) tapi ada
sedikit hal yang berbeda di Codeigniter 4, jika dibandingkan dengan versi sebelumnya
Codeigniter 3.
Codeigniter 4 dikenalkan konsep penulisan query semacam eloquent di Laravel,
yang lebih menyederhanakan perintah untuk mengakses database, nanti kita akan
bahas lebih lanjut di pembahasan tentang penggunaan model.
Baik kita mulai untuk membuat controller, anda bisa membuat controller pada
folder app/Controllers, dalam contoh ini kita akan membuat Controller dengan nama
Siswa. Silahkan buat file dengan nama Siswa.php didalam folder app/Controllers.
*Catatan Penting : Untuk membuat Controller gunakan awalan huruf Kapital, jadi
semisal seperti ini : Siswa.php, Kategori.php, Produk.php dll.

Berikutnya didalam file Siswa.php tambahkan skrip dibawah ini :


<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
echo 'Halo ini adalah controller Siswa';
}
}
Berikutnya anda bisa mengakses controller ini, dengan menggunakan URL
sebagai berikut :
localhost/ci4app/public/siswa
Hasilnya adalah sebagai berikut :

21
Penjelasan :
Kita akan bahas untuk file Controllers Siswa.php, pada line 3 kita menuliskan
namespace App\Controllers.
Line 5 kita buat class dengan nama Siswa, class ini kita extends dengan
BaseController. didalam class Siswa kita buat method dengan nama index (Line 7),
dimana didalamnya kita tuliskan perintah untuk menampilkan text dengan
menggunakan echo, text yang ditampilkan adalah “Halo ini adalah controller Siswa”
Method index adalah method yang pertama akan diakses ketika controller diakses,
sehingga saat kita mengakses controller Siswa yang diakses adalah method index.
Catatan Penting : Nama class untuk controller harus diawali huruf Kapital, dan
hanya karakter pertama yang dapat menggunakan huruf besar
Contoh penulisan class yang benar :
<?php namespace App\Controllers;

use CodeIgniter\Controller;

class Helloworld extends Controller


{

}
Contoh Penulisan class yang salah :
<?php namespace App\Controllers;

use CodeIgniter\Controller;

class helloworld extends Controller


{

}
<?php namespace App\Controllers;

use CodeIgniter\Controller;

class HelloWorld extends Controller


{

Cara Membuat Method di Controller

Setelah anda belajar mengenai pembuatan class untuk controller, berikutnya anda
akan belajar mengenai method di dalam controller. Pada contoh sebelumnya kita
sudah membuat method dengan nama index, dimana method dengan nama index,

22
adalah method yang otomatis diakses secara default, jika pada URL kita tidak
menuliskan nama method setelah nama Controller.
Sebagai contoh kita akan menambahkan method nama semisal, sehingga isi
controller menjadi seperti berikut ini :
<?php

namespace App\Controllers;

class Siswa extends BaseController

public function index()

echo 'Halo ini adalah controller Siswa';

public function nama()

echo "ini adalah method nama di controller Siswa";

}
Kemudian berikutnya coba akses method nama, dengan menggunakan URL :
localhost/ci4app/public/siswa/nama
hasilnya adalah sebagai berikut :

Keterangan :
Maka akan menampilkan text “ini adalah method nama di controller Siswa” hal
tersebut dikarenakan kita mengakses method nama, terlihat saat kita mengakses URL
kita menuliskan nama method, setelah nama controller.

23
PASSING URI Segment ke Method Controller

Berikutnya kita akan belajar untuk passing data melalui URI Segment, dimana data
ini dapat digunakan sebagai parameter method di controller. Anda bisa mengirimkan
data lebih dari satu melalui URI ini.. Sebagai contoh kita akan modifikasi code
controller Siswa yang sebelumnya sudah kita buat :
<?php

namespace App\Controllers;

class Siswa extends BaseController

public function index()

echo 'Halo ini adalah controller Siswa';

public function nama($nama, $usia)

echo "Nama Saya adalah " . $nama . " , Usia " . $usia;

}
Keterangan :
Kita menambahkan parameter dibagian method nama, kita buat 2 parameter,
yaitu nama dan usia (Line 12)
parameter ini kita tulis sebagai bentuk variabel yaitu $nama, $usia
Berikutnya coba gunakan url ini untuk mengakses method nama di class siswa.
http://localhost/ci4app/public/siswa/nama/taufik/17
Hasilnya akan menampilkan tampilan sebagai berikut :

Keterangan :
kita analisa dulu url yang digunakan untuk mengakses :
http://localhost/ci4app/public/siswa/nama/taufik/17

24
• http://localhost/ci4app/public : ini adalah url utama dari project codeigniter 4
kita, karena dalam contoh ini kita tidak menjalankan local development server
bawaan codeigniter.
• siswa : ini adalah nama controller
• nama : ini adalah nama method didalam controller
• taufik : ini adalah data pertama yang dipassing melalui URI Segment, taufik
ini akan dijadikan nilai dari variabel $nama didalam method nama controller
siswa
• 17 : ini adalah data kedua yang dipassing melalui URI Segment, 17 ini akan
Dijadikan nilai dari variabel $usia didalam method nama controller siswa
jadi bisa kita simpulkan kita mengirimkan 2 parameter, untuk nama = taufik, dan usia
= 17 kedalam method nama didalam controller Siswa. Berikutnya karena didalam
method nama kita menuliskan perintah sebagai berikut :
echo "Nama Saya adalah " . $nama . " , Usia " . $usia;
Sehingga didalam tampilan web muncul sebagai berikut : Nama Saya adalah taufik ,
Usia 17

Membuat Private Method

Berikutnya kita akan belajar untuk membuat private method di codeigniter 4,


istilah private method ini adalah method yang tidak bisa diakses melalui URL. Seperti
yang anda ketahui di codeigniter ketika kita membuat method didalam controller,
otomatis method itu bisa diakses melalui URL secara langsung, nah jika anda
membutuhkan pembuatan method yang tidak ingin bisa diakses melalui URL secara
langsung, bisa memanfaatkan fitur private method ini.
Sebagai contoh kita akan menambahkan sebuah method dengan nama testing,
tetapi untuk method ini kita berikan visibility protected, sehingga untuk class
controller Siswa menjadi seperti berikut ini :
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
echo 'Halo ini adalah controller Siswa';
}

public function nama($nama, $usia)


{
echo "Nama Saya adalah " . $nama . " , Usia " . $usia;
}

protected function testing()


{
echo "Ini adalah method testing yang merupakan private method";
}
}

25
Lalu coba kita mengakses method testing menggunakan URL berikut :
http://localhost/ci4app/public/siswa/testing
Maka hasilnya adalah sebagai berikut ini :

Maka akan terdapat pesan 404 File Not Found, hal ini dikarenakan untuk bagian
method testing kita berikan visibility protected yang menyebabkan, method itu
bersifat private.

Membuat Controller di Sub direktori

Berikutnya kita akan belajar untuk membuat controller didalam sebuah


subdirektori, seperti yang telah dijelaskan diawal controller disimpan didalam folder
App/Controllers.
Jika anda membutuhkan untuk membuat controller didalam subdirektori, semisal
aplikasi yang anda buat semakin besar, anda perlu membagi controller kedalam
beberapa folder, anda bisa menggunakan cara ini.
Dalam contoh ini kita akan membuat file controller dengan nama Users.php
didalam folder App/Controllers/Admin, silahkan dibuat file baru dengan nama
Users.php didalam folder App/Controllers/Admin
Jadi kurang lebih seperti berikut ini :

26
Catatan Penting : Nama folder harus diawali dengan huruf besar, dan hanya 1
karakter pertama yang menggunakan huruf besar. Berikutnya untuk isi code dari file
Users.php adalah sebagai berikut :
<?php

namespace App\Controllers\Admin;

use App\Controllers\BaseController;

class Users extends BaseController


{
public function index()
{
echo 'Halo ini adalah controller Users didalam Sub direktori Admin';
}
}
Berikutnya kita akan coba mengakses controller Users, URL nya adalah sebagai
berikut :
http://localhost/ci4app/public/admin/users
Hasilnya adalah sebagai berikut :

Keterangan :
Pada bagian url kita tuliskan nama sub direktori sebelum menuliskan nama
controllernya.
http://localhost/ci4app/public/admin/users
Terlihat kita menuliskan admin, sebelum kita menuliskan nama controller users
pada bagian controller kita merubah bagian namespace dengan menambahkan nama
subdirektori sehingga menjadi seperti berikut (line 30)
namespace App\Controllers\Admin;
Berikutnya kita tambahkan perintah dibawah ini :
use App\Controllers\BaseController;
agar tetep dalam extends basecontroller didalam controller tersebut.

27
Mengatur Routing di Codeigniter 4

Mengenal Routing

Routing adalah sebuah fitur yang disediakan oleh codeigniter 4, fitur ini
digunakan untuk mengatur ketika pengguna aplikasi mengakses URL tertentu apa sih
yang akan dilakukan oleh Codeigniter ?
Akan diarahkan ke controller dan method mana ? hal ini sangatlah penting untuk
mengatur proses yang dilakukan codeigniter ketika ada request dari pengguna aplikasi.
Mungkin pembahasanya agak rumit ya… kita akan coba sederhanakan ya, perhatikan
URL berikut ini : www.example.com/profil
Diatas ada contoh sebuah URL, dimana URL utamanya adalah
www.example.com, berikutnya disitu ada tulisan profil, nah ketika kita mengakses
URL itu maka web akan memberikan response tampilan tertentu, nah hal seperti ini
diatur dibagian routing.
Routing mengatur jika ada request URL dari pengguna, apa sih yang akan
dilakukan oleh aplikasi web, itu fungsi dari routing. Walaupun codeigniter ini tidak
seperti laravel, yang mengharuskan setiap halaman harus kita buatkan routing,
codeigniter lebih dinamis, meskipun kita tidak menuliskan perintah di routing,
controller serta method didalamnya masih dapat kita akses dengan memperhatikan
URI Segment yang ada di Codeigniter, jadi disini akan saya singgung terkait
Penggunaan URI Segment di Codeigniter 4.
Perhatikan URL berikut ini : www.example.com/siswa/profil/12 Kita akan coba
membagi URL diatas menjadi beberapa bagian sesuai dengan URI Segment, menjadi
seperti berikut ini :
• www.example.com adalah URL utama dari web
• siswa adalah Segment 1 yang merupakan nama controller
• profil adalah Segment 2 yang merupakan nama methodnya
• 12 adalah Segment 3 yang merupakan nilai parameter pertama dari method
pada segment 2
Jadi jika diartikan URL diatas akan mengakses method profil pada controller
siswa, serta mengirimkan nilai angka 12 sebagai nilai dari parameter di method profil.
itu adalah URI Segment, jika anda tidak mendaftarkan controller atau method melalui
routing, anda bisa menggunakan URI segment ini untuk mengakses controller ataupun
method tanpa mendaftarkannya dibagian routing. Akan tetapi jika anda ingin
membuat URL yang custom, anda bisa memanfaatkan fitur routing.

Membuka File untuk setting Routing

Saya asumsikan teman – teman sudah menginstall Codeigniter 4 di komputer


teman – teman, dalam contoh ini direktori project saya bernama ci4app, dan saya
simpan di web direktori dari xampp, yaitu berada c:/xampp/htdocs/ci4app
Untuk mengakses file untuk setting routing, anda bisa membukanya pada file
app/Config/Routes.php pada file ini terdapat 1 routing bawaan codeigniter, perhatikan
pada Line 33
$routes->get('/', 'Home::index');

28
Keterangan :
Pada baris perintah route tersebut ada 3 bagian yang perlu anda perhatikan :
⚫ pertama adalah HTTP Request Method, dalam contoh diatas adalah get, jika kita
isi dengan get, maka akan membaca URL yang kita tuliskan di URL Browser,
jika anda membuat pemrosesan terhadap entrian form bisa menggunakan post
⚫ kedua adalah URL yang akan digunakan, dalam contoh diatas kita menuliskan
‘/‘ artinya adalah mengakses halaman utama dari webnya
⚫ ketiga adalah controller dan method apa yang akan diakses saat pengguna aplikasi
mengakses url dibagian kedua.
Jadi keteika kita melihat contoh routing diatas, ketika kita mengakses halaman
utama dari web codeigniternya, maka codeigniter akan mengarahkan untuk
mengakses method index didalam controller Home.

Menambahkan Routing baru

Berikutnya kita akan belajar untuk menambahkan routing baru, untuk bahan
belajar, silahkan buat sebuah Controller dengan nama Siswa.
Buat file baru dengan Siswa.php dan simpan di folder app/Controllers, untuk isi
codenya adalah sebagai berikut ini :
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
echo 'Halo ini adalah controller Siswa';
}

public function profil()


{
echo 'Ini adalah method profil di controller Siswa';
}
}
Keterangan :
Kita buat controller dengan nama Siswa, sehingga classnya kita berikan nama
Siswa. Didalamnya kita buat 2 method dengan nama index, dan profil
Baik kita akan mencoba mengakses 2 method tersebut, kita jalankan dulu local
development server dengan menuliskan perintah :
php spark serve
Lalu akses URL berikut ini : http://localhost:8080/siswa
Maka akan menampilkan tulisan :
Halo ini adalah controller Siswa
Hal ini dikarenakan kita mengakses controller siswa, ingat untuk URI Segment
pertama, yang kita tuliskan setelah alamat webnya adalah controller, karena kita tidak
menuliskan methodnya sebagai URI Segment kedua, maka otomatis mengakses
method index, sehingga yang tampil adalah tulisan “Halo ini adalah controller Siswa”,

29
karena method yang otomatis diakses ketika kita tidak menulisnya di URI Segment
kedua setelah controller adalah method index
Berikutnya akses URL berikut ini :
http://localhost:8080/siswa/profil
maka akan menampilkan tulisan :
Ini adalah method profil di controller Siswa
Perhatikan dibagian URL kita menuliskan URI Segment 1 adalah siswa, dan URI
Segment 2 adalah profil, yang artinya kita mengakses method profil di bagian
controller siswa, sehingga menampilkan text “Ini adalah method profil di controller
Siswa”.

Membuat Routing Baru

Lalu berikutnya bagaimana kalau kita ingin, saat kita mengakses URL seperti
dibawah ini :
http://localhost:8080/profil-siswa
tuliskan perintah diatas dibawah perintah routing :
$routes->get('/', 'Home::index');
Setelah itu kita coba mengakses URL berikut ini, jangan lupa menjalankan local
development server dulu ya, dengan perintah php spark serve :
http://localhost:8080/profil-siswa

Penjelasan :
kita analisa routing yang kita buat ya, coba perhatikan
$routes->get('/profil-siswa', 'Siswa::profil');
Perintah routing diatas memiliki arti : ketika pengguna aplikasi mengakses url
profil-siswa, jadi kalau dicontohkan dalam hal ini adalah localhost:8080/profil-siswa,
dengan menggunakan method GET artinya kita menuliskan di URL Browser maka
akan mengakses method profil di Controller Siswa, sehinga akan menampilkan tulisan
“Ini adalah method profil di controller Siswa”, seperti yang tertulis pada method
profil di controller Siswa.

Mengatur Route Name

Berikutnya kita akan membahas mengenai route name, route name adalah fitur
untuk memberikan nama terhadap routing yang kita buat. Sebagai contoh kita akan
memberikan nama pada routing yang barusan kita buat dengan nama profil, maka kita
perlu merubah perintah routing menjadi seperti berikut ini :

1 $routes->get('/profil-siswa', 'Siswa::profil', ['as' => 'profil']);


Keterangan :

30
Kita menambahkan perintah [‘as’]=>’profil’ yang artinya routing ini kita berikan
nama profil. Baik setelah kita memberikan nama pada routing tersebut, lalu apa
fungsi ? dengan anda memberikan nama terhadap routing, anda bisa mengakses
routing menggunakan Link, sebagai contoh kita akan membuat link yang mengakses
routing dengan nama profil tersebut, sebagai contoh linknya akan kita letakkan di
method index di controller Siswa. ubah code controller Siswa menjadi seperti berikut
ini :
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
echo "Halo ini adalah controller Siswa <a href='" . route_to('profil') . "'>Link ke
routing profil</a>";
}

public function profil()


{
echo 'Ini adalah method profil di controller Siswa';
}
}
Berikutnya kita coba mengakses URL sebagai berikut ini :
http://localhost:8080/siswa
maka akan ada link dengan tulisan “Link ke routing profil“, silahkan klik link tersebut

maka anda akan diarahkan ke URL


http://localhost:8080/profil-siswa
Hal tersebut karena pada link tersebut kita mengakses routing dengan nama profil,
perintahnya seperti pada line 9 controller Siswa :
echo "Halo ini adalah controller Siswa <a href='" . route_to('profil') . "'>Link ke
routing profil</a>";
kita bisa menggunakan function route_to(‘nama routing’) lalu dibagian parameter
tuliskan nama routing, dalam contoh ini kita tuliskan profil, sehingga ketika klik link
itu, akan mengakses routing dengan profil, yang akan mengakses url :
http://localhost:8080/profil-siswa.

31
Membuat Closure di Routing

Berikutnya kita akan membahas cara membuat closure di routing, jadi kita bisa
membuat function yang berisi perintah php, dimana akan dijalankan ketika routing
diakses, sebagai contoh kita akan menambahkan routing dengan nama coba, silahkan
buka file routing didalam folder : app/Config/Routes.php
berikutnya tambahkan code seperti berikut ini dibagian routing.

1 $routes->get('/coba', function () {
2 echo "Ini adalah route coba";
3 });
Berikutnya kita akan mengakses route coba tersebut, jangan lupa menjalankan
local development server dengan perintah :
php spark serve maka hasilnya adalah sebagai berikut ini :

Keterangan :
Akan menampilkan tulisan “Ini adalah route coba“, hal ini karena kita
menuliskan closure didalam route coba, dimana didalam function tersebut kita
menggunakan perintah echo untuk menampilkan text “Ini adalah route coba”

Membuat Placeholder di Routing

Berikutnya kita akan belajar bagaimana cara membuat placeholder di routing,


secara sederhana placeholder berfungsi untuk menambahkan parameter di bagian
routing, parameter ini nantinya dapat digunakan dibagian method di controller. Selain
dapat menambahkan parameter, anda juga dapat menentukan jenis data yang
dikirimkan melalui parameter tersebut, apakah berbentuk angka, atau huruf, atau
dapat berupa bentuk data lainnya, sehingga anda dapat mengatur value parameter
yang dikirimkan nantinya.
Untuk dokumentasi resmi dari codeigniter 4, bisa anda lihat melalui alamat
sebagaiberikut : https://codeigniter.com/user_guide/incoming/routing.html?highlight=
route#placeholders Sebagai contoh kita akan membuat method baru didalam
controller Siswa, method baru kita beri nama dataSiswa, sehingga kurang lebih
controller Siswa menjadi seperti berikut ini :
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()

32
{
echo "Halo ini adalah controller Siswa <a href='" . route_to('profil') . "'>Link ke
routing profil</a>";
}

public function profil()


{
echo 'Ini adalah method profil di controller Siswa';
}

public function dataSiswa($nama, $usia)


{
echo "Nama Siswa Adalah $nama, usia $usia";
}
}
Keterangan :
Pada Line 17 – 20 kita tambahkan method dengan nama dataSiswa, method ini
memiliki 2 parameter, yaitu nama dan usia, parameter ini nanti nilainya akan kita
kirim melalui route. Berikutnya kita buat routing baru dengan nama data-siswa, yang
akan mengakses method dataSiswa didalam controller Siswa.
Silahkan buka file app/Config/Routes.php
lalu tambahkan perintah routing dibawah ini :
$routes->get('data-siswa/(:alpha)/(:num)', 'Siswa::dataSiswa/$1/$2');
Baik kita coba mengaksesnya dulu ya, setelah itu kita akan bahas apa arti perintah
routing diatas, jalankan local development server dengan perintah php spark serve lalu
akses URL : localhost:8080/data-siswa/taufik/17
Hasilnya adalah sebagia berikut :

Keterangan :
Kita bahas terlebih dahulu dibagian perintah routing.
1 $routes->get('data-siswa/(:alpha)/(:num)', 'Siswa::dataSiswa/$1/$2');
Routing tersebut, kita berikan URL data-siswa, dimana akan mengakses method
dataSiswa didalam Controller Siswa, tidak hanya itu, disitu kita berikan 2 parameter,
dimana parameter yang dikirimkan melalui URL ini akan dijadikan nilai parameter
pada method dataSiswa pada Controller Siswa. Berikutnya perhatikan dibagian
routing kita menyebutkan jenis parameter (placeholder) pertama adalah (:alpha) yang
artinya nilainya harus berupa huruf, dan dibagian parameter kedua (placeholder)
adalah (:num) yang artinya nilainya harus berupa angka,
Pada dokumentasi dari codeigniter 4, terdapat beberapa jenis placeholder yang
dapat digunakan :
⚫ (:any) digunakan untuk menangkap seluruh jenis inputan
⚫ (:segment) digunakan untuk menangkap seluruh jenis inputan kecuali forward
slash (/)

33
⚫ (:num) digunakan untuk menangkap angka
⚫ (:alpha) digunakan untuk menangkap data berupa huruf
⚫ (:alphanum) digunakan untuk menangkap data berupa huruf dan angka
⚫ (:hash) memiliki konsep yang sama dengna segment hanya saja.. ini lebih mudah
digunakan jika ketika id pada routing menggunakan hash

Sehingga saat anda mengakses URL localhost:8080/data-siswa/taufik/17 maka


akan menampilkan text :
Nama Siswa Adalah taufik, usia 17
Karena 2 paremeter tersebut taufik dan 17, akan dikirimkan kedalam method
dataSiswa didalam controller Siswa, sehingga akan menampilkan tulisan “Nama
Siswa Adalah taufik, usia 17”
Seperti penjelasan sebelumnya placeholder parameter pertama adalah (:alpha)
yang artinya harus berupa huruf, dan placeholder parameter kedua adalah (:num) yang
artinya harus berupa angka, nah sekarang bagaimana kalau kita melanggar aturan itu ?,
parameter pertama akan kita isi dengan angka, dan parameter kedua akan kita isi
dengan huruf, contohnya URL berikut ini : localhost:8080/data-siswa/17/taufik
maka hasilnya adalah sebagai berikut :

Maka akan menampilkan pesan error, karena kita melanggar aturan tipe
placeholder saat mengakses routing data-siswa.

Membuat Multiple Routing

Berikutnya kita akan belajar cara membuat multiple routing atau bisa dikatakan
routing dengan nama yang sama, tetapi kita bedakan tipe placeholdernya, sehingga
codeigniter akan mendeteksi tipe placeholder yang seperti apa yang digunakan, yang
akan menentukan method mana yang akan diakses.
dalam contoh ini kita akan buat 2 routing dengan nama “get-siswa” hanya saja kita
bedakan dibagian placeholdernya :
⚫ routing pertama akan menggunakan placeholder (:num) yang artinya
parameternya harus berupa angka
⚫ routing kedua akan menggunakan placeholder (:alpha) yang artinya parameternya
harus berupa huruf
Berikutnya kita akan buat 2 method baru didalam controller Siswa yaitu :
⚫ method siswaDataId yang akan digunakan untuk memproses saat placeholder
berupa (:num)
⚫ method siswaDataName yang akan digunakan untuk memproses saat placeholder
berupa (:alpha)
Baik kita tambahkan terlebih dahulu untuk 2 parameter tersebut didalam
controller Siswa, sehingga Controller Siswa menjadi seperti berikut ini :

34
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
echo "Halo ini adalah controller Siswa <a href='" . route_to('profil') . "'>Link ke
routing profil</a>";
}

public function profil()


{
echo 'Ini adalah method profil di controller Siswa';
}

public function dataSiswa($nama, $usia)


{
echo "Nama Siswa Adalah $nama, usia $usia";
}

public function siswaDataId($id)


{
echo "Ini adalah method dengan nama siswaDataId dengan ID $id";
}

public function siswaDataName($name)


{
echo "Ini adalah method dengan nama siswaDataName dengan Name $name";
}
}
Keterangan :
Kita buat Method SiswaDataId dengan 1 parameter dengan nama $id Line 22
Kita buat Method SiswaDataName dengan 1 parameter dengan nama $name Line 27.
Berikutnya kita akan buat bagian routingnya, silahkan buka
file app/Config/Routes.php, lalu tambahkan routing seperti berikut ini :

1 $routes->get('get-siswa/(:num)', 'Siswa::siswaDataId/$1');
2 $routes->get('get-siswa/(:alpha)', 'Siswa::siswaDataName/$1');
Keterangan :
kita buat 2 parameter dengan nama yang sama yaitu get-siswa, yang membedakan
hanyalah placeholder :
⚫ jika dibagian placeholder berupa angka (:num) maka akan mengakses method
siswaDataId di controller Siswa
⚫ jika placeholder berupa huruf (:alpha) maka akan mengakses method
siswaDataName di controller Siswa.

35
Baik kita akan coba untuk mengakses routing tersebut, jangan lupa untuk
menjalankan local development server dengan perintah “php spark serve” kita coba
mengakses URL : localhost:8080/get-siswa/3
Maka yang tampil adalah sebagai berikut :

Maka akan diakses method siswaDataId dengan mengirimkan angka 3 sebagai


parameternya, karena dibagian parameter kita menuliskan angka. Berikutnya kita
coba mengakses URL : localhost/get-siswa/taufik
maka yang tampil adalah sebagai berikut :

Maka akan diakses method siswaDataName dengan mengirimkan string “taufik”


sebagai parameternya, karena dibagian parameter kita menuliskan huruf.

Membuat Group Route

Berikutnya kita akan membahas mengenai cara membuat group route di


codeigniter 4, jadi anda bisa mengelompokkan route yang anda buat. Contohnya anda
akan membuat route seperti berikut ini :
www.example.com/admin/users
www.example.com/admin/blog
Jika dilihat hal tersebut memiliki kesamaan, yaitu bagian admin, sebagai contoh
agar anda mudah memahami, kita buat 2 controller dengan users dan blog, 2
controller ini kita simpan didalam folder app/Controllers/Admin baik silahkan buat
dulu folder Admin didalam folder app/Controllers berikutnya silahkan buat file
controller dengan nama Users.php didalam folder admin yang baru saja kita buat.
<?php

namespace App\Controllers\Admin;

use App\Controllers\BaseController;

class Users extends BaseController


{
public function index()
{
echo 'Ini adalah halaman Index dari Controller Users didalam folder Admin';

36
}
}
Berikutnya silahkan buat file controller baru dengan nama Blog.php didalam
folder admin dengan isi code seperti berikut ini :
<?php

namespace App\Controllers\Admin;

use App\Controllers\BaseController;

class Blog extends BaseController


{
public function index()
{
echo 'Ini adalah halaman Index dari Controller Blog didalam folder Admin';
}
}
Baik kita sudah membuat 2 controller yaitu Users dan Blog didalam folder
Admin. Berikutnya kita akan membuat route group, buka file Routes.php didalam
app/Config lalu tambahkan skrip route seperti berikut ini :
$routes->group('admin', function ($routes) {
$routes->add('users', 'Admin\Users::index');
$routes->add('blog', 'Admin\Blog::index');
});
Setelah itu kita akan coba untuk mengaksesnya, jangan lupa jalankan untuk local
development servernya :
php spark serve
Berikutnya coba kita mengakses URL berikut ini :
http://localhost:8080/admin/users
Maka akan tampil Text Ini adalah halaman Index dari Controller Users didalam
folder Admin Karena saat kita mengakses URL diatas akan mengakses method index
di controller Users, controller Users berada didalam folder admin, seperti apa yang
kita tuliskan dibagian route group.
Berikutnya coba kita mengakses URL berikut ini :
http://localhost:8080/admin/blog
Maka akan tampilkan Text
Ini adalah halaman Index dari Controller Blog didalam folder Admin
Karena saat kita mengakses URL diatas akan mengakses method index di
controller Blog, controller Blog berada didalam folder admin, seperti apa yang kita
tuliskan dibagian route group.

37
Membuat View di Codeigniter 4

Cara Membuat View

Dalam tutorial – tutorial sebelumnya kita sudah sering memberikan contoh dalam
penggunaan views, tetapi disini kita akan jelaskan ulang bagaimana cara membuat
view di codeigniter 4, di direktori Codeigniter 4 file view disimpan pada folder
app/Views
Dalam contoh ini kita akan buat file view dengan nama product_page.php, file
tersebut simpan di dalam folder app/Views
untuk isi file view product_page.php bisa anda isi dengan code dibawah ini :
1 <html>
2 <head>
3 <title>Product Page</title>
4 </head>
5 <body>
6 <h1>Ini adalah halaman Product</h1>
7 </body>
8 </html>

Cara Menampilkan View

Setelah kita membuat view, kita akan belajar cara untuk menampilkan view,
sebagai tampilan halaman aplikasinya. Kita akan buat Controller terlebih dahulu,
semisal dalam contoh ini kita buat controller dengan nama Product.php dan disimpan
didalam folder app/Controllers
Pada file Product.php isi dengan code seperti berikut :
1 <?php
2
3 namespace App\Controllers;
4
5 class Product extends BaseController
6 {
7 public function index()
8 {
9 return view('product_page');
10 }
11 }
Keterangan :
Perhatikan line 9 pada method index, kita menuliskan perintah :
1 return view('product_page');
Artinya saat method index pada controller Product diakses, maka akan
menampilkan file view dengan nama ProductPage. Selain menggunakan perintah
return anda juga bisa menggunakan perintah :

38
1 echo view('product_page');
jadi anda bisa juga mengganti perintah return menjadi echo. Berikutnya kita akan
mencoba mengaksesnya, kita jalankan dulu untuk local development servernya, kita
tuliskan perintah berikut ini di terminal :
1 php spark serve
Lalu akses menggunakan URL :
1 localhost:8080/product

Maka akan menampilkan halaman tampilan dari file view product_page.php

Cara Menampilkan Views di dalam Subdirektori

Berikutnya kita akan belajar bagaimana menampilkan jika file view yang berada
didalam subdirektori, semisal kita buat file view dengan nama product_display.php,
file ini kita simpan didalam folder app/views/product untuk isi code didalam file
product_display.php adalah sebagai berikut :
1 <html>
2
3 <head>
4 <title>Product Display Page</title>
5 </head>
6
7 <body>
8 <h1>Ini adalah halaman Product Display</h1>
9 </body>
10
11 </html>
Berikutnya kita buat method baru dengan nama display, didalam controller
Product, dan didalam method display ini mengakses view product_display yang
barusan kita buat, sehingga untuk controller Product kurang lebih seperti berikut ini :
1 <?php
2
3 namespace App\Controllers;
4
5 class Product extends BaseController
6 {
7 public function index()
8 {

39
9 return view('product_page');
10 }
11
12 public function display()
13 {
14 return view('product/product_display');
15 }
16 }
Keterangan :
Perhatikan pada line 14 di method display, kita mengakses view
product_display.php didalam folder product, jadi kita perlu menuliskan foldernya
terlebih dahulu dalam hal ini adalah product, baru file viewnya dengan nama
product_display.php, karena itu untuk mengakses view kita menggunakan perintah
1 return view('product/product_display');
Berikutnya kita coba untuk mengakses method display, jangan lupa menjalankan
local development server terlebih dahulu dengan perintah php spark serve lalu akses
URL berikut ini : localhost:8080/product/display
maka akan menampilkan tampilan seperti berikut ini :

Mengakses Multiple View

Berikutnya kita akan belajar untuk mengakses beberapa view sekaligus, atau
biasanya kita kenal dengan istilah load multiple views. Konsep ini dapat digunakan
untuk menampilkan template disertai dengan content webnya, meskipun dari
codeigniter 4 sendiri sudah menyediakan fitur untuk menggunakan template, mungkin
dalam beberapa part mendatang kita akan membahasnya terkait penggunaan template
di codeigniter 4.
Baik sebagai contoh kita akan membuat beberapa file view : buat file view
dengan nama header.php, simpan didalam folder app/views
1 <h1>Ini adalah bagian Header</h1>
buat file view dengan nama content.php, simpan didalam folder app/views
1 <hr />
2 Ini adalah bagian content
3 <hr />
buat file view dengan footer.php, simpan didalam folder app/views
1 <h3>Ini adalah bagian footer</h3>
Berikutnya kita akan membuat method baru dengan nama page didalam
controller Product, sehingga controller Product menjadi seperti berikut ini :
1 <?php
2
3 namespace App\Controllers;

40
4
5 class Product extends BaseController
6 {
7 public function index()
8 {
9 return view('product_page');
10 }
11
12 public function display()
13 {
14 return view('product/product_display');
15 }
16
17 public function page()
18 {
19 echo view('header');
20 echo view('content');
21 echo view('footer');
22 }
23 }
Keterangan :
Perhatikan pada line 17 kita membuat method dengan nama page, didalamnya
kita mengakses file view, dimulai dari header, content, dan footer.
yang berbeda disini adalah karena kita mengakses beberapa view sekaligus, sehingga
kita menggunakan perintah echo, karena ketika kita menggunakan return maka yang
akan dijalankan adalah bagian views pertama saja.
Berikutnya kita coba untuk mengaksesnya, jangan lupa menjalankan local
development server dengan perintah php spark serve
lalu akses URL berikut untuk mengakses method page di controller product :
1 localhost:8080/product/page
maka tampilannya adalah sebagai berikut ini :

Maka akan ditampilkan isi dari file view header, content, dan footer.

41
Menampilkan data dari Controller ke View

Berikutnya kita akan belajar bagaimana cara passing data dari controller agar
ditampilkan dibagian view, baik kita akan tambahkan method baru dengan nama
catalog di controller product, sehingga controller product menjadi seperti berikut ini :
1 <?php
2
3 namespace App\Controllers;
4
5 class Product extends BaseController
6 {
7 public function index()
8 {
9 return view('ProductPage');
10 }
11
12 public function display()
13 {
14 return view('product/ProductDisplay');
15 }
16
17 public function page()
18 {
19 echo view('header');
20 echo view('content');
21 echo view('footer');
22 }
23
24 public function catalog()
25 {
26 $data = [
27 'product' => 'Redmi Note 9 Pro'
28 ];
29 return view('product_catalog', $data);
30 }
31 }
Keterangan :
Perhatikan pada line 24 kita membuat method dengan nama catalog didalam
method itu kita buat variabel $data yang berisi array, dengan key ‘product‘, dan value
‘Redmi Note 9 Pro‘
‘product‘
yang merupakan key dari array disini nantinya akan menjadi nama variabel yang
bisa dipanggil dibagian view, dan ‘Redmi Note 9 Pro‘ adalah value dari variabel
$product pada bagian line 29 kita mengakses view dengan nama
product_catalog,dimana kita juga menuliskan variabel $data sebagai parameter kedua
dari function view, dimana variabel $data telah berisi data array yang akan di passing
kebagian view.

42
Berikutnya kita buat file view dengan nama product_catalog.php, dan simpan
didalam folder app/views, untuk isi dari file view product_catalog.php adalah
1 <html>
2 <head>
3 <title>Product Catalog Page</title>
4 </head>
5 <body>
6 Nama Product Adalah <?= $product; ?>
7 </body>
8 </html>
Keterangan :
Perhatikan dibagian line 6 kita menuliskan variabel $product, variabel ini adalah
data yang kita kirim dari controller, yang merupakan key dari variabel $data
Berikutnya kita coba untuk mengaksesnya, Jangan lupa untuk menjalankan local
development server, lalu akses dengan menggunakan URL :
1 localhost:8080/product/catalog
Maka tampilannya adalah sebagai berikut :

Menampilkan data berupa array dari controller ke view menggunakan Looping

Berikutnya kita akan belajar bagaimana cara menampilkan data berupa Array dari
controller agar dapat ditampilkan dibagian view, cara ini nantinya sangat sering
digunakan saat kita akan menampilkan data dari database untuk ditampilkan dibagian
view. secara sederhana konsepnya adalah kita membuat array multidimensi dibagian
controller, array itu kita passing ke bagian view, lalu dibagian view, akan kita lakukan
perulangan untuk extract array multidimensi itu agar dapat ditampilkan dibagian
view.
sebagai contoh kita akan modifikasi method catalog dibagian controller product,
sehingga controller product menjadi sebagai berikut :
1 <?php
2
3 namespace App\Controllers;
4
5 class Product extends BaseController
6 {
7 public function index()
8 {
9 return view('ProductPage');

43
10 }
11
12 public function display()
13 {
14 return view('product/ProductDisplay');
15 }
16
17 public function page()
18 {
19 echo view('header');
20 echo view('content');
21 echo view('footer');
22 }
23
24 public function catalog()
25 {
26 $data = [
27 'title' => 'Product Catalog',
28 'brand' => 'Smartphone Xiaomi',
29 'product' => ['Redmi Note 9', 'Redmi Note 9 Pro', 'Mi Note 10', 'Mi Note 10
30 Pro']
31 ];
32 return view('product_catalog', $data);
33 }
}
Keterangan :
Perhatikan di line 26 pada method catalog, kita membuat variabel $data yang
berisi array multidimensi, ada beberapa data dibagian product.
jika dilihat dari isi array $data, akan terdapat 3 variabel yang dapat kita akses dibagian
view yaitu title, brand, dan product.
variabel $data itu kita passing dibagian view dengan nama product_catalog.php,
perhatikan line 31
Berikutnya kita modifikasi juga untuk file view dengan product_catalog.php,
menjadi seperti berikut ini :
1 <html>
2
3 <head>
4 <title><?= $title ?></title>
5 </head>
6
7 <body>
8 <h1><?= $brand ?></h1>
9 <hr />
10 <ul>
11 <?php foreach ($product as $item) : ?>
12
13 <li><?= $item ?></li>
14
15 <?php endforeach; ?>

44
16 </ul>
17 </body>
18
19 </html>
Keterangan :
Line 4 kita menampilkan isi variabel $title agar tampil dibagian page title, ini
membuat page title akan tertulis ‘Product Catalog‘
Line 8 kita akan menampilkan isi variabel $brand, agar tampil tulisan “Smartphone
Xiaomi“
Line 11 kita menuliskan perintah foreach, untuk melakukan perulangan sesuai
data pada variabel $product, dan setiap perulangan datanya disimpan di variabel $item,
lalu setiap perulangan akan menampilkan value dari variabel $item, sehingga
menampilkan seluruh data product.
Berikutnya kita coba mengakses method tersebut, jangan lupa menjalankan local
development server, lalu akses menggunakan URL berikut ini :
1 http://localhost:8080/product/catalog
Sehingga yang ditampilkan adalah sebagai berikut :

Keterangan :
Maka data yang dipassing dari controller untuk ditampilkan dibagian view, akan
tampil dibagian page title (Product Catalog), Header (Smartphone Xiaomi), dan
content yang menampilkan data product.

45
Membuat Model dan Interaksi Database melalui model di

Codeigniter 4

Model adalah bagian yang cukup penting di Codeigniter, dimana dengan model
kita akan dapat berkomunikasi dengan database. Pada Codeigniter 4 peran Model
akan sedikit berbeda dengan Codeigniter 3, karena di Codeigniter 4 Model memiliki
peran untuk dapat langsung berkomunikasi dengan database, tanpa kita membuat
method didalam model itu sendiri seperti yang kita lakukan di Codeigniter 3, konsep
seperti ini ada juga di Laravel dimana Model bisa dikatakan seperti representasi dari
tabel yang ada didatabase.
Jadi dengan memanfaatkan peran dari model, anda bisa menampilkan seluruh
data, mencari data tertentu, insert data, update data, dan hapus data di database,
dengan perintah yang cukup sederhana, jika di laravel fitur ini kita kenal dengan nama
eloquent. Meskipun itu Codeigniter 4 masih memiliki fitur query builder, ataupun kita
bisa juga menuliskan query secara manual, tapi fitur model ini cukup menjadikan
perubahan yang baru yang dihadirkan di Codeigniter versi 4.

Cara Membuat Model

Secara Default model di Codeigniter 4 disimpan didalam folder app/Models, baik


silahkan buat sebuah file Model dengan nama ProductModel.php dan simpan didalam
folder app/Models
Untuk isi dalam file ProductModel adalah sebagai berikut :

1 <?php
2
3 namespace App\Models;
4
5 use CodeIgniter\Model;
6
7 class ProductModel extends Model
8{
9}
Keterangan :
⚫ Line 3 anda perlu menuliskan namespace App\Models
⚫ Line 7 kita buat class ProductModel dengan extends class Model, untuk nama
class ini sendiri harus sama dengan nama file Model, dalam contoh ini adalah
ProductModel

Cara Mengakses Model

Setelah dibagian sebelumnya kita telah membuat sebuah model dengan nama
ProductModel yang kita simpan didalam folder app/Models. Berikutnya kita akan
belajar bagaimana cara mengakses Model tersebut, kita akan modifikasi terlebih
dahulu method didalam ProductModel, kita tambahkan method getData, berikutnya

46
kita akan belajar bagaimana cara mengakses method yang ada didalam model, melalui
Controller.
Kita modifikasi sehingga model menjadi seperti berikut ini :
1 <?php
2
3 namespace App\Models;
4
5 use CodeIgniter\Model;
6
7 class ProductModel extends Model
8 {
9 public function getData()
10 {
11 return 'Ini adalah Method getData didalam ProductModel';
12 }
13 }
Keterangan :
Kita membuat method baru dengan nama getData Line 9, bagian ini kita buat
sederhana saja, hanya return text dengan tulisan
‘Ini adalah Method getData didalam ProductModel’ berikutnya kita buat sebuah
controller dengan nama Product kita simpan didalam folder app/Controllers
Untuk isi code controller Product adalah seperti berikut ini :
1 <?php
2
3 namespace App\Controllers;
4
5 use App\Models\ProductModel;
6
7 class Product extends BaseController
8 {
9 public function index()
10 {
11 $product = new ProductModel();
12 echo $product->getData();
13 }
14 }
Keterangan :
Line 5 kita load model dengan nama ProductModel, dengan perintah :
1 use App\Models\ProductModel;
Line 7 kita membuat class dengan nama Product sesuai dengan nama
controllernya yaitu Product
Pada method index, kita membuat object baru dengan nama $product (line 11)
dengan menggunakan class ProductModel line 12 kita mengakses method getData
pada model productModel, kita gunakan object $product, kita gunakan perintah echo
untuk menampilkan text hasil return dari method getData.
1 echo $product->getData();
Sekarang kita coba mengaksesnya, jangan lupa untuk menjalankan local
development server, dengan perintah :

47
1 php spark serve
lalu jalankan URL : http://localhost:8080/product
Maka hasilnya adalah sebagai berikut :

Akan menampilkan tulisan “Ini adalah Method getData didalam ProductModel”


yang merupakan return dari method getData di dalam ProductModel

48
Persiapan Database & Koneksikan Codeigniter dengan database

Sebagai bahan belajar terkait cara model dapat berinteraksi dengan database, kita akan
buat sebuah database dengan nama db_product, dan didalamnya kita buat tabel
dengan nama tb_product, untuk struktur tabel seperti berikut ini :
⚫ kd_product (int) (primary key) (auto increment)
⚫ name (varchar 255)
⚫ price (float)
⚫ created_at (datetime)
⚫ updated_at (datetime)
⚫ deleted_at (datetime)
Untuk mempermudah teman – teman saya sediakan script SQL untuk membuat
database serta tabelnya :
1 -- phpMyAdmin SQL Dump
2 -- version 5.0.2
3 -- https://www.phpmyadmin.net/
4 --
5 -- Host: 127.0.0.1
6 -- Generation Time: Aug 10, 2020 at 04:34 PM
7 -- Server version: 10.4.11-MariaDB
8 -- PHP Version: 7.4.5
9
10 SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
11 START TRANSACTION;
12 SET time_zone = "+00:00";
13
14
15 /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
16 /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
17 /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
18 /*!40101 SET NAMES utf8mb4 */;
19
20 --
21 -- Database: `db_product`
22 --
23 CREATE DATABASE IF NOT EXISTS `db_product` DEFAULT CHARACTER SET utf8mb4 COLLATE
24 utf8mb4_general_ci;
25 USE `db_product`;
26
27 -- --------------------------------------------------------
28
29 --
30 -- Table structure for table `tb_product`
31 --
32
33 CREATE TABLE `tb_product` (
34 `kd_product` int(11) NOT NULL,
35 `name` varchar(255) NOT NULL,
36 `price` float NOT NULL,
37 `created_at` datetime NOT NULL,
38 `updated_at` datetime NOT NULL,
39 `deleted_at` datetime NOT NULL
40 ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
41
42 --
43 -- Indexes for dumped tables
44 --
45
46 --

49
47 -- Indexes for table `tb_product`
48 --
49 ALTER TABLE `tb_product`
50 ADD PRIMARY KEY (`kd_product`);
51
52 --
53 -- AUTO_INCREMENT for dumped tables
54 --
55
56 --
57 -- AUTO_INCREMENT for table `tb_product`
58 --
59 ALTER TABLE `tb_product`
60 MODIFY `kd_product` int(11) NOT NULL AUTO_INCREMENT;
61 COMMIT;
62
63 /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
64 /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
baik saya asumsikan teman – teman semua sudah memiliki database yang
didalamnya sudah ada tabelnya ya..

Koneksikan Codeigniter 4 dengan database

Berikutnya kita akan koneksikan project codeigniter 4 dengan database yang baru
saja kita buat, langkah – langkahnya adalah sebagai berikut :
Pada folder project codeigniter terdapat file dengan nama env, silahkan rename
terlebih dahulu menjadi .env buka file .env pada bagian database di sekitar line 52 –
56 setting bagian database, sebelum itu hilangkan tanda # lalu lakukan settingan
koneksi ke database jadi kurang lebih seperti berikut ini :
1 database.default.hostname = localhost
2 database.default.database = db_product
3 database.default.username = root
4 database.default.password =
5 database.default.DBDriver = MySQLi
Keterangan :
⚫ bagian hostname adalah alamat server dari databasenya, dalam hal ini adalah
localhost
⚫ bagian database diisi dengan nama database, dalam hal ini adalah db_product
⚫ bagian username diisi dengan user dari database, dalam hal ini adalah root
⚫ bagian password diisi dengan password dari username tersebut, dalam hal ini
saya kosongkan karena default password dibagian mysql pada xampp itu kosong
untuk user root
DBDriver kita isikan MySQLi karena kita pakai MySQL / Maria DB sebagai
databasenya.

Konfigurasi Model agar dapat mengakses database

Setelah dibagian sebelumnya kita telah belajar, bagaimana membuat model, serta
mengakses model dan method didalamnya melalui controller, berikutnya kita akan
belajar untuk mensetting bagian model, agar dapat mengakses database.

50
Berikutnya kita akan belajar konfigurasi apa saja yang bisa kita setting dibagian
model :
⚫ $DBGroup = digunakan untuk menentukan group database mana yang akan
digunakan, nama group database ini bisa anda lihat di konfigurasi database, bisa
anda lihat di file .env, jika anda tidak setting bagian DBGroup maka akan
menggunakan default database yang disetting di bagian konfigurasi database.
⚫ $table = bagian ini diisi dengan nama tabel di database, dimana model ini dapat
berkomunikasi dengan nama tabel yang ditulis dibagian ini.
⚫ $primaryKey = digunakan untuk menentukan primary key dari tabel yang dapat
diakses oleh model ini, kolom dibagian primaryKey akan digunakan untuk dasar
pencarian menggunakan method find, method find akan kita bahas lebih lanjut
ditutorial berikutnya.
⚫ $returnType = digunakan untuk mengatur format return data hasil dari query,
anda bisa menuliskan value array ataupun object.
⚫ $useSoftDeletes = jika bernilai true, maka ketika ada data yang dihapus, akan
menyimpan waktu kapan data dihapus dalam format datetime dalam kolom
dengan nama deleted_at didalam tabel, secara sederhana seakan – akan ketika
data dihapus, data tidak benar – benar hilang, data berada di semacam recycle bin,
dimana nantinya data bisa kita restore, ataupun kita kita hapus secara permanen.
jika bernilai true, ketika kita menggunakan method find ataupun findAll hanya
menampilkan data yang tidak dalam keadaan terhapus, kecuali anda juga
menambahkan perintah withDeleted() maka akan menampilkan keseluruhan data
termasuk yang dalam keadaan telah dihapus.
⚫ $allowedFields = digunakan untuk menentukan kolom mana saja yang dapat kita
insert data, baik menggunakan method insert, ataupun
⚫ $useTimestamps = jika bernilai true, maka setiap ada perubahan di database
seperti insert dan update data, maka waktu akan dicatat dalam kolom created_at
dan updated_at
⚫ $createdField = digunakan untuk mengatur kolom mana yang akan digunakan
untuk menyimpan waktu dalam format datetime saat data ditambahkan (anda bisa
mengosongi bagian ini kecuali bagian $useTimestamps dalam keadaan enable )
⚫ $updatedField = digunakan untuk mengatur kolom mana yang akan digunakan
untuk menyimpan waktu dalam format datetime saat data diupdate (anda bisa
mengosongi bagian ini kecuali bagian $useTimestamps dalam keadaan enable )
⚫ $deletedField = digunakan untuk mengatur kolom mana yang akan digunakan
untuk menyimpan waktu dalam format datetime saat data didelete
⚫ $dateFormat = nilai dibagian ini akan menentukan format tanggal dan waktu
yang disimpan, saat anda mengaktifkan bagian
$useTimestamps dan $useSoftDeletes, secara default menggunakan format
DATETIME, tetapi anda bisa menggunakan format lainnya
seperti datetime, date, int (a PHP timestamp)
⚫ $validationRules = bagian ini bisa anda gunakan untuk membuat sebuah aturan
terhadap format data yang akan diinsert ataupun diupdate ke database, untuk
bagian ini akan kita singgung sedikit saja, karena ada pembahasan lebih lanjutnya
di part pembahasan mengenai validasi.
⚫ $validationMessages = bagian ini digunakan untuk mengatur pesan yang
ditampilkan saat data tidak sesuai dengan validationRules
⚫ $skipValidation = bagian ini dapat berisi true atau false, secara default bernilai
false yang artinya data yang masuk harus melewati tahap validasi, tetapi jika anda
memberikan nilai true, maka data yang masuk tidak perlu melalui bagian validasi.

51
Baik berikutnya silahkan buka file model dengan nama ProductModel.php, lalu
modifikasi kode seperti berikut ini :
1 <?php
2
3 namespace App\Models;
4
5 use CodeIgniter\Model;
6
7 class ProductModel extends Model
8 {
9 protected $table = 'tb_product';
10 protected $primaryKey = 'kd_product';
11
12 protected $returnType = 'object';
13 protected $useSoftDeletes = true;
14
15 protected $allowedFields = ['name', 'price'];
16
17 protected $useTimestamps = true;
18 protected $createdField = 'created_at';
19 protected $updatedField = 'updated_at';
20 protected $deletedField = 'deleted_at';
21
22 protected $validationRules = [
23 'name' => 'required|min_length[3]',
24 'price' => 'required|numeric',
25 ];
26
27 protected $validationMessages = [
28 'name' => [
29 'required' => 'Bagian Name Harus diisi',
30 'min_length' => 'Minimal 3 Karakter'
31 ],
32 'price' => [
33 'required' => 'Bagian Price Harus diisi',
34 'numeric' => 'Hanya bisa diisi dengan angka'
35 ]
36 ];
37 protected $skipValidation = false;
38
39 public function getData()
40 {
41 return 'Ini adalah Method getData didalam ProductModel';
42 }
43 }
Keterangan :
1 protected $table = 'tb_product';
Line 9 kita set agar model ini dapat berkomunikasi dengan tabel “tb_product”

52
1 protected $primaryKey = 'kd_product';
Line 10 kita primary dari tabel tb_product adalah kolom “kd_product”
1 protected $returnType = 'object';
Line 12 kita set untuk format return hasil query adalah object
1 protected $useSoftDeletes = true;
Line 13 kita set useSoftDeletes bernilai true, agar data yang dihapus tidak benar benar
dihapus.
1 protected $allowedFields = ['name', 'price'];
line 15 kita set untuk kolom yang dapat di insert atau diupdate adalah kolom name,
dan price
1 protected $useTimestamps = true;
line 17 kita set bagian useTimestamps kita set true agar mencatat bagian created_at
dan updated_at
1 protected $createdField = 'created_at';
Line 18 untuk setting waktu insert data disimpan di kolom created_at
1 protected $updatedField = 'updated_at';
Line 19 untuk setting waktu update data disimpan di kolom updated_at
1 protected $deletedField = 'deleted_at';
Line 20 untuk setting waktu delete data disimpan di kolom deleted_at
untuk 3 settingan diatas, jika tidak diset maka akan memberikan nilai default :
kolom yang menyimpan waktu insert data adalah created_at
kolom yang menyimpan waktu update data adalah updated_at
kolom yang menyimpan waktu delete data adalah deleted_at
1 protected $validationRules = [
2 'name' => 'required|min_length[3]',
3 'price' => 'required|numeric',
4 ];
untuk Line 22 kita setting validasi insert atau update, kita buat sederhana saja ya :
kolom nama harus diisi (required) dan minimal 3 karakter
kolom price harus diisi (required) dan menggunakan angka
1 protected $validationMessages = [
2 'name' => [
3 'required' => 'Bagian Name Harus diisi',
4 'min_length' => 'Minimal 3 Karakter'
5 ],
6 'price' => [
7 'required' => 'Bagian Price Harus diisi',
8 'numeric' => 'Hanya bisa diisi dengan angka'
9 ]
10 ];
Line 27 kita set bagian pesan yang ditampilkan untuk kebutuhan validasi, kita
menuliskan pesan dimasing – masing validasi pada kolom
1 protected $skipValidation = false;
Line 37 kita set skipValidation kita berikan nilai false, agar validasi tetap dilakukan

53
Sebenarnya kita tidak perlu memberikan settingan sebanyak ini, tapi karena saya
ingin menjelaskan ke teman – teman terkait dengan konfigurasi yang memungkinkan
untuk dilakukan di bagian model sehingga semuanya saya tuliskan.

Perintah Insert Data

Berikutnya kita akan mulai belajar untuk melakukan komunikasi data dengan
database dengan menggunakan model, kita mulai belajar dengan menggunakan
method insert(), method ini digunakan untuk insert data ke database. untuk dapat
melakukan insert data, anda bisa menggunakan associative array, dimana key yang
digunakan disamakan dengan nama kolom di tabel.
silahkan buka file controller Product.php, lalu kita tambahkan method baru
semisal dengan nama insertdata, method insertdata seperti berikut ini :
1 public function insertdata()
2 {
3 $product = new ProductModel();
4 $insert = $product->insert([
5 'name' => 'Redmi Note 9 Pro',
6 'price' => '3499000'
7 ]);
8 if ($insert) {
9 echo "Data Berhasil diinsert";
10 } else {
11 echo "<pre>";
12 echo print_r($product->errors());
13 echo "</pre>";
14 }
15 }
Keterangan :
Line 1 kita buat method baru semisal dengan nama insertdata
1 $product = new ProductModel();
Line 3 kita buat object dengan nama $product menggunakan class ProductModel
1 $insert = $product->insert([
2 'name' => 'Redmi Note 9 Pro',
3 'price' => '3499000'
4 ]);
kita mengakses method insert dengan menggunakan object $product, kita
menggunakan array associative, dimana key sesuai dengan nama kolom yang ada di
tabel tb_product, dan hasil query kita simpan di variabel $insert
1 if ($insert) {
2 echo "Data Berhasil diinsert";
3 } else {
4 echo "<pre>";
5 echo print_r($product->errors());
6 echo "</pre>";
7 }

54
Line 8 kita cek value variabel $insert dengan menggunakn perintah IF, jika query
berhasil maka akan menampilkan tulisan “Data berhasil diinsert“, Jika query gagal
akan menjalankan Line 11 – 13 untuk menampilkan untuk menampilkan error
massage dari validasi, jika memang yang gagal adalah dibagian validasi
sebenarnya perintahnya tidak sepanjang ini, tapi disini saya akan contohkan jika kita
ingin melakukan pengecekan terhadap validasinya, dan jika validasi gagal akan
menampilkan pesan error. baik kita coba mengakses method insertdata di controller
Product, dengan menggunakan URL :
localhost:8080/product/insertdata
lalu coba cek data di dalam tabel tb_product, bisa gunakan sql editor, dalam contoh
ini saya menggunakan sqlyog

Maka ada satu data dengan name Redmi Note 9 Pro, dan untuk bagian price
3499000

Perintah Update Data

Berikutnya kita akan membahas method update, method ini digunakan untuk
update data, method ini memiliki 2 parameter :
⚫ nilai dari kolom primary key data yang ingin diupdate
⚫ perubahan data yang ingin dilakukan, dalam bentuk associative array
berikutnya kita akan coba mengupdate data yang barusan kita insert, kita akan
menambahkan method baru di controller Product, semisal nama methodnya
updatedata, isi dari method updatedata adalah seperti berikut ini :
1 public function updatedata()
2 {
3 $product = new ProductModel();
4 $id = 1;
5 $update = $product->update($id, [
6 'name' => 'Redmi Note 9',
7 'price' => '3000000'
8 ]);
9 if ($update) {
10 echo "Data Berhasil diupdate";
11 } else {
12 echo "<pre>";
13 echo print_r($product->errors());
14 echo "</pre>";
15 }
16 }
Keterangan :
Line 1 kita membuat method dengan nama updatedata
Line 3 kita membuat object baru dengan nama $product dengan class ProductModel

55
Line 4 kita buat variabel $id dengan value 1, ini adalah nilai dari kolom kd_product
(yang merupakan primary key) yang akan dijadikan parameter pertama method update,
karena data yang akan kita update adalah data yang memiliki kd_product = 1
1 $update = $product->update($id, [
2 'name' => 'Redmi Note 9',
3 'price' => '3000000'
4 ]);
Line 5 kita gunakan method update pada object $product, dan mengirimkan 2
parameter yaitu :
variabel $id
array associative dari data yang akan diupdate
hasilnya akan kita simpan didalam variabel $update.
1 if ($update) {
2 echo "Data Berhasil diupdate";
3 } else {
4 echo "<pre>";
5 echo print_r($product->errors());
6 echo "</pre>";
7 }
Line 9 kita akan memeriksa hasil query yang disimpan di variabel $update, jika proses
berhasil maka akan tampil tulisan “Data Berhasil diupdate”
Line 13 jika proses gagal, maka akan menampilkan pesan error dari hasil validasi jika
yang gagal memang di bagian validasi
Berikutnya kita coba mengakses method updatedata di controller Product dengan
menggunakan URL : localhost:8080/product/updatedata jika proses update berhasil
akan tertulis :
Data Berhasil diupdate
berikutnya kita akan cek data di table tb_product , saya gunakan sql yog

maka datanya sudah berubah, name menjadi “Redmi Note 9” dan untuk bagian price
menjadi “3000000”.

Perintah Save

Method save ini memiliki fungsi yang cukup unik,,, bisa digunakan untuk fitur
insert data ataupun update data, tergantung isi array associative yang kita buat, jika
kita menyertakan kolom yang menjadi primary key maka akan dianggap mengupdate
data , tetapi jika tidak menyertakan maka akan dianggap sebagai proses insert data.

56
Method Save untuk update data

Baik kita akan mulai pembahasannya bagaimana kalau method save digunakan
untuk update data, anda perlu primary key dibagian array associative, dalam contoh
ini kita akan menambahkan method dengan nama saveupdate dibagian controller
Product, method saveupdate adalah sebagai berikut :
1 public function saveupdate()
2 {
3 $product = new ProductModel();
4 $data = [
5 'kd_product' => 1,
6 'name' => 'Redmi 9',
7 'price' => '2000000'
8 ];
9 $product->save($data);
10 }
Keterangan :
Line 3 kita buat object dengan nama $product dengan class ProductModel
Line 4 – 8 kita buat array associative dengan key kd_product(primary key),name, dan
price
Array associative berisi key dari kolom primary key, dan juga data yang akan
diupdate
Line 9 kita gunakan method save dibagian object $product, dengan mengisikan
parameternya adalah array associative
kita coba mengakses method saveupdate yang barusan kita buat dengan
menggunakan alamat URL : localhost:8080/product/saveupdate lalu periksa data
didatabase harusnya data dengan kd_product = 1 akan berubah, name menjadi “Redmi
9” dan untuk bagian price “2000000”

Method Save untuk insert data

Berikutnya kita akan coba untuk menggunakan method save untuk kebutuhan
insert data, seperti yang dijelaskan diawal, perbedaannya jika untuk kebutuhan insert
data anda tidak perlu menuliskan kolom primary key dibagian array associative.
dalam contoh ini kita akan membuat method baru di contoller Product, semisal kita
beri nama saveinsert, untuk isi methodnya adalah sebagai berikut :
1 public function saveinsert()
2{
3 $product = new ProductModel();
4 $data = [
5 'name' => 'Xiaomi Mi Note 10 Pro',
6 'price' => '10999000'

57
7 ];
8 $product->save($data);
9}
Keterangan :
Line 3 kita buat object baru dengan nama $product dengan menggunakan class
ProductModel
Line 4 – 7 kita buat data array associative dengan key name, dan price sesuai nama
kolom di tabel tb_product
Line 8 kita gunakan method save dengan object $product, dan menyertakan variabel
$data yang berisi array untuk digunakan dibagian sebagai parameter method save
berikutnya kita coba mengakses method saveinsert dengan menggunakan URL :
localhost:8080/product/saveinsert maka hasilnya akan ada data baru di tabel
tb_product, sehingga kurang lebih seperti berikut ini :

Method Save untuk update tanpa array

Berikutnya kita akan bahas untuk cara update data menggunakan method save,
tapi yang berbeda didisini kita tidak perlu menggunakan array, baik sebagai contoh
kita akan membuat method baru dengan nama saveupdate2 di controller Product,
untuk isi dari method saveupdate2 kurang lebih seperti berikut ini :
1 public function saveupdate2()
2{
3 $product = new ProductModel();
4 $dataProduct = $product->find(1);
5 $dataProduct->price = '2050000';
6 $product->save($dataProduct);
7}
Keterangan :
Line 3 kita buat object baru dengan nama $product dengan menggunakan class
ProductModel
Line 4 kita mendapatkan data product dengan kd_product = 1, dengan menggunakan
perintah method find, pembahasan find akan ada dibab selanjutkan, hasil pencairan
disimpan pada variabel $dataProduct
Line 5 kita isi nilai kolom price dengan value ‘2050000‘, menggunakan variabel
$dataProduct
Line 6 kita menggunakan method save dengan menggunakan object $product, dan
untuk parameter method save adalah array $dataProduct berikutnya kita akan
coba mengakses method saveupdate2 dengan menggunakan URL sebagai berikut :
localhost:8080/product/saveupdate2 Maka data dengan kd_product 1 akan berubah,
nilai price akan menjadi 2050000

58
Perintah Delete

Berikutnya kita akan belajar mengenai method Delete, method ini digunakan
untuk menghapus data di database, dalam contoh ini kita akan membuat method baru
di controller Product, semisal method kita beri nama deletedata, isi method deletedata
adalah sebagai berikut :
1 public function deletedata()
2{
3 $product = new ProductModel();
4 $product->delete(1);
5}
Keterangan :
Line 3 kita buat object dengan nama product dengan class ProductModel
Line 4 kita gunakan method delete dengan menggunakan object $product, dengan
parameter 1, yang artinya menghapus data di tabel tb_product yang kd_product = 1,
hal ini dikarenakan kita set variabel $primaryKey di model adalah kd_product Coba
kita mengakses method deletedata di controller Product, dengan menggunakan URL :
localhost:8080/product/deletedata
maka hasilnya datanya akan seperti berikut ini :

Keterangan :
Perhatikan pada data dengan kd_product 1, data tidak dihapus, tetepi bagian
deleted_at akan berisi waktu data itu dihapus, hal ini dikarenakan kita menset
$useSoftDeletes = true; dibagian model ProductModel

Menghapus data dengan beberapa ID

Anda bisa menghapus beberapa data sekaligus, dengan menuliskan ID data sesuai
primary key, kedalam bentuk array, contohnya adalah sebagai berikut :
1 $product = new ProductModel();
2 $product->delete([1,2,3]);

59
Menghapus data dengan perintah where

Anda bisa menghapus data dengan menggunakan kombinasi pencarian data


menggunakan method where, contoh perintahnya adalah sebagai berikut :
1 $product = new ProductModel();
2 $product->where('name', 'Redmi 9')->delete();

Menghapus Permanent Seluruh data dari fitur SoftDeletes

Seperti contoh diatas saat kita memberikan nilai TRUE dibagian SoftDeletes,
ketika kita menghapus data, data itu tidak benar – benar terhapus tapi sebenernya
hanya memberikan nilai pada bagian kolom deleted_at, dengan perintah dibawah ini
anda bisa menghapus data tersebut secara permanent.
$product = new ProductModel();
$product->purgeDeleted();
dengan perintah diatas, maka data didalam tabel tb_product yang memiliki nilai
di kolom deleted_at atau bisa dikatakan nilai pada value kolom deleted_at IS NOT
NULL maka data itu akan dihapus.

Menghapus Data secara permanen

Seperti yang telah kita bahas diawal, codeigniter 4 memiliki fitur softdelete
dibagian model, jika anda ingin menghapus data secara permanent bisa menambahkan
value true, diparameter kedua pada method delete, jadi contoh perintahnya adalah
seperti berikut ini :
1 $product = new ProductModel();
2 $product->delete(1, true);
Keterangan :
perintah diatas digunakan untuk menghapus data secara permanen untuk data di
tabel tb_product yang nilai kd_product = 1, kita hanya perlu menambahkan parameter
kedua dengan nilai true.

Menampilkan Data

Berikutnya kita akan membahas bagaimana cara menampilkan data dengen


menggunakan model, ada beberapa fitur yang disediakan oleh codeigniter 4, baik kita
akan mulai bahas satu persatu :

Menggunakan method find

Method find ini digunakan untuk menampilkan data berdasarkan nilai yang ada
dibagian kolom yang menjadi primary key.
Semisal kita ingin mencari data di tabel tb_product yang nilai kd_product adalah 2,
contohnya kita akan menambahkan method baru dengan nama getdata di controller
Product, jadi controller Product kurang lebih seperti berikut ini :

60
1 public function getdata()
2 {
3 $product = new ProductModel();
4 $dataProduct = $product->find(2);
5 echo "<pre>";
6 echo print_r($dataProduct);
7 echo "</pre>";
8 }
Keterangan :
• Line 3 kita buat object dengan nama $product dengan class ProductModel
• Line 4 kita menggunakan method find() dengan nilai parameter adalah 2
yang artinya kita mencari data di tb_product dengan nilai di kolom kd_product
sebagai primary key
• Line 5 – 7 kita tampilkan datanya, kita gunakan print_r agar anda dapat
melihat isi return hasil query
Kita dapat mengaksesnya dengan menggunakan perintah :
localhost:8080/product/getdata

Menggunakan method find Column

Perintah ini digunakan untuk menampilkan data yang ada didalam kolom yang
kita inginkan, semisal dalam contoh ini kita ingin menampilkan isi dari kolom name
didalam tabel tb_product, kita akan modifikasi method getdata yang ada di dalam
controller Product, sehingga method getdata akan menjadi seperti berikut ini :
1 public function getdata()
2{
3 $product = new ProductModel();
4 $dataProduct = $product->findColumn('name');
5 echo "<pre>";
6 echo print_r($dataProduct);
7 echo "</pre>";
8}
Keterangan :
Line 3 kita buat object dengan nama $product dengan class ProductModel

61
Line 4 kita menggunakan method findColumn() dengan nilai parameter adalah name
yang artinya kita ingin menampilkan kolom dengan nama name di tabel tb_product
Line 5 – 7 kita tampilkan datanya, kita gunakan print_r agar anda dapat melihat isi
return hasil query
kita akan coba mengakses method getdata dengan URL :
localhost:8080/product/getdata
maka hasilnya adalah sebagai berikut :

Keterangan :
yang tampil hanya satu data, padahal data ada 2, karena yang satunya dalam
keadaan terhapus, jadi yang tampil hanya Xiaomi Mi Note 10 Pro yang merupakan
nilai dari kolom name.

Menggunakan method findAll

Method ini digunakan untuk menampilkan seluruh data yang ada pada sebuah
tabel kecuali data yang terhapus dengan fitur softdelete, anda bisa menggunakan
perintah seperti berikut :
1 public function getdata()
2{
3 $product = new ProductModel();
4 $dataProduct = $product->findAll();
5 echo "<pre>";
6 echo print_r($dataProduct);
7 echo "</pre>";
8}
Keterangan :
Line 4 kita menggunakan perintah findAll yang akan menampilkan seluruh data yang
ada di tabel tb_product kecuali data yang dihapus. Anda juga dapat dapat menuliskan
perintah pencarian where dibagian ini, contoh perintahnya adalah sebagai berikut :
1 $product = new ProductModel();
2 $dataProduct = $product->where('name','Xiaomi Mi Note 10 Pro')->findAll();
Keterangan :
Perintah diatas digunakan untuk menampilkan seluruh data di tabel tb_product yang
kolom name bernilai ‘Xiaomi Mi Note 10 Pro‘
Anda juga bisa menggunakan perintah limit dan offset seperti pada perintah SQL
biasanya, contoh penggunaannya adalah seperti berikut ini :

62
1 $users = $userModel->findAll($limit, $offset);
Keterangan :
kita bisa menuliskan parameter 1 untuk bagian limit, dan parameter 2 untuk bagian
offset pada method findAll

Menggunakan method findAll dengan withDeleted

Berikutnya anda juga dapat mengakses data seluruh data dalam sebuah tabel
tanpa terkecuali, sekalian dengan data yang sudah anda hapus dengan fitur softdelete,
contoh penggunaannya adalah sebagai berikut ini :
1 $product = new ProductModel();
2 $dataProduct = $product->withDeleted()->findAll();
Keterangan :
Anda cukup menambahkan method withDeleted dibagian findAll, Menggunakan
method findAll dengan onlyDeleted
Anda juga dapat menampilkan data yang sudah dihapus melalui fitur softdelete, anda
bisa menambahkan method onlyDeleted, sehingga penggunaannya adalah sebagai
berikut :
1 $product = new ProductModel();
2 $dataProduct = $product->onlyDeleted()->findAll();
Keterangan :
Anda cukup menambahkan method onlyDeleted dibagian findAll, maka data yang
tampil hanya yang sudah dihapus melalui softdelete

Menggunakan Fitur First


Anda juga dapat menampilkan untuk satu data saja dengan menggunakan method
first, semisal anda akan mencari beberapa data, tapi anda hanya ingin menampilkan
data pertamanya saja, anda bisa menggunakan perintah first ini.
1 $product = new ProductModel();
2 $dataProduct = $product->where('price','10999000')->first();
Keterangan :
dengan perintah diatas, anda akan menampilkan data di tabel tb_product, yang
kolom price memiliki nilai 10999000, tetapi anda hanya akan mendapatkan data
pertama saja, karena kita menggunakan method first.

63
Ujian Tengah Semester

Ujian Tengah Semester biasanya sudah masuk pada pertemuan 8 dan untuk
matakuliah Web programming 2 tidak ada UTS melainkan membuat project yang
akan di kumpulkan sebelum Ujian Akhir Semester (UAS)

64
Membuat Layout / Template di Codeigniter 4

Istilah layout / template disini digunakan untuk mempermudah anda dalam


mengatur tampilan aplikasi yang sedang dibuat , seperti kebanyakan template yang
kita temui, ada beberapa bagian template yang bersifat tetap (statis), dan ada beberapa
bagian yang bersifat dinamis, nah bagian dinamis ini yang akan berisi content yang
akan berubah – ubah tergantung menu mana yang akan diakses.
baik agar teman – teman mudah memahami .. saya akan ilustrasikan dalam
bentuk gambar…. untuk mewakili sebuah template web

Keterangan :
Jika kita perhatikan pada gambar diatas ada 4 bagian :
⚫ header
⚫ sidebar
⚫ content
⚫ footer
dari 4 bagian itu… yang biasanya kita buat tampilannya tidak berubah (statis)
adalah header, sidebar, dan footer, tetapi untuk bagian content tampilannya akan
berubah – ubah menyesuaikan menu apa yang diakses (dinamis), nah pengaturan
semacam ini sudah terfasilitasi di Codeigniter 4, kalau di codeigniter 3 sebelumnya
saya perlu menambahkan library tambahan untuk membuat template semacam ini, ya
meskipun di codeigniter 3 sendiri ada, hanya saya kurang nyaman untuk
menggunakannya.
Bagi teman – teman mungkin yang sudah pernah belajar framework Laravel,
konsep pembuatan layout di codeigniter 4 ini sama seperti konsep penggunaan blade
di laravel untuk proses pembuatan template, jadi saya rasa untuk teman – teman yang
sudah belajar laravel, akan mudah memahami konsep layout di codeigniter 4.

65
Preview Tampilan Template

Berikutnya kita akan membahas tampilan template yang kita akan gunakan, kita
gunakan template dari bootstrap dengan nama sticky footer navbar, bisa anda akses di
alamat ini : https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/ hanya
saja disini scriptnya akan saya sedikit modifikasi ya, kita buat library CSS dan JS
akan mengakses library bootstrap langsung secara online. Jadi saya sarankan ketika
belajar membuat layout menggunakan template bootstrap yang kita sediakan, gunakan
koneksi internet.
Baik tampilannya seperti berikut ini :

Jika kita melihat tampilan diatas, template dibagi menjadi 3 bagian :


⚫ header
⚫ content
⚫ footer
bagian header dan footer tidak akan berganti (statis), dan bagian content akan
selalu berganti tergantung menu yang diakses (dinamis)
baik ya teman – teman setidaknya paham dulu perbedaan bagian yang statis dan
dinamis ya.

Membuat View untuk bagian template

Berikutnya kita akan mulai membuat layoutnya, buat folder dengan nama layout
didalam folder app/Views, lalu berikutnya buat file dengan nama template.php
didalam folder app/Views/layout, untuk code dari file template.php adalah sebagai
berikut :

<!doctype html>
<html lang="en" class="h-100">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">

66
<meta name="generator" content="Jekyll v4.1.1">
<title>Sticky Footer Navbar Template · Bootstrap</title>

<link rel="canonical"
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/">

<!-- Bootstrap core CSS -->


<link href="https://getbootstrap.com/docs/4.5/dist/css/bootstrap.min.css"
rel="stylesheet">

<!-- Favicons -->


<link rel="apple-touch-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/apple-touch-icon.png"
sizes="180x180">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-32x32.png" sizes="32x32"
type="image/png">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-16x16.png" sizes="16x16"
type="image/png">
<link rel="manifest"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/manifest.json">
<link rel="mask-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/safari-pinned-tab.svg"
color="#563d7c">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon.ico">
<meta name="msapplication-config"
content="https://getbootstrap.com/docs/4.5/assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#563d7c">

<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

@media (min-width: 768px) {


.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/sticky-footer-navbar.c
ss" rel="stylesheet">
</head>

<body class="d-flex flex-column h-100">


<header>
<!-- Fixed navbar -->
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Warung Belajar</a>

67
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span
class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#"
tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>
</div>
</nav>
</header>

<!-- Begin page content -->


<main role="main" class="flex-shrink-0">
<div class="container">
<h1 class="mt-5">Selamat Datang</h1>
<p class="lead">Ini Adalah Halaman Home, kita sedang belajar membuat
layout di Codeigniter 4</p>
</div>
</main>

<footer class="footer mt-auto py-3">


<div class="container">
<span class="text-muted">Warung Belajar @2020</span>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script>
window.jQuery || document.write('<script
src="https://getbootstrap.com/docs/4.5/assets/js/vendor/jquery.slim.min.js"><\/script>')
</script>
<script
src="https://getbootstrap.com/docs/4.5/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>

Mengatur bagian content agar bersifat dinamis

Berikutnya kita akan mengatur bagian dari template yang sifatnya dinamis,
seperti yang telah kita bahas sebelumnya bagian content itu bersifat dinamis, akan
menyesuaikan menu yang diakses didalam aplikasi. kita dapat menggunakan perintah
renderSection() untuk mengatur bagian dari template yang isinya akan menyesuaikan
apa yang kita set dibagian view, method renderSection memiliki 1 argument yaitu
nama dari section, semisal dalam contoh ini namanya kita buat content.

68
kita akan gunakan method renderSection() untuk set bagian content, jadi kita perlu
merubah file template.php pada line 74 – 77 menjadi :
<?= $this->renderSection('content') ?>

Jadi kurang lebih menjadi seperti berikut ini :


<!doctype html>
<html lang="en" class="h-100">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Jekyll v4.1.1">
<title>Sticky Footer Navbar Template · Bootstrap</title>

<link rel="canonical"
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/">

<!-- Bootstrap core CSS -->


<link href="https://getbootstrap.com/docs/4.5/dist/css/bootstrap.min.css"
rel="stylesheet">

<!-- Favicons -->


<link rel="apple-touch-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/apple-touch-icon.png"
sizes="180x180">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-32x32.png" sizes="32x32"
type="image/png">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-16x16.png" sizes="16x16"
type="image/png">
<link rel="manifest"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/manifest.json">
<link rel="mask-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/safari-pinned-tab.svg"
color="#563d7c">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon.ico">
<meta name="msapplication-config"
content="https://getbootstrap.com/docs/4.5/assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#563d7c">

<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

@media (min-width: 768px) {


.bd-placeholder-img-lg {

69
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/sticky-footer-navbar.c
ss" rel="stylesheet">
</head>

<body class="d-flex flex-column h-100">


<header>
<!-- Fixed navbar -->
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Warung Belajar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span
class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#"
tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>
</div>
</nav>
</header>

<!-- Begin page content -->


<main role="main" class="flex-shrink-0">
<?= $this->renderSection('content') ?>
</main>

<footer class="footer mt-auto py-3">


<div class="container">
<span class="text-muted">Warung Belajar @2020</span>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script>
window.jQuery || document.write('<script
src="https://getbootstrap.com/docs/4.5/assets/js/vendor/jquery.slim.min.js"><\/script>')
</script>
<script
src="https://getbootstrap.com/docs/4.5/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>

70
Nah sampai disini kita sudah set section dengan nama content pada bagian
template, agar nanti isinya akan menyesuaikan dari view.

Menggunakan Layout dibagian View

Berikutnya kita akan belajar untuk menggunakan layout dibagian view, untuk
dapat menggunakan layout / template dibagian view kita menggunakan method
extend(), method extend memiliki 1 argument yaitu nama file view yang digunakan
sebagai template.
baik sebelum kita akan belajar menggunakan layout, kita akan buat dulu sebuah
controller, semisal kita buat controller dengan nama Product.php dan kita simpan di
folder app/Controllers, untuk isi code file controller Product.php adalah sebagai
berikut ini :
<?php

namespace App\Controllers;

class Product extends BaseController


{
public function index()
{
return view('productpage');
}
}
Keterangan :
kita membuat class Product sesuai nama controller, lalu kita membuat method
dengan index, dibagian method index kita mengakses view dengan nama productpage.
Langkah berikutnya kita akan membuat file view dengan nama productpage.php yang
kita simpan didalam folder app/Views, untuk code dari file productpage.php adalah
sebagai berikut :
<?= $this->extend('layout/template') ?>

<?= $this->section('content') ?>


<div class="container">
<h1 class="mt-5">Product Page</h1>
<p class="lead">Ini adalah halaman Product Page</p>
</div>
<?= $this->endSection() ?>
Keterangan :
Line 1 kita menggunakan perintah extend dengan nilai parameter ‘layout/template‘,
yang artinya view ini akan menggunakan template dengan nama template.php yang
berada pada folder app/views/layout, jadi default foldernya itu ada didalam
app/views, karena file template.php terdapat dalam folder layout, jadi kita perlu
menuliskan layout/template
• Line 3 kita menggunakan perintah section(‘content’) yang artinya kita akan
mengisi section dengan nama content, di file template.php, perintah section()
diakhiri dengan perintah endSection()
• jadi kita kita perhatikan pada line 4 – 7, code dibagiani ini yang akan
ditampilkan disection content pada bagian file template.php yang sudah kita
set agar isinya dinamis

71
Berikutnya kita akan coba untuk mengaksesnya, kita jalankan dulu local
development servernya gunakan perintah di terminal : php spark serve lalu kita
mengakses method index di controller Product dengan URL :

1 localhost:8080/product
Hasilnya sebagai berikut :

Keterangan :
Coba perhatikan dibagian content, dibagian content menampilkan apa yang kita
tulis dibagian view productpage.php pada line 4 – 7.
Biar teman – teman lebih memahami lagi, kita akan buat lagi sebuah method di
controller Product, dalam contoh ini kita buat method dengan nama catalog, sehingga
controller Product isi codenya menjadi seperti berikut ini :
<?php

namespace App\Controllers;

class Product extends BaseController


{
public function index()
{
return view('productpage');
}

public function catalog()


{
return view('catalogproduct');
}
}
Keterangan :
pada line 12 kita buat method dengan nama catalog, pada method ini kita mengakses
view dengan nama catalogproduct.
Berikutnya kita akan membuat view dengan nama catalogproduct.php untuk isi
codenya adalah sebagai berikut :
1 <?= $this->extend('layout/template') ?>
2
3 <?= $this->section('content') ?>
4 <div class="container">
5 <h1 class="mt-5">Catalog Product</h1>
6 <p class="lead">Ini adalah halaman Catalog Product</p>
7 </div>

72
8 <?= $this->endSection() ?>
Berikutnya kita akan coba mengakses method catalog di controller Product, jangan
lupa untuk menjalankan local development server, lalu kita akses dengan URL :
localhost:8080/product/catalog

Keterangan :
Terlihat yang berubah hanya dibagian content, terdapat tulisan Catalog Product,
bagian ini sesuai code dibagian view, yang kita set dibagian section content, jika
dilihat ada di line 4 – 7 di view catalogproduct.php

Method Include untuk menambahkan View Partial

Pada Codeigniter 4 anda bisa menggunakan method include yang digunakan


untuk memanggil view didalam file view, istilah ini biasanya dikenal nama view
partial. Fitur ini dapat anda gunakan untuk membagi bagian template menjadi
beberapa file view, tujuannya untuk memudahkan anda saat proses maintenance file
template, karena file template akan dibagi menjadi beberapa file view sesuai dengan
bagian templatenya. Perhatikan File template.php saat ini yang kita buat :
<!doctype html>
<html lang="en" class="h-100">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Jekyll v4.1.1">
<title>Sticky Footer Navbar Template · Bootstrap</title>

<link rel="canonical"
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/">

<!-- Bootstrap core CSS -->


<link href="https://getbootstrap.com/docs/4.5/dist/css/bootstrap.min.css"
rel="stylesheet">

<!-- Favicons -->


<link rel="apple-touch-icon"

73
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/apple-touch-icon.png"
sizes="180x180">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-32x32.png" sizes="32x32"
type="image/png">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-16x16.png" sizes="16x16"
type="image/png">
<link rel="manifest"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/manifest.json">
<link rel="mask-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/safari-pinned-tab.svg"
color="#563d7c">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon.ico">
<meta name="msapplication-config"
content="https://getbootstrap.com/docs/4.5/assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#563d7c">

<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

@media (min-width: 768px) {


.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/sticky-footer-navbar.c
ss" rel="stylesheet">
</head>

<body class="d-flex flex-column h-100">


<header>
<!-- Fixed navbar -->
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Warung Belajar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span
class="sr-only">(current)</span></a>
</li>
<li class="nav-item">

74
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#"
tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>
</div>
</nav>
</header>

<!-- Begin page content -->


<main role="main" class="flex-shrink-0">
<?= $this->renderSection('content') ?>
</main>

<footer class="footer mt-auto py-3">


<div class="container">
<span class="text-muted">Warung Belajar @2020</span>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script>
window.jQuery || document.write('<script
src="https://getbootstrap.com/docs/4.5/assets/js/vendor/jquery.slim.min.js"><\/script>')
</script>
<script
src="https://getbootstrap.com/docs/4.5/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>
kita akan coba bagi code di file template.php menjadi beberapa bagian, langkah –
langkahnya adalah sebagai berikut :
1. Buat file header.php simpan di folder app/Views/layout, untuk isi file ini cut dari
file template.php diatas line 4 – 46, sehingga file header.php berisi code seperti ini :
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Jekyll v4.1.1">
<title>Sticky Footer Navbar Template · Bootstrap</title>

<link rel="canonical"
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/">

<!-- Bootstrap core CSS -->


<link href="https://getbootstrap.com/docs/4.5/dist/css/bootstrap.min.css"
rel="stylesheet">

<!-- Favicons -->


<link rel="apple-touch-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/apple-touch-icon.png"
sizes="180x180">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-32x32.png" sizes="32x32"
type="image/png">
<link rel="icon"

75
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon-16x16.png" sizes="16x16"
type="image/png">
<link rel="manifest"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/manifest.json">
<link rel="mask-icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/safari-pinned-tab.svg"
color="#563d7c">
<link rel="icon"
href="https://getbootstrap.com/docs/4.5/assets/img/favicons/favicon.ico">
<meta name="msapplication-config"
content="https://getbootstrap.com/docs/4.5/assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#563d7c">

<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

@media (min-width: 768px) {


.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link
href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/sticky-footer-navbar.c
ss" rel="stylesheet">
</head>
2. Buat file nav.php simpan di folder app/Views/layout, untuk isi file ini cut dari file
template.php diatas line 51 – 69, sehingga file nav.php berisi code seperti ini :
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Warung Belajar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span
class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#"
tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>

76
</div>
</nav>

3. Buat file footer.php simpan di folder app/Views/layout, untuk isi file ini cut dari
file template.php diatas line 77 – 81, sehingga file footer.php berisi code seperti ini :
<footer class="footer mt-auto py-3">
<div class="container">
<span class="text-muted">Warung Belajar @2020</span>
</div>
</footer>
4. Berikutnya kita akan modifikasi file template.php menjadi seperti berikut ini :
<!doctype html>
<html lang="en" class="h-100">

<?= $this->include('layout/header') ?>

<body class="d-flex flex-column h-100">


<header>
<!-- Fixed navbar -->
<?= $this->include('layout/nav') ?>

</header>

<!-- Begin page content -->


<main role="main" class="flex-shrink-0">
<?= $this->renderSection('content') ?>
</main>

<?= $this->include('layout/footer') ?>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script>
window.jQuery || document.write('<script
src="https://getbootstrap.com/docs/4.5/assets/js/vendor/jquery.slim.min.js"><\/script>')
</script>
<script
src="https://getbootstrap.com/docs/4.5/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>
Keterangan :
<?= $this->include('layout/header') ?>
Line 4 kita tulisankan perintah method include dengan parameter layout/header
artinya kita akan menyisipkan file view dengan nama header.php di folder
app/views/layout, karena sebelumnya code di file template.php bagian tag <head>
hingga </head> sudah kita pindah ke file app/views/layout/header.php
<?= $this->include('layout/nav') ?>
Line 4 kita tulisankan perintah method include dengan parameter layout/nav
artinya kita akan menyisipkan file view dengan nama nav.php di folder
app/views/layout, karena sebelumnya code di file template.php bagian tag <nav>
hingga </nav> sudah kita pindahkan ke file app/views/layout/nav.php

77
1 <?= $this->include('layout/footer') ?>
Line 19 kita tulisankan perintah method include dengan parameter layout/footer
artinya kita akan menyisipkan file view dengan nama footer.php di folder
app/views/layout, karena sebelumnya code di file template.php bagian tag <footer>
hingga </footer> sudah kita pindahkan ke file app/views/layout/footer.php

78
Penanganan Form dan Form Validasi di Codeigniter 4

Penanganan form disini maksudnya adalah bagaimana cara codeigniter 4 ini


dapat menangkap inputan dari sebuah form dan memprosesnya dibagian controller.

Buat Sebuah Controller Siswa

Berikutnya silahkan buat controller dengan nama Siswa.php dan simpan didalam
folder app/Controllers, untuk isi controller Siswa.php adalah sebagai berikut ini :
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
return view('formSiswa');
}
public function save()
{
echo "<pre>";
var_dump($this->request->getVar());
echo "</pre>";
}
}
Keterangan :
• kita membuat controller dengan nama Siswa dimana controller ini memiliki
method index.
• jika method index ini diakses maka akan mengakses file view dengan nama
formSiswa.php
• berikutnya ada method save yang nantinya akan kita isi dengan perintah untuk
menangkap inputan form

Membuat File View dengan nama formSiswa.php

Berikutnya kita akan membuat file view dengan nama formSiswa.php, file view
ini akan berisi form, kita juga gunakan bootstrap untuk mengatur tampilannya, ..
teman – teman bisa copy paste saja dengan code dibawah ini :

<!DOCTYPE html>
<html lang="en">

<head>
<title>Full Width Form</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS only -->
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

79
<!-- JS, Popper.js, and jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>

<body>
<div class="container">
<div class="card">
<div class="card-header bg-primary text-white">Tambah Data Siswa</div>
<div class="card-body">
<?php if (!empty(session()->getFlashdata('error'))) : ?>
<div class="alert alert-danger alert-dismissible fade
show" role="alert">
<h4>Periksa Entrian Form</h4>
</hr />
<?php echo
session()->getFlashdata('error'); ?>
<button type="button" class="close"
data-dismiss="alert" aria-label="Close">
<span
aria-hidden="true">&times;</span>
</button>
</div>
<?php endif; ?>
<form action="<?= base_url('siswa/save'); ?>" method="post">
<?= csrf_field(); ?>
<div class="form-group">
<label for="nama">Nama</label>
<input type="text" name="nama"
class="form-control" value="<?= old('nama'); ?>" id="nama">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" name="email"
class="form-control" id="email" value="<?= old('email'); ?>">
</div>

<div class="form-group">
<label for="password">Password</label>
<input type="password" name="password"
class="form-control" id="password">
</div>

<div class="form-group">
<label for="alamat">Alamat</label>
<textarea name="alamat" id="alamat"
class="form-control" cols="3" rows="3"><?= old('alamat'); ?></textarea>
</div>
<button type="submit" class="btn
btn-primary">Save</button>
</form>
</div>
</div>
</div>
</body>

80
</html>
Keterangan :
Bagian tampilan form ini kita menggunakan bootstrap, dan untuk library js dan css
kita langsung mengaksesnya secara online, jadi kita sarankan untuk terkoneksi
internet saat mengakses tampilan form.
Pada line 32 kita mengisi beberapa attribute di tag <form>, seperti bagian
action="<?= base_url('siswa/save'); ?>"
artinya ketika tombol save di klik maka entrian form akan di proses didalam
method save pada controller Siswa
Pada Line 33 kita menuliskan perintah :
<?= csrf_field(); ?>
diatas digunakan untuk memberikan token CSRF (Cross-Site Request Forgery)
dibagian form, kami sarankan teman – teman menggunakan perlindungan CSRF ini.
Berikutnya kita buat beberapa inputan pada bagian form, seperti halnya kita membuat
form di HTML, kita perlu memberikan value pada attribute name di masing – masing
inputan form. (Line 36 name=”nama”), (Line 40 name=”email”), (Line 45
name=”password”), (Line 50 name=”alamat”)
Tombol submit kita buat di line 52
Untuk mengakses tampilan form teman – teman bisa mengaktifkan local
development server terlebih dahulu dengan perintah “php spark serve” lalu bisa
mengakses url :
1 localhost:8080/siswa
Tampilannya adalah sebagai berikut :

Mengakses Inputan Form di Controller

Sebelumnya kita sudah membuat tampilan form, berikutnya kita akan belajar
menuliskan perintah yang digunakan untuk mengakses inputan dibagian form.

Seperti yang telah kita tuliskan dibagian attribute action pada tag form, ketika tombol
submit di form di klik, maka inputan form akan diproses dibagian method save di

81
controller Siswa, perhatikan method save di controller Siswa kita menuliskan perintah
sebagai berikut :

1 public function save()


2{
3 echo "<pre>";
4 var_dump($this->request->getVar());
5 echo "</pre>";
6}
Keterangan :
Untuk mengakses seluruh inputan form kita bisa menggunakan perintah
$this->request->getVar()
perintah diatas berlaku untuk inputan dengan tipe method post ataupun get, jika
anda ingin mengakses inputan form bagian tertentu, bisa menuliskan value name
dibagian input di method getVar, semisal dari form diatas kita ingin mengakses
inputan email, maka bisa menggunakan perintah :
1 $this->request->getVar('email')
Berikutnya kita menggunakan perintah print_r kita gunakan untuk menampilkan
hasil inputan form. baik kita akan coba lakukan percobaan untuk entry form, silahkan
akses form dengan alamat : localhost:8080/siswa, dan isikan bagian formnya lalu klik
tombol save untuk submit form.

Ketika kita klik tombol save, maka akan mengakses method save di controller
siswa, dan akan menampilkan seperti gambar dibawah.

82
terlihat kita sudah berhasil menangkap inputan berdasarkan name dari inputan
form. Semisal kita akan menangkap salah satu dari inputan saja, semisal kita ingin
menangkap inputan email saja, kita bisa merubah method save menjadi berikut ini :
1 public function save()
2{
3 var_dump($this->request->getVar('email'));
4}
Maka saat kita entry bagian form lalu klik tombol save, hasilnya adalah sebagai
berikut :

Hasilnya hanya akan menampilkan inputan dengan name email saja.

MEMBUAT VALIDASI FORM

Berikutnya kita akan belajar untuk membuat validasi form di codeigniter 4,


validasi form ini sangat penting sekali untuk mengatur inputan form yang dilakukan
oleh pengguna aplikasi, sehingga ketika inputan form akan di insert ke database
sesuai dengan struktur tabel di database.
Untuk membuat validasi form, kita akan merubah method save di controller
Siswa, sehingga method save menjadi seperti berikut ini :
public function save()
{
if (!$this->validate([
'nama' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'
]
],
'email' => [
'rules' => 'required|valid_email',
'errors' => [
'required' => '{field} Harus diisi',
'valid_email' => 'Format Email Harus Valid'
]
],
'password' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'
]
],
'alamat' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'
]
]
])) {

83
session()->setFlashdata('error', $this->validator->listErrors());
return redirect()->back()->withInput();
} else {
print_r($this->request->getVar());
}
}
Keterangan :
Line 3 kita gunakan perintah IF dimana melakukan pengecekan dari penggunaan
method $this->validate.
method validate, pada method validate kita isi parameternya dengan array
multidimensi, dimana bisa anda isi dengan rules (aturan) dan message error (pesan
error)
Misal jika kita lihat lagi :
'nama' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'
]
],
artinya inputan nama, rulesnya ‘required’ (harus diisi), dan jika tidak diisi akan
menampilkan pesan error “nama Harus diisi”, {field} ini akan bernilai nama
inputannya.
'email' => [
'rules' => 'required|valid_email',
'errors' => [
'required' => '{field} Harus diisi',
'valid_email' => 'Format Email Harus Valid'
]
],
artinya inputan email, rulesnya ‘required’ (harus diisi), dan jika tidak diisi akan
menampilkan pesan error “email Harus diisi”, selain itu terdapat rules valid_email
artinya inputan harus menggunakan format email yang valid, jika tidak diisi maka
akan menampilkan pesan error “Format Email Harus Valid”
Jika terdapat rules yang bernilai false (inputan form tidak sesuai aturan) maka
akan menjalankan perintah di line 42 – 43.
Line 42 kita kirimkan error dengan menggunakan session flashdata, flashdata
adalah istilah pengiriman data lewat session, tapi hanya satu kali pakai, biasanya
digunakan untuk mengirimkan pesan / alert.
dalam contoh ini kita gunakan untuk mengirimkan pesan error dari form validation,
setFlashdata memiliki 2 parameter yaitu :
• nama flashdata
• value flashdata

session()->setFlashdata('error', $this->validator->listErrors());
pada contoh diatas kita membuat flashdata dengan nama error yang berisi list error
dari form validation
Line 43 kita tuliskan perintah :
1 return redirect()->back()->withInput();
Perintah diatas berfungsi untuk redirect ke halaman sebelumnya (form input),
yang artinya adalah halaman formSiswa, dengan menyertakan inputan yang sudah
dientrikan sebelumnya (withInput)

84
Line 45 akan dijalankan jika inputan form sudah sesuai rules.. kita tuliskan aja
sebagai contoh menggunakan perintah dd untuk menampilkan isi entrian form.

Testing Form Validation

Setelah kita setting bagian form validation pada method save di controller Siswa,
berikutnya kita akan coba lakukan testing, kita coba akses dulu untuk formnya :
localhost:8080/Siswa
Maka tampilannya adalah seperti berikut ini :

Keterangan :
semisal kita isi bagian form untuk nama dan email, tapi bagian password dan alamat
kita kosongkan, lalu kita tekan tombol Save. Maka hasilnya adalah sebagai berikut :

Keterangan :
Maka akan menampilkan List Error pada form validation, ada kotak berwarna merah
diatas form, tertulis :
• password Harus diisi
• alamat Harus diisi

bagaimana ini bisa terjadi, penjelasannya adalah sebagai berikut :

85
seperti yang telah dibahas dibagian method save, jika ada kesalahan pada form
validation maka akan menjalakan perintah :

session()->setFlashdata('error', $this->validator->listErrors());
jadi ketika redirect kembali ke bagian form entry, ada sebuah flashdata dengan
nama error yang berisi error dari form validation. nah sekarang perhatikan dibagian
file view formSiswa.php pada line 22 hingga line 31
<?php if (!empty(session()->getFlashdata('error'))) : ?>
<div class="alert alert-danger alert-dismissible fade
show" role="alert">
<h4>Periksa Entrian Form</h4>
</hr />
<?php echo
session()->getFlashdata('error'); ?>
<button type="button" class="close"
data-dismiss="alert" aria-label="Close">
<span
aria-hidden="true">&times;</span>
</button>
</div>
<?php endif; ?>

Keterangan :

• perhatikan perintah diatas


• pada line 1 ini kita lakukan pengecekan apakah ada session flashdata dengan
nama error, jika ada maka akan menampilkan pesan error.
• pesan error ada pada line 5 kita mengambil data dari flashdata dengan nama
error, sehingga menampilkan pesan error dari form validation

Hasil Akhir

Berikutnya saya sertakan code hasilnya mungkin teman – teman biar mudah
mengikutinya :
File Controller Siswa.php
<?php

namespace App\Controllers;

class Siswa extends BaseController


{
public function index()
{
$data['validation'] = \Config\Services::validation();
return view('formSiswa', $data);
}

public function save()


{
if (!$this->validate([
'nama' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'

86
]
],
'email' => [
'rules' => 'required|valid_email',
'errors' => [
'required' => '{field} Harus diisi',
'valid_email' => 'Format Email Harus Valid'
]
],
'password' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'
]
],
'alamat' => [
'rules' => 'required',
'errors' => [
'required' => '{field} Harus diisi'
]
]
])) {
session()->setFlashdata('error', $this->validator->listErrors());
return redirect()->back()->withInput();
} else {
echo "<pre>";
var_dump($this->request->getVar());
echo "</pre>";
}
}
}
File view formSiswa.php
<!DOCTYPE html>
<html lang="en">

<head>
<title>Full Width Form</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS only -->
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

<!-- JS, Popper.js, and jQuery -->


<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>

<body>
<div class="container">
<div class="card">
<div class="card-header bg-primary text-white">Tambah Data Siswa</div>
<div class="card-body">
<?php if (!empty(session()->getFlashdata('error'))) : ?>
<div class="alert alert-danger alert-dismissible fade

87
show" role="alert">
<h4>Periksa Entrian Form</h4>
</hr />
<?php echo
session()->getFlashdata('error'); ?>
<button type="button" class="close"
data-dismiss="alert" aria-label="Close">
<span
aria-hidden="true">&times;</span>
</button>
</div>
<?php endif; ?>
<form action="<?= base_url('siswa/save'); ?>" method="post">
<?= csrf_field(); ?>
<div class="form-group">
<label for="nama">Nama</label>
<input type="text" name="nama"
class="form-control" value="<?= old('nama'); ?>" id="nama">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" name="email"
class="form-control" id="email" value="<?= old('email'); ?>">
</div>

<div class="form-group">
<label for="password">Password</label>
<input type="password" name="password"
class="form-control" id="password">
</div>

<div class="form-group">
<label for="alamat">Alamat</label>
<textarea name="alamat" id="alamat"
class="form-control" cols="3" rows="3"><?= old('alamat'); ?></textarea>
</div>
<button type="submit" class="btn
btn-primary">Save</button>
</form>
</div>
</div>
</div>
</body>

</html>

88
PRESENTASI PROJEK

Pesentasi projek dilakukan pada pertemuan 13-15 oleh mahasiswa secara


berkelompok.

Tugas Projek (Kelompok)

1. Tugas project diadakan untuk memperoleh nilai dan pengganti UTS dan UAS.
Tugas ini dikerjakan secara kelompok dengan maksimal 5 mahasiswa/kelompok
atau disesuaikan dengan jumlah mahasiswa dalam satu kelas.
2. Tugas dan Kelompok harus sesuai dan disinkronkan dengan tugas mata kuliah
SIM, PSBO, dan WP2.
3. Judul Project Kelompok tidak boleh sama dalam satu (1) kelas dan wajib
dikoordinasikan dahulu dengan dosen pengampu.
4. Bentuk tugas projek adalah membuat projek baru Aplikasi Web Php dengan
Framework CodeIgninter dengan tiga (3) pilihan sebagai berikut:
⚫ Membangun Aplikasi OOP baru dari riset kelompok di instansi/perusahaan atau
hasil observasi di internet.
⚫ Membangun Aplikasi OOP dengan referensi dari penelitian Dosen UBSI berupa
artikel ilmiah yang luarannya berupa Web Sistem Informasi. Artikel ilmiah dapat
dipilih dan unduh dari link Google Drive.
⚫ Membangun Aplikasi OOP dari modifikasi source code aplikasi web Php Native
(tidak menggunakan framework) baik hasil dari Project Kelompok Web
Programming I maupun source code yang didapat dari observasi di internet
5. Setiap kelompok membuat repository proyek public di Github dan link repository
disampaikan ke dosen pengampu untuk dipantau. Setiap anggota wajib bekerja dan
aktif di repository yang dapat dilihat/dibuktikan dari log repository.
Dokumen/file Tugas Project yang dikumpulkan ke dosen pengampu, antara lain:
⚫ Link Repository Project Kelompok
⚫ File Zip/Rar/7zip dari Project + Backup Database
⚫ Makalah Project (docx)

Outline Makalah Project Web Programming II


Lembar Judul
Kata Pengantar
Daftar Isi
BAB I PENDAHULUAN
1.1. Deskripsi Singkat Aplikasi
1.2. Ruang Lingkup
BAB I PEMBAHASAN
2.1. Analisa Kebutuhan
2.1.1. Analisa Kebutuhan User
2.1.1. Analisa Kebutuhan Sistem
2.2. Desain
2.2.1. ER-Diagram / LRS
2.2.2. Use Case Diagram

89
2.2.3. Class Diagram
2.3. Implementasi
Berisi screenshot interface tiap modul program (front end & back end) beserta
keterangan singkat fungsi dan penggunaannya.
2.4. Pengujian Unit
Pengujian unit dapat menggunakan tools PHPUnit dengan pilihan Teknik Unit
Testing berupa Blackbox Testing, White Box Testing, maupun Grey Box Testing.
LAMPIRAN
Lampiran 1. Log Repository Project (git log)
➔ Berisi screenshot Log Revisi tiap Author (anggota)
Lampiran 2. Kode Program
➔ Berisi hasil copy teks dari sample kode program project (Model-View-Control)
yang mewakili Autentikasi (Login), File Master, File Transaksi, dan File
Laporan. Ukuran font kecil jangan terlalu besar.

90
UJIAN AKHIR SEMESTER

Pertemuan 16

91
DAFTAR PUSTAKA

Fikriansyah. 2016. Tutorial Install Codeigniter Untuk Pemula,


https://www.tutorialpedia.net/tutorial-install-codeigniter-untuk-pemula/, diakses
pada 17 juli 2018 pukul 13.30.
Hadi, Diki Alfarabi. 2017. E-book Belajar Cepat CodeIgniter Lengkap Studi Kasus
Membuat Aplikasi Rental Mobil.
Muhardian, Ahmad. 2019. Apa itu Git dan Kenapa Penting bagi Programmer?,
https://www.petanikode.com/git-untuk-pemula/, diakses pada 2 Juli 2019 pukul
06.00.
Rahajo, Budi. 2018. Belajar Otodidak Framework CodeIgniter Teknik Pemrograman
Web dengan PHP 7 dan Framework CodeIgniter 3. Bandung. Informatika.

92

Anda mungkin juga menyukai