Pada artikel ini kami akan memperkenalkan Anda pada hal seperti MVC. Mari kita bicara tentang apa itu MVC, menyentuh sejarah penciptaannya, memahami ide dan konsep utama yang melekat pada MVC, mempertimbangkan langkah demi langkah cara memecah aplikasi menjadi modul Model, View, Controller, dan juga menulis aplikasi web kecil di Spring-Boot, dan Menggunakan Spring-MVC sebagai contoh, mari kita lihat bagaimana data ditransfer dari kode Java ke halaman html. Untuk memahami materi ini, Anda perlu mengenal pola desain khususnya Observer dan Facade. Pahami permintaan dan respons HTTP, pahami dasar-dasar html, ketahui anotasi apa saja yang ada di Java. Duduk santai, membuat teh, menyiapkan hidangan penutup, salad, hidangan utama, dan hidangan pertama. Kita mulai.
Sejarah MVC
Ide MVC dirumuskan oleh Trygve Reenskaug saat bekerja di Xerox PARC pada akhir tahun 70an. Pada masa itu, bekerja dengan komputer tidak mungkin dilakukan tanpa gelar akademis dan studi terus-menerus atas dokumentasi yang banyak. Masalah yang dipecahkan Reenskaug bersama dengan sekelompok pengembang yang sangat kuat adalah menyederhanakan interaksi rata-rata pengguna dengan komputer. Penting untuk menciptakan alat yang, di satu sisi, sangat sederhana dan mudah dipahami, dan di sisi lain, memungkinkan untuk mengelola komputer dan aplikasi yang kompleks. Reenskaug bekerja dalam tim yang mengembangkan komputer portabel "untuk anak-anak dari segala usia" - Dynabook, serta bahasa SmallTalk di bawah arahan Alan Kay. Saat itulah konsep antarmuka yang ramah lingkungan ditetapkan. Pekerjaan Reenskaug bersama timnya sangat mempengaruhi perkembangan bidang IT. Mari kita sajikan fakta menarik yang tidak berhubungan langsung dengan MVC, namun menggambarkan pentingnya perkembangan tersebut. Pada tahun 2007, setelah presentasi Apple iPhone, Alan Kay berkata: “Ketika Macintosh keluar, Newsweek menanyakan pendapat saya tentangnya. Saya berkata: ini adalah komputer pribadi pertama yang patut dikritik. Usai presentasi, Steve Jobs menghampiri dan bertanya: apakah iPhone layak dikritik? Dan saya berkata, buatlah ukurannya lima kali delapan inci dan Anda akan menaklukkan dunia.” Tiga tahun kemudian, pada 27 Januari 2010, Apple memperkenalkan iPad 9,7 inci. Artinya, Steve Jobs mengikuti nasihat Alan Kay hampir secara harfiah. Proyek yang dikerjakan Rennskaug berlangsung selama 10 tahun. Dan publikasi pertama tentang MVC dari penciptanya diterbitkan 10 tahun kemudian. Martin Fowler, penulis sejumlah buku dan artikel tentang arsitektur perangkat lunak, menyebutkan bahwa ia mempelajari MVC dari versi SmallTalk yang berfungsi. Karena informasi tentang MVC dari sumber utama sudah lama tidak ada, serta karena sejumlah alasan lainnya, sejumlah besar interpretasi berbeda terhadap konsep ini telah muncul. Akibatnya, banyak orang menganggap MVC sebagai skema atau pola desain. Lebih jarang, MVC disebut pola komposit atau kombinasi beberapa pola yang bekerja sama untuk mengimplementasikan aplikasi yang kompleks. Namun pada kenyataannya, seperti yang dikatakan sebelumnya, MVC pada dasarnya adalah seperangkat ide/prinsip/pendekatan arsitektur yang dapat diimplementasikan dalam berbagai cara dengan menggunakan berbagai pola... Selanjutnya, kita akan mencoba melihat ide-ide utama yang tertanam dalam konsep MVC.
Apa itu 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.
Penafian: MVC bukanlah pola desain. MVC justru merupakan seperangkat ide dan prinsip arsitektur untuk membangun sistem yang kompleks dengan antarmuka pengguna. Namun untuk kenyamanan, agar tidak mengulangi setiap saat: "Seperangkat ide arsitektur...", kami akan menyebut MVC sebagai sebuah pola. Mari kita mulai dengan sesuatu yang sederhana. Apa yang tersembunyi di balik kata Model-View-Controller? Saat mengembangkan sistem dengan antarmuka pengguna, mengikuti pola MVC, Anda perlu membagi sistem menjadi tiga komponen. Ini, pada gilirannya, dapat disebut modul atau komponen. Katakan apa yang kamu mau, tapi bagilah dengan tiga. Setiap komponen akan memiliki tujuannya masing-masing. Model. Komponen/modul pertama inilah yang disebut model. Ini berisi semua logika bisnis aplikasi. Melihat. Bagian kedua dari sistem adalah tampilan. Modul ini bertanggung jawab untuk menampilkan data kepada pengguna. Segala sesuatu yang dilihat pengguna dihasilkan oleh tampilan. Pengendali. Mata rantai ketiga dalam rantai ini adalah pengontrol. Ini menyimpan kode yang bertanggung jawab untuk memproses tindakan pengguna (setiap tindakan pengguna dalam sistem diproses di pengontrol). Model adalah bagian paling independen dari sistem. Begitu mandiri sehingga tidak mengetahui apa pun tentang modul View dan Controller. Model ini sangat independen sehingga pengembangnya mungkin tidak tahu apa-apa tentang View dan Controller. Tujuan utama Tampilan adalah untuk memberikan informasi dari Model dalam format yang mudah digunakan. Batasan utama View adalah tidak boleh mengubah model dengan cara apa pun. Tujuan utama Pengontrol adalah untuk memproses tindakan pengguna. Melalui Kontroler pengguna membuat perubahan pada model. Lebih tepatnya, ke dalam data yang disimpan dalam model. Mari kita kembalikan diagram yang telah ditunjukkan kepada Anda pada kuliah: Dari semua ini kita dapat menarik kesimpulan yang sepenuhnya logis. Sistem yang kompleks perlu dibagi menjadi beberapa modul. Mari kita uraikan secara singkat langkah-langkah bagaimana mencapai pemisahan tersebut.
Langkah 1: Pisahkan logika bisnis aplikasi dari antarmuka pengguna
Ide utama MVC adalah bahwa aplikasi apa pun dengan antarmuka pengguna, sebagai perkiraan pertama, dapat dibagi menjadi 2 modul: modul yang bertanggung jawab untuk mengimplementasikan logika bisnis aplikasi, dan antarmuka pengguna. Modul pertama akan mengimplementasikan fungsi utama aplikasi. Modul ini akan menjadi inti dari sistem, dimana model domain aplikasi diimplementasikan. Dalam konsep MVC, modul ini akan menjadi huruf M kita, yaitu. model. Modul kedua akan mengimplementasikan keseluruhan antarmuka pengguna, termasuk menampilkan data kepada pengguna dan logika interaksi pengguna dengan aplikasi. Tujuan utama dari pemisahan ini adalah untuk memastikan bahwa inti sistem (Model dalam terminologi MVC) dapat dikembangkan dan diuji secara mandiri. Arsitektur aplikasi setelah pembagian tersebut akan terlihat seperti ini:
Langkah 2. Dengan menggunakan pola Observer, capai kemandirian model yang lebih besar, serta sinkronisasi antarmuka pengguna
Di sini kami mengejar 2 tujuan:
Mencapai kemandirian model yang lebih besar.
Sinkronisasi antarmuka pengguna.
Contoh berikut akan membantu Anda memahami apa yang dimaksud dengan sinkronisasi antarmuka pengguna. Katakanlah kita membeli tiket bioskop secara online dan melihat jumlah kursi yang tersedia di bioskop. Orang lain dapat membeli tiket bioskop pada waktu yang sama dengan kita. Jika seseorang ini membeli tiket sebelum kami, kami ingin melihat jumlah kursi yang tersedia untuk sesi kami berkurang. Sekarang mari kita pikirkan bagaimana hal ini dapat diterapkan di dalam program. Anggaplah kita memiliki inti sistem (model kita) dan antarmuka (halaman web tempat kita melakukan pembelian). Di situs tersebut, 2 pengguna secara bersamaan memilih tempat duduk. Pengguna pertama membeli tiket. Pengguna kedua perlu menampilkan informasi ini di halaman. Bagaimana hal ini bisa terjadi? Jika kita memperbarui antarmuka dari kernel sistem, kernel kita, model kita, akan bergantung pada antarmuka. Saat mengembangkan dan menguji model, Anda harus mempertimbangkan berbagai cara untuk memperbarui antarmuka. Untuk mencapai hal ini, Anda perlu menerapkan pola Observer. Dengan bantuannya, model mengirimkan pemberitahuan tentang perubahan ke semua pelanggan. Antarmuka, sebagai pelanggan, akan menerima pemberitahuan dan pembaruan. Pola Pengamat memungkinkan model, di satu sisi, memberi tahu antarmuka (tampilan dan pengontrol) bahwa perubahan telah terjadi di dalamnya, dan di sisi lain, untuk benar-benar “tidak mengetahui” apa pun tentang perubahan tersebut, dan dengan demikian tetap independen. Di sisi lain, ini akan memungkinkan sinkronisasi antarmuka pengguna.
Langkah 3. Membagi antarmuka menjadi View dan Controller
Kami terus membagi aplikasi menjadi beberapa modul, tetapi pada tingkat hierarki yang lebih rendah. Pada langkah ini, antarmuka pengguna (yang dipisahkan menjadi modul terpisah pada langkah 1) dibagi menjadi tampilan dan pengontrol. Sulit untuk menarik garis tegas antara tampilan dan pengontrol. Jika kita mengatakan bahwa tampilan adalah apa yang dilihat pengguna, dan pengontrol adalah mekanisme yang melaluinya pengguna dapat berinteraksi dengan sistem, terdapat beberapa kontradiksi. Kontrol, seperti tombol pada halaman web atau keyboard virtual pada layar ponsel, pada dasarnya adalah bagian dari pengontrol. Namun mereka dapat dilihat oleh pengguna seperti halnya bagian mana pun dari tampilan. Di sini kita berbicara lebih banyak tentang pembagian fungsional. Tugas utama antarmuka pengguna adalah memastikan interaksi pengguna dengan sistem. Artinya antarmuka hanya memiliki 2 fungsi:
menampilkan dan dengan mudah menampilkan informasi tentang sistem kepada pengguna;
memasukkan data dan perintah pengguna ke dalam sistem (mentransmisikannya ke sistem);
Fungsi-fungsi ini menentukan bagaimana antarmuka harus dibagi menjadi beberapa modul. Hasilnya, arsitektur sistem terlihat seperti ini: Jadi, kita memiliki aplikasi tiga modul yang disebut Model, View dan Controller. Untuk meringkas:
Mengikuti prinsip-prinsip MVC, sistem perlu dibagi menjadi beberapa modul.
Modul yang paling penting dan independen adalah modelnya.
Model adalah inti dari sistem. Anda memerlukan kemampuan untuk mengembangkan dan mengujinya secara independen dari antarmuka.
Untuk melakukan ini, pada langkah pertama pemisahan sistem, Anda perlu membaginya menjadi model dan antarmuka.
Selanjutnya, dengan menggunakan pola Observer, kami memperkuat independensi model dan memperoleh sinkronisasi antarmuka pengguna.
Langkah ketiga adalah membagi antarmuka menjadi pengontrol dan tampilan.
Semua yang diperlukan untuk memasukkan informasi dari pengguna ke dalam sistem ada di pengontrol.
Semua yang mengeluarkan informasi dari sistem ke pengguna sudah terlihat.
Ada satu hal lagi yang penting untuk didiskusikan dan Anda bisa minum coklat.
Sedikit tentang hubungan antara View dan Controller serta Model
Ketika pengguna memasukkan informasi melalui pengontrol, ia membuat perubahan pada model. Setidaknya pengguna melakukan perubahan pada data model. Ketika pengguna menerima informasi melalui elemen antarmuka (melalui Tampilan), pengguna menerima informasi tentang data model. Bagaimana ini bisa terjadi? Bagaimana View dan Controller berinteraksi dengan model? Lagi pula, tidak mungkin kelas View secara langsung menggunakan metode kelas Model untuk membaca/menulis data, jika tidak, tidak ada pertanyaan tentang independensi Model. Model mewakili sekumpulan kelas yang saling berhubungan erat yang, dalam cara yang baik, baik View maupun Controller tidak boleh memiliki akses. Untuk menghubungkan Model dengan View dan Controller, perlu diterapkan pola desain Facade. Fasad model akan menjadi lapisan antara Model dan antarmuka, yang melaluinya Tampilan menerima data dalam format yang mudah digunakan, dan Pengontrol mengubah data dengan memanggil metode fasad yang diperlukan. Secara skematis, pada akhirnya, semuanya akan terlihat seperti ini:
MVC: apa manfaatnya?
Tujuan utama mengikuti prinsip-prinsip MVC adalah untuk memisahkan implementasi logika bisnis (model) aplikasi dari visualisasinya (tampilan). Pemisahan ini akan meningkatkan penggunaan kembali kode. Manfaat menggunakan MVC paling jelas terlihat ketika pengguna perlu menyediakan data yang sama dalam bentuk yang berbeda. Misalnya dalam bentuk tabel, grafik atau bagan (menggunakan tipe yang berbeda-beda). Pada saat yang sama, tanpa mempengaruhi implementasi tampilan, Anda dapat mengubah reaksi terhadap tindakan pengguna (mengklik tombol, memasukkan data). Jika Anda mengikuti prinsip-prinsip MVC, Anda dapat menyederhanakan penulisan program, meningkatkan keterbacaan kode, dan mempermudah perluasan dan pemeliharaan sistem di masa depan. Pada materi terakhir seri “Pengantar Pengembangan Perusahaan”, kita akan melihat implementasi MVC menggunakan Spring-MVC sebagai contoh. Bagian 8. Menulis aplikasi kecil di spring-boot
Dari semua ini kita dapat menarik kesimpulan yang sepenuhnya logis. Sistem yang kompleks perlu dibagi menjadi beberapa modul. Mari kita uraikan secara singkat langkah-langkah bagaimana mencapai pemisahan tersebut.
Jadi, kita memiliki aplikasi tiga modul yang disebut Model, View dan Controller. Untuk meringkas:
GO TO FULL VERSION