Top-Vue-UI-Component-Libraries-lan-Frameworks-kanggo-Ditimbang-ing-2021

 

Vue JS minangka kerangka JavaScript progresif sing digunakake kanggo ngembangake aplikasi siji-halaman (SPA) lan Antarmuka Panganggo. Lan iku salah siji saka frameworks ngarep-mburi paling wiyar digunakake metu ana.

 

Salah sawijining fitur menarik saka Vue yaiku kemampuan kanggo ngrusak kaca web dadi komponen sing beda. Lan proses iki dadi luwih prasaja kanthi nggunakake perpustakaan komponen UI.

 

Ana macem-macem perpustakaan komponen UI sing bisa mbantu nggawe komponen kanthi gampang lan cepet. Dadi ing blog iki, kita bakal mriksa 10 Pustaka Komponen Vue UI paling ndhuwur kanggo taun 2021.

 

1. PrimeVue

 

PrimeVue punika prasaja kanggo nggunakake, Versatile, lan performant Vue UI Component Library sing mbantu mbangun antarmuka panganggo apik tenan.

 

Nduwe luwih saka 80+ komponen UI kanthi dhukungan lengkap kanggo Pedoman Aksesibilitas Konten Web (WCAG) lan desain responsif. Lan thanks kanggo nganyari anyar, perpustakaan saiki wis support lengkap kanggo Vue 3. Uga tak Bunch liyane komponen.

 

Salah siji sing paling apik babagan Primevue yaiku sawetara komponen sing akeh. Iki kalebu saka tabel lan paginator nganti grafik organisasi adhedhasar grafik sing bisa digunakake kanggo nggawe aplikasi Vue interaktif. Iku mbukak-sumber lan duwe 1k+ lintang ing Github lan 6,983 download saben minggu ing NPM.

 

2. Vuetify

 

Vuetify minangka Pustaka UI Vue kanthi Komponen digawe kanthi apik sing nggunakake spesifikasi Desain Material. Iki tegese wis dikembangake persis miturut spesifikasi Desain Material kanthi saben komponen digawe kanthi tliti supaya modular, responsif, lan performa.

 

Vuetify ngidini sampeyan ngatur aplikasi kanthi tata letak unik lan dinamis lan nyampurnakake gaya komponen sampeyan nggunakake variabel SASS.

 

Uga ndhukung pedoman aksesibilitas, kabeh browser modern, lan kompatibel karo Vue CLI-3. Gampang kanggo nggabungake lan duwe akeh komponen UI sing bisa digunakake maneh kaya carousel, navigasi, lan kertu. Vuetify punika open source lan karo liwat 29k lintang ing Github lan 319,170 download saben minggu ing NPM.

 

3. Cakra UI Vue

 

Chakra UI minangka perpustakaan komponen modular lan gampang diakses sing menehi alat kanggo mbangun aplikasi Vue kanthi cepet lan gampang.

 

Kabeh komponen bisa diakses (sing bener ngetutake standar WAI-ARIA), bisa ditemoni, lan bisa disusun. Ndhukung gaya responsif metu saka kothak lan kompatibel karo mode peteng.

 

UI Chakra uga ngemot sakumpulan komponen tata letak kaya CBox lan CStack sing nggampangake gaya komponen kanthi ngliwati prop. Sampeyan uga ngidini sampeyan ngimpor komponen Chakra UI Vue kanthi otomatis nggunakake solusi plugin webpack. Iki mbukak-sumber lan duwe 900+ bintang ing Github lan 331 download saben minggu ing NPM.

 

4. Bootstrap Vue

 

BootstrapVue, Kanthi BootstrapVue sampeyan bisa mbangun proyek responsif, mobile-first, lan ARIA ing web nggunakake Vue.js lan perpustakaan CSS ngarep-mburi sing populer - Bootstrap. Dokumentasi gampang dingerteni lan uga gampang diatur. Iku ndadekake implementasine ngarep-mburi rampung luwih cepet.

 

Nawakake 85+ komponen, luwih saka 45 plugin sing kasedhiya, sawetara arahan, lan 1000+ lambang. Uga nyedhiyakake komponen fungsional sing cocog kanggo tata letak lan desain responsif. sampeyan uga bisa kanthi gampang nggabungake BootstrapVue menyang proyek Nuxt.js nggunakake modul Nuxt.js.

 

Iki uga digunakake kanthi cara sing padha karo framework CSS bootstrap sing digunakake. Iki mbukak sumber ing Github kanthi lintang 12.9k lan garpu 1.7k.

 

5. Wulan

 

Vuesax minangka kerangka komponen UI anyar sing digawe karo Vuejs kanggo nggawe proyek kanthi gampang lan kanthi gaya unik lan nyenengake, vuesax digawe saka awal lan dirancang kanggo kabeh jinis pangembang saka pacangan frontend nganti backend sing pengin nggawe pendekatan visual kanthi gampang. pangguna pungkasan. Desain kasebut unik kanggo saben komponen lan ora ana gandhengane karo tren visual utawa aturan desain, nggawe proyek sing dibangun uga unik.

 

