Materi ini merupakan bagian dari seri "Pengantar Pengembangan Usaha". Artikel sebelumnya:
Pada artikel ini kita akan mengenal sesuatu yang disebut MVC. Kita akan berbicara tentang apa itu MVC, menyentuh sejarahnya, menjelajahi ide dan konsep dasar yang terkandung dalam MVC, melihat langkah demi langkah cara memecah aplikasi menjadi modul Model, View, dan Controller, menulis sebuah aplikasi web kecil menggunakan Spring Boot, dan, menggunakan Spring MVC sebagai contoh, lihat bagaimana data dikirim dari kode Java ke halaman HTML. Untuk memahami materi ini, Anda perlu mengenal pola desain, terutama pola pengamat dan fasad. Dan kenali permintaan dan respons HTTP, pahami dasar-dasar HTML, dan ketahui apa itu anotasi Java. Ambil secangkir kopi dan makanan ringan, dan merasa nyaman. Mari kita mulai.
Dari semua ini, kita bisa menarik kesimpulan logis. Sistem yang kompleks perlu dibagi menjadi beberapa modul. Mari kita uraikan secara singkat langkah-langkah untuk mencapai pemisahan ini.
Dan inilah cara kami sampai pada aplikasi yang terdiri dari tiga modul yang disebut model, tampilan, dan pengontrol. Mari kita rangkum:
- tentang jaringan
- tentang arsitektur perangkat lunak
- tentang HTTP/HTTPS
- tentang dasar-dasar Maven
- tentang servlet (menulis aplikasi web sederhana)
- tentang wadah servlet

Sejarah MVC
Ide dibalik MVC dirumuskan oleh Trygve Reenskaug saat bekerja di Xerox PARC pada akhir 1970-an. Pada masa itu, bekerja dengan komputer membutuhkan gelar dan studi terus-menerus tentang dokumentasi yang banyak. Tugas yang diselesaikan oleh Reenskaug bersama dengan sekelompok pengembang yang sangat kuat adalah menyederhanakan interaksi pengguna biasa dengan komputer. Itu perlu untuk membuat alat yang, di satu sisi, akan sangat sederhana dan mudah dipahami, dan di sisi lain, memungkinkan untuk mengontrol komputer dan aplikasi yang kompleks. Reenskaug bekerja dalam tim yang mengembangkan komputer laptop "untuk anak-anak segala usia" — Dynabook, serta bahasa SmallTalk di bawah kepemimpinan Alan Kay. Saat itulah konsep antarmuka yang ramah diletakkan. Dengan segala hormat, pekerjaan yang dilakukan oleh Reenskaug dan timnya memengaruhi evolusi bidang TI. Berikut adalah fakta menarik yang tidak berlaku untuk MVC secara langsung, tetapi mengilustrasikan pentingnya perkembangan ini. Alan Kaydikatakan, "Ketika saya pertama kali masuk ke Apple, yaitu pada tahun '84, Mac sudah keluar dan Newsweek menghubungi saya dan menanyakan pendapat saya tentang Mac. Saya berkata, 'Yah, Mac adalah komputer pribadi pertama yang cukup baik untuk dikritik.' Jadi, setelah mengumumkan iPhone pada tahun 2007, dia membawanya ke saya dan menyerahkannya kepada saya. Dia berkata, 'Alan, apakah ini cukup bagus untuk dikritik?' Dan saya berkata, 'Steve, jadikan ini sebesar tablet dan Anda akan menguasai dunia.'" Setelah 3 tahun, pada 27 Januari 2010, Apple memperkenalkan iPad dengan diagonal 9,7 inci. Dengan kata lain, Steve Jobs mengikuti nasihat Alan Kay hampir persis. Proyek Reenskaug berlangsung selama 10 tahun. Tetapi publikasi pertama tentang MVC terungkap setelah 10 tahun berikutnya. Martin Fowler, penulis beberapa buku dan artikel tentang arsitektur perangkat lunak, menyebutkan bahwa dia mempelajari MVC menggunakan versi kerja Smalltalk. Karena sudah lama tidak ada informasi tentang MVC dari sumber aslinya, dan karena beberapa alasan lain, banyak interpretasi berbeda dari konsep ini muncul. Akibatnya, banyak yang menganggap MVC sebagai pola desain. Lebih jarang, MVC disebut pola komposit atau kombinasi dari beberapa pola yang bekerja sama untuk membuat aplikasi yang kompleks. Namun, seperti yang disebutkan sebelumnya, MVC sebenarnya adalah sekumpulan ide/prinsip/pendekatan arsitektural yang dapat diimplementasikan dengan berbagai cara menggunakan pola yang berbeda... Selanjutnya, kita akan mempertimbangkan ide utama yang disematkan dalam konsep MVC. dan karena beberapa alasan lain, sejumlah besar interpretasi berbeda dari konsep ini muncul. Akibatnya, banyak yang menganggap MVC sebagai pola desain. Lebih jarang, MVC disebut pola komposit atau kombinasi dari beberapa pola yang bekerja sama untuk membuat aplikasi yang kompleks. Namun, seperti yang disebutkan sebelumnya, MVC sebenarnya adalah sekumpulan ide/prinsip/pendekatan arsitektural yang dapat diimplementasikan dengan berbagai cara menggunakan pola yang berbeda... Selanjutnya, kita akan mempertimbangkan ide utama yang disematkan dalam konsep MVC. dan karena beberapa alasan lain, sejumlah besar interpretasi berbeda dari konsep ini muncul. Akibatnya, banyak yang menganggap MVC sebagai pola desain. Lebih jarang, MVC disebut pola komposit atau kombinasi dari beberapa pola yang bekerja sama untuk membuat aplikasi yang kompleks. Namun, seperti yang disebutkan sebelumnya, MVC sebenarnya adalah sekumpulan ide/prinsip/pendekatan arsitektural yang dapat diimplementasikan dengan berbagai cara menggunakan pola yang berbeda... Selanjutnya, kita akan mempertimbangkan ide utama yang disematkan dalam konsep MVC.MVC: Ide dan prinsip dasar
- VC adalah seperangkat ide dan prinsip arsitektur untuk membangun sistem informasi yang kompleks dengan antarmuka pengguna
- MVC adalah singkatan dari: Model-View-Controller

