PEMERINTAH PROVINSI JAWA TENGAH

DINAS PENDIDIKAN
SMK NEGERI 2 KARANGANYAR
Jl. Yos Sudarso, Bejen, Karanganyar (0231) 494549Karanganyar57716

JOBSHEET

Program Keahlian :
NIS / NamaSiswa / Kelas:
RekayasaPerangkatLunak
6518/Puspa Gematining P/XII RPL C
Mapel : PWPB Nilai:

1. Kompetensi Dasar
3.23 Menerapkan aplikasi web dengan Model View Controler (MVC)

2. Indikator Pencapaian Kompetensi

3.23.1 Menjelaskan konsep MVC dalam aplikasi web.
3.23.2 Menjelaskan prosedur pemrograman aplikasi web dengan MVC.
3.23.3 Menerapkan MVC kedalam program aplikasi web.

3. Materi Dasar
MVC adalah konsep arsitektur dalam pembangunan aplikasi berbasis web yang membagi
aplikasi web menjadi 3 bagian besar. Yang mana setiap bagian memiliki tugas-tugas serta
tanggung jawab masing-masing. Tiga bagian tersebut adalah: model, view dan controller.
Model: Bertugas untuk mengatur, menyiapkan, memanipulasi dan mengorganisasikan data
(dari database) sesuai dengan instruksi dari controller.
View: Bertugas untuk menyajikan informasi (yang mudah dimengerti) kepada user sesuai
dengan instruksi dari controller.
Controller: Bertugas untuk mengatur apa yang harus dilakukan model, dan view mana yang
harus ditampilkan berdasarkan permintaan dari user. Namun, terkadang permintaan dari user
tidak selalu memerlukan aksi dari model. Misalnya seperti menampilkan halaman form untuk
registrasi user.
Berikut adalah arsitektur aplikasi web kita jika dikembangkan dengan menggunakan pola
MVC:

Alur kerja aplikasi web kita ketika user mengunjungi salah satu halaman yaitu:
 Browser berhubungan dengan server untuk akses halaman.
 Request (permintaan) browser ditangani oleh bagian Controller dari kode kita.
 Controller akan melakukan pemanggilan ke Model untuk mendapatkan data yang
relevan, dan kemudian mempersiapkan data tersebut untuk ditampilkan.
  Controller memberikan data yang diperlukan kepada view.
 View menampilkan data dan berbagai elemen antarmuka tambahan yang diperlukan.
Meskipun memerlukan banyak langkah hanya untuk menampilkan satu halaman web, kita
dapat langsung melihat keuntungan tambahan dari penggunaan MVC, yaitu bagaimana setiap
bagian memiliki tanggung jawab masing-masing. Ingin mengubah query yang digunakan
agar menjadi lebih cepat? Langsung saja edit kode pada bagian Model. Designer juga dapat
bekerja pada bagian view jika ingin mengubah tampilan, tanpa perlu takut merusak
keseluruhan kode. Pastinya hal seperti ini akan mempercepat dan mempermudah
pengembangan web kita!
Framework yang Menggunakan Konsep MVC
Untuk framework PHP, ada cukup banyak dan hampir semuanya menggunakan konsep
MVC:
 Laravel
 Symfony
 CakePHP
 Zend
 Codeigniter (versi 3 kebawah sudah tidak recommended untuk dipelajari)
 dll
 Untuk framework Python di antaranya:
 Django
 Turbogears2
 Watson-Framework
 dll
Untuk framework Nodejs di antaranya:
 Express
 Adonis
 Sails.js
 Total.js
 Mean.js
 Mojito
 Dll

4. Langkah kerja
1) Pertama kita download framework CI setalah itu ekstrak

2) Rename folder menjadi “biodata”

3) Selanjutnya tambah framework bootstrap pada folder

 4) Buka folder biodata di Sublime Text

5. Ketikan sintak seperti gambar berikut di folder view lalu sava dengan nama file yang
diinginkan(biodata)
5) Ganti nama controllernya sesuai nama file yang kita save tadi di file welcome yang
ada di folder controller

6) Ini adalah tampilannya