Vue JS tək səhifəli proqramlar (SPA) və İstifadəçi İnterfeyslərini inkişaf etdirmək üçün istifadə olunan mütərəqqi JavaScript çərçivəsidir. Və bu, orada ən çox istifadə olunan front-end çərçivələrindən biridir.
Vue-nin maraqlı xüsusiyyətlərindən biri veb səhifəni müxtəlif komponentlərə bölmək qabiliyyətidir. Və bu proses UI komponent kitabxanalarının istifadəsi ilə sadələşir.
Asanlıqla və tez komponentlər yaratmağa kömək edə biləcək müxtəlif UI komponent kitabxanaları var. Beləliklə, bu bloqda 10-ci il üçün ən yaxşı 2021 Vue UI Komponent Kitabxanasını nəzərdən keçirəcəyik.
1. PrimeVue
PrimeVue istifadə üçün sadə, çox yönlü və performanslı Vue UI Komponent Kitabxanasıdır ki, sizə gözəl istifadəçi interfeysləri yaratmağa kömək edir.
Veb Məzmununa Əlçatanlıq Təlimatları (WCAG) və cavab verən dizayn üçün tam dəstək olan 80-dən çox UI komponentinə malikdir. Və son yeniləmə sayəsində kitabxana artıq Vue 3 üçün tam dəstəyə malikdir. O, həmçinin daha çox komponentə malikdir.
Primevue ilə bağlı ən yaxşı şeylərdən biri onun geniş çeşidli komponentləridir. Onlar cədvəllər və paginatorlardan tutmuş, interaktiv Vue proqramları yaratmaq üçün istifadə edə biləcəyiniz yaxşı işlənmiş qrafik əsaslı təşkilat diaqramlarına qədər dəyişir. Açıq mənbəlidir və Github-da 1k+ ulduz və NPM-də həftəlik 6,983 endirmə var.
2. Vuetify
Vuetify, Material Dizayn spesifikasiyasından istifadə edən gözəl əl işi Komponentləri olan Vue UI Kitabxanasıdır. Bu o deməkdir ki, o, tam olaraq Material Dizayn spesifikasiyasına uyğun olaraq hazırlanmışdır və hər bir komponent modul, həssas və performanslı olmaq üçün diqqətlə hazırlanmışdır.
Vuetify tətbiqlərinizi unikal və dinamik tərtibatlarla fərdiləşdirməyə və SASS dəyişənlərindən istifadə edərək komponentlərinizin üslublarını mükəmməlləşdirməyə imkan verir.
O, həmçinin əlçatanlıq təlimatlarını, bütün müasir brauzerləri dəstəkləyir və Vue CLI-3 ilə uyğun gəlir. İnteqrasiya etmək asandır və karusellər, naviqasiyalar və kartlar kimi çoxlu təkrar istifadə edilə bilən UI komponentlərinə malikdir. Vuetify açıq mənbədir və Github-da 29k-dan çox ulduz və NPM-də həftəlik 319,170 yükləmə ilə.
3. Chakra UI Vue
Chakra UI sizə Vue proqramlarını tez və asanlıqla qurmaq üçün alətlər verən sadə modul və əlçatan komponent kitabxanasıdır.
Bütün komponentlər əlçatandır (WAI-ARIA standartlarına ciddi şəkildə əməl edir), mövzuya uyğundur və tərtib edilə bilər. O, qutudan kənarda cavab verən üslubları dəstəkləyir və qaranlıq rejimə uyğundur.
Chakra UI həmçinin CBox və CStack kimi rekvizitləri ötürməklə komponentlərinizin üslubunu asanlaşdıran bir sıra tərtibat komponentlərini ehtiva edir. O, həmçinin veb paketi plagin həllindən istifadə edərək Chakra UI Vue komponentlərini avtomatik idxal etməyə imkan verir. O, açıq mənbəlidir və Github-da 900+ ulduza və NPM-də həftəlik 331 yükləməyə malikdir.
4. Bootstrap Vue
BootstrapVue, BootstrapVue ilə siz Vue.js və məşhur CSS kitabxanası — Bootstrap-dan istifadə edərək internetdə cavab verən, ilk mobil və ARIA əlçatan layihələr qura bilərsiniz. Sənədləri başa düşmək asandır və qurmaq da asandır. Front-end tətbiqlərini daha sürətli edir.
85+ komponent, 45-dən çox mövcud plaginlər, bir neçə direktiv və 1000+ nişanlar təklif edir. O, həmçinin layouts və həssas dizayn üçün uyğunlaşdırılmış funksional komponentləri təmin edir. siz həmçinin Nuxt.js modulundan istifadə edərək BootstrapVue-ni Nuxt.js layihələrinizə asanlıqla inteqrasiya edə bilərsiniz.
O, həmçinin bootstrap CSS çərçivəsi istifadə edildiyi kimi istifadə olunur. Təxminən 12.9k ulduz və 1.7k çəngəl ilə Github-da açıq mənbəlidir.
5. Vueax
Vuesax layihələri asanlıqla və unikal və xoş bir üslubda etmək üçün Vuejs ilə yaradılmış yeni UI komponent çərçivəsidir, vuesax sıfırdan yaradılmışdır və frontend həvəskarından tutmuş arxa plana qədər öz vizual yanaşmasını asanlıqla yaratmaq istəyən bütün tərtibatçılar üçün nəzərdə tutulmuşdur. son istifadəçi. Dizaynlar hər bir komponent üçün unikaldır və heç bir vizual tendensiyaya və ya dizayn qaydalarına uyğun gəlmir, bununla da onunla tikilmiş layihələri də unikal edir.
cavab verən səhifələr və təkrar istifadə edilə bilən və fərdiləşdirilə bilən UI komponentləri təklif edir. Npm və ya CDN istifadə edərək işə başlamaq da asandır. Hal-hazırda son versiyasında Vue CLI 3-ü dəstəkləmir. Təxminən 4.9k ulduz və 6700 həftəlik yükləmə NPM ilə Github-da açıq mənbəlidir.
6. Ant Design Vue
Ant Design spesifikasiyasına əsaslanan Ant Design vue, Ant design vue zəngin, interaktiv istifadəçi interfeysləri yaratmaq üçün yüksək keyfiyyətli komponentlər və demolar dəstindən ibarət Vue UI kitabxanasıdır.
Ant-design-vue Skeleton, çekmece, statistika və sair kimi veb proqramlarınızı zənginləşdirmək üçün çoxlu UI komponentləri təqdim edir.
Qarışqa dizaynı vue versiyası 2-nin son buraxılışı ilə daha sürətli və daha asan inteqrasiya olunmaq üçün yeniləndi, daha kiçik paket ölçüsü, həmçinin Vue 3, Yeni Kompozisiya API sənədini dəstəkləyir. O, həmçinin müasir veb-brauzerləri, server tərəfində göstərmə və elektronu dəstəkləyir. Onun Github-da 13k-dan çox ulduzu var və həftəlik 39,693 NPM yükləməsi var.
7. Kvazar
Quasar, tərtibatçılara Quasar CLI vasitəsilə ən yaxşı təcrübələrlə bütün platformalar üçün bir mənbə kodu bazasından istifadə etməyə imkan verən ən yaxşı Vue UI çərçivələrindən biridir. Bu, tərtibatçılara onun ətrafındakı bütün digər qazan örtükləri (qurma sistemi, tərtibat) deyil, onların Tətbiq məzmununa diqqət yetirməyə imkan verir. o, Material 2.0 təlimatlarına əməl etməyə yönəlib və həmçinin çox dəstəkləyən icmaya malikdir.
Quasar-ın özəl cəhətlərindən biri kodu bir dəfə yazmaq və eyni zamanda onu yalnız bir kod bazasından istifadə edərək vebsayt, Mobil Tətbiq kimi yerləşdirmək imkanıdır. Vue 3 funksiyalarını dəstəkləyən beta-da olan yeni versiya da var. Github-da təxminən 17.8k ulduz var.
8. Buefy
Buefy, Bulma (CSS çərçivəsi) əsasında Vue JS üçün yüngül UI komponent kitabxanasıdır. Buefy, Bulma ilə Vue-ni birləşdirir, minimal koddan istifadə edərək gözəl görünüşlü proqramlar yaratmağa kömək edir. Bu Bulma interfeysiniz üçün javascript qatıdır.
O, adi bir veb-səhifədə tamamilə və ya tək komponentlər idxal edilə bilər. Layihənizə inteqrasiya etmək olduqca asandır, ya npm və ya CDN istifadə etməklə edilə bilər.
Buefy hazır UI komponentləri, tərtibat və nişanlar təqdim edir. Komponentlər mövzunuz üçün SASS istifadə edə bilər. O, həmçinin müasir brauzerləri dəstəkləyir.
9. Vue Materialı
Vue Material, Material Dizayn spesifikasiyalarını həyata keçirən geniş istifadə olunan, yüngül çərçivədir. Bu, Vue.js və Material Design xüsusiyyətləri arasında ən yaxşı inteqrasiyalardan biridir! Asan bir API vasitəsilə onu bütün ehtiyaclarınıza uyğunlaşdırmaq üçün asanlıqla konfiqurasiya edə bilərsiniz.
Bütün müasir Veb Brauzerlər üçün cavab verən dizayn və dəstək ilə uyğun gəlir. Kitabxana Mövzulara, Komponentlərə və UI Elementlərinə bölünür. Mövzular tətbiqinizi necə mövzulandırmaq (və ya öz mövzularınızı yazmaq) haqqında qəti bələdçi verir və Komponentlər və UI Elementləri planlar, naviqasiya, tipoqrafiya, nişanlar və daha 30 komponentdən ibarətdir. Github-da təxminən 9.2k ulduz və 1.1k çəngəl və 21k + həftəlik yükləmələr NPM var.
10. KeenUI
KeenUI, Google-un Material Dizaynından ilhamlanmış sadə API ilə yüngül vue.js UI kitabxanasıdır. Keen UI CSS çərçivəsi deyil. Buna görə də, o, şəbəkə sistemi, mətbəə və s. üslubları daxil etmir. Bunun əvəzinə diqqət Javascript tələb edən interaktiv komponentlərə verilir.
Təxminən 30 təkrar istifadə edilə bilən komponentlərə malikdir. Komponentlər SASS dəyişənlərindən istifadə edərək üslubları ləğv etməklə fərdiləşdirilə bilər. onu ya CDN, ya da npm istifadə edərək layihənizə inteqrasiya edə bilərsiniz. Açıq mənbəlidir və Github-da təxminən 4k ulduzu var.
Nəticə
UI komponent kitabxanaları, şübhəsiz ki, bir layihə qurmağı çox asanlaşdırır. Düzgün olanı seçmək üzərində işləmək istədiyiniz layihənin xüsusiyyətlərindən asılıdır. Yeni bir layihəyə başlamazdan əvvəl, məqsəd üçün ən uyğun olan UI komponent kitabxanasını nəzərdən keçirmək məsləhətdir.