Component-based Development atau CBD merupakan pola di mana UI atau User Interface dari aplikasi dipecah ke dalam komponen-komponen. Pemecahahan halaman besar ke komponen-komponen kecil mengurangi kompleksitas sehingga memudahkan pengembang memfokuskan suatu bagian tertentu. Pemecahan ke dalam komponen-komponen ini juga memudahkan pemeliharaan kode sumber atau source code
Contoh pemecahan komponen pada halaman home pada website company profile adalah
- Komponen header
- Komponen slideshow
- Komponen fitur
- Komponen form kontak
- Komponen footer
Selain halaman yang bisa dipecah menjadi komponen, komponen pun dapat dipecah ke dalam sub-sub komponen yang lebih kecil.
Keuntungan pemecahan halaman besar menjadi komponen-komponen yang lebih kecil adalah
- Reusability: komponen-komponen yang dibuat ini dapat digunakan di banyak halaman.
- Encapsulation: Setiap komponen memiliki pembungkus sendiri
- Independence: Karena ada enkapsulasi maka komponen dapat berdiri sendiri sehingga tidak saling mengganggu
- Extensibilty: Karena enkapsulasi dan dapat berdiri sendiri maka komponen mudah diperluas dengan baik
- Replaceability: Kemudahan mengganti komponen dengan komponen lain
Vue.js mengimplementasikan component-based architecture atau CBD dengan SFC atau Single-File Component. SFC ini dijalankan pada ekstension .vue yang melakukan enkapsulasi style, HTML dan logika Javascript pada file yang sama.
Kunjungi https://www.proweb.co.id/jasa-pembuatan-website untuk jasa pembuatan website anda .