Langkah 1. Pisahkan logika bisnis aplikasi dari antarmuka pengguna
Gagasan utama MVC adalah bahwa aplikasi apa pun dengan antarmuka pengguna dapat dibagi menjadi 2 modul: modul yang bertanggung jawab untuk mengimplementasikan logika bisnis, dan antarmuka pengguna. Modul pertama akan mengimplementasikan fungsionalitas utama aplikasi. Modul ini adalah inti dari sistem, dimana model domain aplikasi diimplementasikan. Dalam paradigma MVC, modul ini adalah huruf M, yaitu modelnya. Modul kedua mengimplementasikan seluruh antarmuka pengguna, termasuk logika untuk menampilkan data ke pengguna dan menangani interaksi pengguna dengan aplikasi. Tujuan utama dari pemisahan ini adalah untuk memastikan bahwa inti dari sistem ("model" dalam terminologi MVC) dapat dikembangkan dan diuji secara independen. Setelah melakukan pemisahan ini, arsitektur aplikasi terlihat seperti ini:
Langkah 2 Gunakan pola pengamat untuk membuat model lebih mandiri dan menyinkronkan antarmuka pengguna
Di sini kami memiliki 2 tujuan:- Mencapai kemandirian yang lebih besar untuk model
- Sinkronkan antarmuka pengguna
Langkah 3 Pisahkan antarmuka menjadi view dan controller
Kami terus membagi aplikasi menjadi beberapa modul, tetapi sekarang berada di level yang lebih rendah dalam hierarki. Pada langkah ini, antarmuka pengguna (yang kami pisahkan menjadi modul berbeda pada langkah 1) dibagi menjadi tampilan dan pengontrol. Menggambar garis tegas antara tampilan dan pengontrol itu sulit. Jika kita mengatakan bahwa tampilan adalah apa yang dilihat pengguna, dan pengontrol adalah mekanisme yang memungkinkan pengguna berinteraksi dengan sistem, Anda mungkin menunjukkan kontradiksi. Elemen kontrol, seperti tombol di halaman web atau keyboard virtual di layar ponsel, pada dasarnya adalah bagian dari pengontrol. Tapi mereka terlihat oleh pengguna sebagai bagian dari tampilan. Apa yang sebenarnya kita bicarakan di sini adalah pemisahan fungsional. Tugas utama antarmuka pengguna adalah memfasilitasi interaksi pengguna dengan sistem.- output dan dengan mudah menampilkan informasi sistem kepada pengguna
- masukkan data pengguna dan perintah (komunikasikan ke sistem)

- Menurut prinsip paradigma MVC, suatu sistem harus dibagi menjadi beberapa modul.
- Modul yang paling penting dan independen harus menjadi model.
- Model adalah inti dari sistem. Harus dimungkinkan untuk mengembangkan dan mengujinya secara independen dari antarmuka pengguna.
- Untuk mencapai ini, pada langkah pertama pembagian, kita perlu membagi sistem menjadi model dan antarmuka pengguna.
- Kemudian, dengan menggunakan pola pengamat, kami memperkuat independensi model dan menyinkronkan antarmuka pengguna.
- Langkah ketiga adalah membagi antarmuka pengguna menjadi pengontrol dan tampilan.
- Semua yang diperlukan untuk menerima data pengguna ke dalam sistem ada di controller.
- Semua yang diperlukan untuk menyampaikan informasi kepada pengguna ada di tampilan.
Sedikit tentang bagaimana view dan controller berinteraksi dengan model
Dengan memasukkan informasi melalui pengontrol, pengguna mengubah model. Atau setidaknya, pengguna mengubah data model. Ketika pengguna menerima informasi melalui elemen antarmuka (melalui tampilan), pengguna menerima informasi tentang model. Bagaimana ini bisa terjadi? Dengan cara apa view dan controller berinteraksi dengan model? Lagi pula, kelas tampilan tidak dapat secara langsung memanggil metode kelas model untuk membaca/menulis data. Jika tidak, kita tidak dapat mengatakan bahwa model tersebut independen. Model adalah sekumpulan kelas yang terkait erat yang tidak boleh diakses oleh view maupun controller. Untuk menghubungkan model dengan view dan controller, kita perlu mengimplementasikan pola desain fasad. Fasad model adalah lapisan antara model dan antarmuka pengguna, di mana tampilan menerima data yang diformat dengan mudah, dan Pengontrol mengubah data dengan memanggil metode yang diperlukan pada fasad. Pada akhirnya, semuanya terlihat seperti ini:
GO TO FULL VERSION