nawakake kaca responsif lan komponen UI sing bisa digunakake maneh lan bisa disesuaikan. Sampeyan uga gampang kanggo miwiti nggunakake npm utawa CDN. Saiki ora ndhukung Vue CLI 3 ing versi paling anyar. Iki mbukak-sumber ing Github kanthi lintang 4.9k lan 6700 download NPM saben minggu.

 

6. Ant Design Vue

 

Ant Design vue adhedhasar specification Ant Design, Ant design vue perpustakaan vue UI sing ngemot pesawat saka komponen kualitas dhuwur lan demo kanggo mbangun sugih, antarmuka panganggo interaktif.

 

Ant-design-vue nyedhiyakake akeh komponen UI kanggo nambah aplikasi web kayata Skeleton, laci, statistik lan liya-liyane.

 

Kanthi release anyar vue desain semut versi 2, wis dianyari dadi luwih cepet lan luwih gampang kanggo nggabungake, ukuran mbendel cilik, lan uga ndhukung Vue 3, New Compposition API document. Uga ndhukung browser web modern, Rendering sisih server, lan elektron. Wis luwih saka 13k lintang ing Github lan 39,693 undhuhan mingguan NPM.

 

7. Kuasar

 

Quasar minangka salah sawijining kerangka UI Vue paling apik sing ngidini pangembang nggunakake siji basis kode sumber kanggo kabeh platform liwat Quasar CLI kanthi praktik paling apik. Ngidini pangembang fokus ing konten App tinimbang kabeh barang plating boiler liyane (sistem mbangun, tata letak) ing saubengé. iku fokus ing tindakake pedoman Material 2.0 lan uga wis masyarakat banget ndhukung.

 

Salah sawijining perkara khusus babagan Quasar yaiku kemampuan kanggo nulis kode sapisan lan kanthi bebarengan nyebarake minangka situs web, Aplikasi Seluler mung nggunakake siji basis kode. Ana uga versi anyar sing saiki ing beta sing bakal ndhukung fitur vue 3. Wis udakara 17.8k lintang ing Github.

 

8. Buefy

 

Buefy minangka perpustakaan komponen UI sing entheng kanggo Vue JS adhedhasar Bulma (kerangka CSS). Buefy nggabungake Bulma karo Vue, mbantu sampeyan mbangun aplikasi sing apik nggunakake kode minimal. iku lapisan javascript kanggo antarmuka Bulma Panjenengan.

 

Bisa diimpor kanthi lengkap utawa siji komponen ing kaca web biasa. Nggabungake menyang proyek sampeyan cukup gampang, bisa ditindakake nggunakake npm utawa CDN.

 

Buefy nyedhiyakake komponen, tata letak, lan lambang UI sing wis siap. Komponen bisa nggunakake SASS kanggo tema sampeyan. Uga ndhukung browser modern.

 

9. Materi Pangkur

 

Vue Material minangka kerangka kerja ringan sing digunakake kanthi akeh sing ngetrapake spesifikasi Desain Material. Iki minangka salah sawijining integrasi paling apik ing antarane Vue.js lan spek Desain Material! Sampeyan bisa gampang ngatur kanggo cocog kabeh kabutuhan liwat API gampang.

 

Iki kompatibel karo desain responsif lan dhukungan kanggo kabeh Browser Web modern. Pustaka dipérang dadi Tema, Komponen, lan Elemen UI. Tema kasebut menehi pandhuan definitif babagan cara nggawe tema aplikasi sampeyan (utawa nulis tema sampeyan dhewe) lan Komponen lan Elemen UI kalebu tata letak, navigasi, tipografi, lambang, lan 30 komponen liyane. Wis udakara 9.2k lintang lan 1.1k garpu ing Github lan 21k + undhuhan mingguan NPM.

 

10. KeenUI

 

KeenUI minangka perpustakaan UI vue.js sing entheng kanthi API sing prasaja, sing diilhami dening Desain Material Google. Keen UI dudu kerangka CSS. Mulane, iku ora kalebu gaya kanggo sistem kothak, typography, etc. Nanging, fokus ing komponen interaktif sing mbutuhake Javascript.

 

Wis kira-kira 30 komponen sing bisa digunakake maneh. Komponen bisa disesuaikan kanthi ngganti gaya nggunakake variabel SASS. sampeyan bisa nggabungake menyang proyek sampeyan nggunakake CDN utawa npm. Iki mbukak sumber lan duwe lintang 4k ing Github.

 

kesimpulan

 

Pustaka komponen UI mesthi nggawe proyek luwih gampang. Milih sing bener gumantung saka fitur proyek sing pengin digarap. Sadurunge nyilem menyang proyek anyar, disaranake kanggo mriksa perpustakaan komponen UI sing paling cocog kanggo tujuan kasebut.