Vue JS යනු තනි පිටු යෙදුම් (SPAs) සහ පරිශීලක අතුරුමුහුණත් සංවර්ධනය කිරීමට භාවිතා කරන ප්‍රගතිශීලී JavaScript රාමුවකි. තවද එය එහි බහුලව භාවිතා වන ඉදිරිපස රාමු වලින් එකකි.
Vue හි එක් සිත්ගන්නා ලක්ෂණයක් වන්නේ වෙබ් පිටුවක් විවිධ සංරචක වලට කැඩීමට ඇති හැකියාවයි. තවද UI සංරචක පුස්තකාල භාවිතය සමඟ මෙම ක්‍රියාවලිය සරල වේ.
ඔබට පහසුවෙන් සහ ඉක්මනින් සංරචක සෑදීමට උපකාර කළ හැකි විවිධ UI සංරචක පුස්තකාල තිබේ. එබැවින් මෙම බ්ලොගය තුළ, අපි 10 සඳහා ඉහළම Vue UI සංරචක පුස්තකාල 2021 සමාලෝචනය කරන්නෙමු.
1. PrimeVue
PrimeVue යනු භාවිතා කිරීමට සරල, බහුකාර්ය සහ ක්‍රියාකාරී Vue UI සංරචක පුස්තකාලයකි, එය ඔබට විශිෂ්ට පරිශීලක අතුරුමුහුණත් තැනීමට උපකාරී වේ.
එහි වෙබ් අන්තර්ගත ප්‍රවේශ්‍යතා මාර්ගෝපදේශ (WCAG) සහ ප්‍රතිචාරාත්මක නිර්මාණය සඳහා පූර්ණ සහාය ඇතිව 80+ UI සංරචක ඇත. මෑත යාවත්කාලීන කිරීමකට ස්තූතිවන්ත වන්නට, පුස්තකාලයට දැන් Vue 3 සඳහා පූර්ණ සහය ඇත. එයට තවත් සංරචක රාශියක් ද ලැබී ඇත.
Primevue හි ඇති හොඳම දේවලින් එකක් වන්නේ එහි පුළුල් පරාසයක සංරචක වේ. ඒවා වගු සහ පැජිනේටර්වල සිට අන්තර්ක්‍රියාකාරී Vue යෙදුම් සෑදීමට ඔබට භාවිතා කළ හැකි හොඳින් සැකසූ ප්‍රස්තාර පදනම් වූ සංවිධාන ප්‍රස්ථාර දක්වා විහිදේ. එය විවෘත මූලාශ්‍රයක් වන අතර Github හි තරු 1k+ සහ NPM මත සතිපතා බාගැනීම් 6,983ක් ඇත.
2. Vuetify
Vuetify යනු ද්රව්ය සැලසුම් පිරිවිතර භාවිතා කරන අලංකාර ලෙස අතින් සාදන ලද සංරචක සහිත Vue UI පුස්තකාලයකි. මෙයින් අදහස් කරන්නේ එය සෑම සංරචකයක්ම මොඩියුලර්, ප්‍රතිචාරාත්මක සහ ක්‍රියාකාරී ලෙස සූක්ෂම ලෙස සකස් කර ඇති ද්රව්ය සැලසුම් පිරිවිතරයන්ට අනුව හරියටම සංවර්ධනය කර ඇති බවයි.
Vuetify ඔබට ඔබේ යෙදුම් අද්විතීය සහ ගතික පිරිසැලසුම් සමඟ අභිරුචිකරණය කිරීමට සහ SASS විචල්‍යයන් භාවිතයෙන් ඔබේ සංරචකවල මෝස්තර පරිපූර්ණ කිරීමට ඉඩ දෙයි.
එය ප්‍රවේශ්‍යතා මාර්ගෝපදේශ, සියලුම නවීන බ්‍රව්සර් සඳහා සහය දක්වන අතර Vue CLI-3 සමඟ අනුකූල වේ. එය ඒකාබද්ධ කිරීමට පහසු වන අතර කැරොසල්, සංචාලන සහ කාඩ්පත් වැනි නැවත භාවිත කළ හැකි UI සංරචක රාශියක් ඇත. Vuetify විවෘත මූලාශ්‍රයක් වන අතර Github හි තරු 29k කට අධික සංඛ්‍යාවක් සහ NPM මත සතිපතා බාගැනීම් 319,170ක් ඇත.
3. Chakra UI Vue
චක්‍ර UI යනු සරල මොඩියුලර් සහ ප්‍රවේශ විය හැකි සංරචක පුස්තකාලයක් වන අතර එය ඔබට ඉක්මනින් සහ පහසුවෙන් Vue යෙදුම් තැනීමට මෙවලම් ලබා දෙයි.
සියලුම සංරචක වෙත ප්‍රවේශ විය හැකිය (එය දැඩි ලෙස WAI-ARIA ප්‍රමිතීන් අනුගමනය කරයි), තේමාත්මක සහ සංයුක්ත වේ. එය කොටුවෙන් පිටත ප්‍රතිචාරාත්මක මෝස්තර සඳහා සහය දක්වන අතර අඳුරු මාදිලියට අනුකූල වේ.
චක්‍ර UI හි CBox සහ CStack වැනි පිරිසැලසුම් සංරචක සමූහයක් ද අඩංගු වන අතර එමඟින් මුක්කු පසුකර ඔබේ සංරචක හැඩ ගැන්වීම පහසු කරයි. වෙබ්පැක් ප්ලගින විසඳුමක් භාවිතයෙන් Chakra UI Vue සංරචක ස්වයංක්‍රීයව ආනයනය කිරීමටද එය ඔබට ඉඩ සලසයි. එය විවෘත මූලාශ්‍රයක් වන අතර Github හි තරු 900+ සහ NPM මත සතිපතා 331 බාගැනීම් ඇත.
4. Bootstrap Vue
BootstrapVue, BootstrapVue සමඟින් ඔබට Vue.js සහ ජනප්‍රිය ඉදිරිපස CSS පුස්තකාලය - Bootstrap භාවිතයෙන් ප්‍රතිචාරාත්මක, ජංගම-පළමු, සහ ARIA වෙත ප්‍රවේශ විය හැකි ව්‍යාපෘති නිර්මාණය කළ හැක. ලේඛන තේරුම් ගැනීමට පහසු වන අතර එය සැකසීමටද පහසුය. එය ඉදිරිපස ක්‍රියාත්මක කිරීම් වේගවත් කරයි.
එය සංරචක 85+, ලබා ගත හැකි ප්ලගීන 45කට වඩා, විධාන කිහිපයක් සහ අයිකන 1000+ පිරිනමයි. එය පිරිසැලසුම් සහ ප්‍රතිචාරාත්මක සැලසුම් සඳහා සකස් කරන ලද ක්‍රියාකාරී සංරචක ද සපයයි. ඔබට Nuxt.js මොඩියුලය භාවිතයෙන් BootstrapVue ඔබගේ Nuxt.js ව්‍යාපෘති වෙත පහසුවෙන් ඒකාබද්ධ කළ හැක.
Bootstrap CSS රාමුව භාවිතා කරන ආකාරයටම එයද භාවිතා වේ. එය තරු 12.9k පමණ සහ 1.7k ගෑරුප්පු සහිත Github මත විවෘත මූලාශ්‍ර ඇත.
5. Vuesax
Vuesax යනු ව්‍යාපෘති පහසුවෙන් සහ අනන්‍ය සහ ප්‍රසන්න ශෛලියකින් නිර්මාණය කිරීම සඳහා Vuejs සමඟින් නිර්මාණය කරන ලද නව UI සංරචක රාමුවකි, vuesax මුල සිටම නිර්මාණය කර ඇති අතර ඔවුන්ගේ දෘශ්‍ය ප්‍රවේශය පහසුවෙන් නිර්මාණය කිරීමට කැමති ඉදිරිපස පෙම්වතාගේ සිට පසුපෙළ දක්වා සියලු වර්ගවල සංවර්ධකයින් සඳහා නිර්මාණය කර ඇත. අවසාන පරිශීලකයා. සැලසුම් එක් එක් සංරචක සඳහා අනන්‍ය වන අතර කිසිදු දෘෂ්‍ය ප්‍රවණතාවකට හෝ සැලසුම් රීතිවලට නැංගුරම් ලා නොමැත, එය සමඟ ගොඩනගා ඇති ව්‍යාපෘති ද අද්විතීය කරයි.
එය ප්‍රතිචාරාත්මක පිටු සහ නැවත භාවිත කළ හැකි සහ අභිරුචිකරණය කළ හැකි UI සංරචක ඉදිරිපත් කරයි. npm හෝ CDN භාවිතයෙන් ආරම්භ කිරීම ද පහසුය. එය දැනට එහි මෑත අනුවාදයේ Vue CLI 3 සඳහා සහය නොදක්වයි. එය Github හි තරු 4.9k පමණ සහ සතිපතා බාගැනීම් 6700 NPM සමඟ විවෘත මූලාශ්‍ර ඇත.
6. Ant Design Vue
Ant Design vue යනු Ant Design පිරිවිතර මත පදනම්ව, Ant design vue යනු පොහොසත්, අන්තර්ක්‍රියාකාරී පරිශීලක අතුරුමුහුණත් ගොඩනැගීම සඳහා උසස් තත්ත්වයේ සංරචක සහ ආදර්ශන සමූහයක් අඩංගු vue UI පුස්තකාලයකි.
Ant-design-vue ඔබේ Skeleton, ලාච්චුව, සංඛ්‍යාලේඛන සහ තවත් බොහෝ දේ වැනි වෙබ් යෙදුම් පොහොසත් කිරීමට UI සංරචක ඕනෑ තරම් සපයයි.
ant design vue අනුවාදය 2 මෑතදී නිකුත් කිරීමත් සමඟ, එය ඒකාබද්ධ කිරීමට වේගවත් සහ පහසු වන පරිදි යාවත්කාලීන කර ඇත, කුඩා මිටි ප්‍රමාණය, සහ Vue 3, New Composition API ලේඛනයට සහය දක්වයි. එය නවීන වෙබ් බ්‍රව්සර්, සේවාදායක පැත්තේ විදැහුම්කරණය සහ ඉලෙක්ට්‍රෝන සඳහාද සහය දක්වයි. එය Github හි තරු 13k කට වඩා ඇති අතර සතිපතා 39,693 NPM බාගැනීම් මත ඇත.
7. ක්වාසාර්
Quasar යනු හොඳම භාවිතයන් සමඟින් Quasar CLI හරහා සියලුම වේදිකා සඳහා එක් ප්‍රභව කේත පදනමක් භාවිතා කිරීමට සංවර්ධකයින්ට ඉඩ සලසන හොඳම Vue UI රාමු වලින් එකකි. එය අවට ඇති අනෙකුත් සියලුම බොයිලේරු ප්ලේටින් ද්රව්ය (පද්ධතිය ගොඩනැගීම, පිරිසැලසුම) වලට වඩා ඔවුන්ගේ යෙදුමේ අන්තර්ගතය කෙරෙහි අවධානය යොමු කිරීමට සංවර්ධකයින්ට ඉඩ සලසයි. එය ද්රව්ය 2.0 මාර්ගෝපදේශ අනුගමනය කිරීම කෙරෙහි අවධානය යොමු කර ඇති අතර ඉතා සහයෝගය දක්වන ප්‍රජාවක් ද ඇත.
Quasar හි ඇති එක් විශේෂ කරුණක් නම්, එක් වරක් කේතයක් ලිවීමට සහ එකවරම එය වෙබ් අඩවියක්, ජංගම යෙදුමක් ලෙස එක් කේත පදනමක් භාවිතා කිරීමට ඇති හැකියාවයි. vue 3 විශේෂාංග සඳහා සහය දක්වන නව අනුවාදයක් ද දැනට බීටා හි ඇත. එහි Github හි තරු 17.8k පමණ ඇත.
8. බුෆි
Buefy යනු Bulma (CSS රාමුවක්) මත පදනම් වූ Vue JS සඳහා වන සැහැල්ලු UI සංරචක පුස්තකාලයකි. Buefy Bulma Vue සමඟ ඒකාබද්ධ කරයි, ඔබට අවම කේතයක් භාවිතයෙන් හොඳ පෙනුමක් ඇති යෙදුම් තැනීමට උදවු කරයි. එය ඔබගේ Bulma අතුරුමුහුණත සඳහා javascript ස්ථරය වේ.
එය සාමාන්‍ය වෙබ් පිටුවක සම්පූර්ණයෙන්ම හෝ තනි සංරචක ආයාත කළ හැක. එය ඔබගේ ව්‍යාපෘතියට අනුකලනය කිරීම ඉතා පහසුයි, එක්කෝ npm හෝ CDN භාවිතයෙන් කළ හැක.
Buefy සූදානම් කළ UI සංරචක, පිරිසැලසුම සහ අයිකන සපයයි. සංරචක ඔබේ තේමාවට SASS භාවිතා කළ හැක. එය නවීන බ්‍රව්සර් සඳහාද සහය දක්වයි.
9. Vue ද්රව්ය
Vue Material යනු ද්රව්ය සැලසුම් පිරිවිතර ක්‍රියාත්මක කරන බහුලව භාවිතා වන සැහැල්ලු රාමුවකි. එය Vue.js සහ Material Design specs අතර ඇති හොඳම ඒකාබද්ධතාවයකි! ඔබට පහසු API හරහා ඔබගේ සියලු අවශ්‍යතා වලට ගැලපෙන පරිදි එය පහසුවෙන් වින්‍යාසගත කළ හැක.
එය සියලුම නවීන වෙබ් බ්‍රව්සර් සඳහා ප්‍රතිචාරාත්මක නිර්මාණය සහ සහාය සමඟ අනුකූල වේ. පුස්තකාලය තේමා, සංරචක සහ UI මූලද්‍රව්‍ය ලෙස බෙදා ඇත. තේමා ඔබේ යෙදුම තේමා කරන්නේ කෙසේද (හෝ ඔබේම තේමා ලියන්න) සහ සංරචක සහ UI මූලද්‍රව්‍ය පිරිසැලසුම්, සංචාලනය, මුද්‍රණ ශිල්පය, අයිකන සහ තවත් සංරචක 30 කින් සමන්විත වේ. එහි Github හි තරු 9.2k සහ 1.1k ගෑරුප්පු සහ 21k + සතිපතා බාගත කිරීම් NPM ඇත.
10. KeenUI
KeenUI යනු Google හි ද්රව්ය නිර්මාණයෙන් ආභාෂය ලැබූ සරල API එකක් සහිත සැහැල්ලු vue.js UI පුස්තකාලයකි. Keen UI CSS රාමුවක් නොවේ. එබැවින්, එය ජාල පද්ධතියක් සඳහා මෝස්තර, මුද්‍රණ ශිල්පය යනාදිය ඇතුළත් නොවේ. ඒ වෙනුවට, Javascript අවශ්‍ය වන අන්තර්ක්‍රියාකාරී සංරචක කෙරෙහි අවධානය යොමු කෙරේ.
එය නැවත භාවිතා කළ හැකි සංරචක 30 ක් පමණ ඇත. SASS විචල්‍ය භාවිතා කරමින් මෝස්තර අභිබවා යාමෙන් සංරචක අභිරුචිකරණය කළ හැකිය. CDN හෝ npm භාවිතයෙන් ඔබට එය ඔබගේ ව්‍යාපෘතියට අනුකලනය කළ හැක. එය විවෘත මූලාශ්‍ර වන අතර Github හි තරු 4k පමණ ඇත.
නිගමනය
UI සංරචක පුස්තකාල නිසැකවම ව්‍යාපෘතියක් ගොඩ නැගීම වඩාත් පහසු කරයි. නිවැරදි එක තෝරා ගැනීම ඔබට වැඩ කිරීමට අවශ්‍ය ව්‍යාපෘතියේ විශේෂාංග මත රඳා පවතී. නව ව්‍යාපෘතියකට කිමිදීමට පෙර, ඒ සඳහා වඩාත් සුදුසු UI සංරචක පුස්තකාලය සමාලෝචනය කිරීම යෝග්‍ය වේ.