Kami menerbitkan bagian kedua dari terjemahan materi yang dikhususkan untuk lima alat JavaScript terbaik untuk mengembangkan bagian sisi klien dari proyek web. Bagian
pertama berhubungan dengan perpustakaan Bereaksi dan kerangka kerja Angular. Di sini kita membahas Vue, Ember dan Backbone.
3. Vue
Gagasan di balik Vue datang dari Angular dan React, tetapi Vue, dalam banyak hal, lebih baik daripada dua alat pengembangan front-end ini. Vue telah diunduh lebih dari 40 juta kali tahun ini.
Laporan Keamanan Kerangka JavaScript Snyk baru-baru ini telah dirilis. Ini terutama bertujuan meneliti keamanan React dan Angular, tetapi ada tempat di dalamnya untuk mempelajari proyek-proyek lain. Dari Vue, dari laporan ini Anda dapat mengetahui apa yang diketahui hanya tentang 4
kerentanan langsungnya yang telah diperbaiki.
Jika Anda tidak terbiasa dengan Vue, berikut adalah beberapa fakta kunci tentang kerangka kerja ini.
Ketika bekerja dengan Vue, logika komponen, tata letak dan gayanya disimpan dalam satu file. Kecuali untuk gaya, materi proyek juga disimpan dalam Bereaksi. Interaksi komponen dalam Vue disediakan melalui objek yang menyimpan properti dan status komponen. Pendekatan ini, juga, sebelum muncul di Vue, digunakan dalam Bereaksi.
Vue, yang membuatnya mirip dengan Angular, memungkinkan Anda untuk menggabungkan markup HTML dan kode JavaScript. Untuk mengintegrasikan data komponen ke dalam templat, Anda perlu menggunakan arahan Vue. Seperti
v-bind atau
v-if .
Salah satu alasan Vue harus dianggap sebagai alternatif yang layak untuk Bereaksi adalah karena bagaimana keadaan aplikasi diatur di sini. Dalam proyek Bereaksi, ketika menggunakan bundel Bereaksi + Redux, saat aplikasi bertambah besar, prosedur yang diperlukan untuk mengelola keadaannya menjadi lebih rumit. Ini mungkin disebabkan oleh fakta bahwa programmer, alih-alih mengerjakan aplikasi itu sendiri, harus menghabiskan banyak waktu menyiapkan mekanisme Redux. Vue menggunakan perpustakaan Vuex untuk mengelola negara. Ini mirip dengan Flux dan dibuat khusus untuk Vue. Bekerja dengannya jauh lebih nyaman daripada dengan Redux.
Jika Anda mencoba membuat pilihan antara Vue dan Angular, alasan mengapa Anda lebih suka Vue dapat direduksi menjadi fakta bahwa Angular, dibandingkan dengan Vue, terlihat seperti proyek skala besar yang terlalu rumit, yang sifatnya adalah keinginan untuk membatasi pengembang. Vue jauh lebih sederhana daripada Angular dan tidak terlalu membatasi programmer.
Keuntungan lain dari Vue atas Angular dan Bereaksi adalah Anda tidak perlu belajar bahasa baru untuk bekerja dengan kerangka kerja ini.
▍ Elemen ekosistem Vue
Mari kita berikan gambaran singkat tentang ekosistem tempat seseorang yang memilih Vue jatuh:
- Untuk mengontrol keadaan aplikasi Vue, perpustakaan Vuex digunakan, yang didasarkan pada konsep yang berkaitan dengan Flux.
- Ada alat pengembang untuk Chrome dan Firefox yang membuat membuat proyek Vue lebih mudah.
- Ekosistem Vue memiliki
vue-loader untuk webpack, memungkinkan Anda untuk menggunakan komponen Vue sebagai komponen file tunggal. - Untuk bekerja dengan API server, Anda dapat menggunakan klien HTTP
vue-resource dan perpustakaan Axios. - Vue mendukung kerangka kerja Nuxt.js, yang mencakup dukungan untuk aplikasi yang diberikan di server. Nuxt.js dapat dianggap sebagai pesaing Angular Universal.
- Anda dapat menggunakan perpustakaan Weex untuk mengembangkan aplikasi seluler berbasis Vue.
Vue adalah kerangka kerja hebat yang melampaui orang lain dalam hal kegunaan. Mungkin saya sendiri akan beralih ke Vue dalam waktu dekat. Kerangka kerja ini tidak serumit React dan Angular, dan juga cocok untuk mengembangkan aplikasi dengan berbagai ukuran.
4. Ember
Ember 3.13 dirilis tahun ini. Banyak hal baru telah muncul di versi kerangka ini. Ember mirip dengan Backbone dan Angular. Ini juga merupakan salah satu kerangka JavaScript tertua. Namun, terlepas dari ini, dalam hal peluang, ia tidak ketinggalan dari para pesaingnya yang lebih muda. Misalnya, ia mendukung teknologi perubahan properti yang dapat dilacak, yang membuatnya mudah untuk memantau perubahan dalam kondisi aplikasi dan membuatnya lebih mudah untuk memvisualisasikan perubahan ini.
Ember memiliki arsitektur yang agak canggih yang memungkinkan Anda membuat aplikasi klien besar dengan cepat. Ini mengimplementasikan ide-ide MVC khas. Aplikasi Ember dibangun dari adaptor, komponen, pengontrol, objek tambahan, model, rute, layanan, templat, utilitas, pengaya.
Salah satu fitur paling menarik dari Ember adalah alat baris perintah (Ember CLI). Alat-alat ini membantu pengembang front-end bekerja secara produktif. Menggunakan Ember CLI, Anda dapat membuat tidak hanya templat proyek, tetapi juga preset untuk pengontrol, komponen dan entitas lain dari mana aplikasi dibangun.
ElementsEmber Elemen Ekosistem
Pengembang front-end yang menggunakan Ember memiliki fitur-fitur utama sebagai berikut:
- Ember CLI adalah alat baris perintah untuk pembuatan prototipe aplikasi yang cepat dan untuk manajemen ketergantungan.
- Server Pengembang Ember Standar.
- Ember Data - perpustakaan untuk bekerja dengan data.
- Setang adalah mesin templat yang digunakan dalam aplikasi Ember.
- QUnit adalah kerangka kerja untuk menguji proyek Ember.
- Ember Inspector - Alat Pengembang untuk Chrome dan Firefox.
- Ember Observer - katalog add-on untuk Ember CLI.
Mungkin Ember dapat disebut kerangka kerja yang diremehkan, tetapi meskipun demikian, ini bagus untuk membuat proyek web yang rumit.
5. Backbone.js
Backbone adalah kerangka kerja JavaScript yang didasarkan pada arsitektur yang mirip dengan MVC. Katakanlah dalam MVC disebut "controller" di Backbone disebut "View". Tampilan backbone dapat menggunakan berbagai sistem templating. Misalnya - Kumis, Setang, jQuery-tmpl. Dalam proyek-proyek Backbone, Anda dapat menggunakan perpustakaan pihak ketiga. Perlu dicatat bahwa satu-satunya ketergantungan Backbone yang sulit adalah perpustakaan Underscore.js.
Backbone adalah kerangka kerja yang mudah digunakan yang memungkinkan Anda mengembangkan aplikasi satu halaman dengan cepat. Di antara alat bantu yang digunakan bersama dengan Backbone.js, kita dapat menyebutkan seperti Chaplin, Marionette, Thorax.
Jika Anda perlu mengembangkan aplikasi yang dapat digunakan pengguna dari kelompok yang berbeda, maka Anda dapat menggunakan koleksi Backbone (array) untuk memisahkan model. Dalam model, koleksi, rute, dan tampilan Backbone, Anda dapat menggunakan acara.
▍ Elemen ekosistem tulang punggung
Di antara fitur-fitur ekosistem Backbone adalah sebagai berikut:
- Pustaka Backbone mencakup acara, model, koleksi, tampilan, dan router.
- Perpustakaan Underscore.js, yang menjadi sandaran Backbone, berisi serangkaian fungsi pembantu yang membantu Anda menulis kode JS lintas-browser.
- Saat mengembangkan aplikasi Backbone, Anda dapat menggunakan berbagai sistem template.
- Alat baris perintah Backbone CLI menyederhanakan pengembangan aplikasi.
- Perpustakaan Marionette, Thorax, dan Chaplin membantu membuat aplikasi dengan solusi arsitektur tertentu.
Mungkin Backbone tidak bisa disebut pesaing serius untuk alat pengembangan front-end lainnya yang dibahas dalam materi ini. Namun, kerangka kerja ini sangat populer di kalangan pengembang. Karena itu, mungkin ternyata Backbone tepat seperti yang Anda butuhkan.
Ringkasan
Artikel ini memberikan gambaran singkat tentang kerangka kerja web, yang diakui sebagai yang terbaik menurut survei yang dilakukan di antara pengembang dari
ValueCoders . Kami berharap ulasan ini akan membantu membuat pilihan yang tepat bagi mereka yang sibuk memilih kerangka kerja untuk proyek web berikutnya.
Pembaca yang budiman! Apa yang Anda tulis proyek web ujung depan?
