مكونات UI

المكونات الحرة

  • Amaze UI React (بالصينية): Amaze UI مكونات مبنيت بواسطة React.
  • Ant Design of React لغة تصميم واجهة المستخدم من صنف المؤسسات والتنفيذ القائم على React.
  • Belle: مكونات شكلية لـ React مع تجربة مستخدم جيدة.
  • chartify: مكون رسم بياني لـ React.js خفيف الحجم و قابل للتخصيص.
  • Elemental UI: مجموعة أدوات واجهة المستخدم لمواقع React وتطبيقاتها ، قابلة للتغيير وتتكون من مكونات منفصلة.
  • Grommet إطار تجربة المستخدم ( UX ) الموجه لتطبيقات المؤسسات. (مفتوح المصدر)
  • Halogen: مجموعة من رسوم التحميل الدوارة عالية التخصيص لـ React.
  • Khan Academy’s component library
  • markdown-to-jsx: يقوم بتحويل شيفرة الـ Markdown إلى شيفرة React JSX آمنة.
  • Material-UI: مكتبة لمكونات React تعتمد على Google Material Design.
  • Mobiscroll Lite for React: مجموعة مكونة من 15 مكونًا من مكونات واجهة المستخدم المجانية (inputs, selects,sliders ..etc).
  • Onsen UI React Components: مكونات واجهة المستخدم لتطبيقات الهواتف الهجينة التي تعمد على الـ Material Design لنظام الـ Android وعلى Flat Design لنظام الـ iOS.
  • PrimeReact: مجموعة مكونات واجهة المستخدم غنية لـ React تضم اكثر من 70 مكون مفتوحة المصدر.
  • React Amazing Grid نظام التقاسيم مع الأنماط المضمنة.
  • Material Components for React MDC React هو التنفيذ الرسمي لمكونات التي تعتمد على لـ Google Material Design.
  • React Native for Web يجعل من الممكن تشغيل مكونات React Native وواجهات برمجة التطبيقات على الويب باستخدام React DOM.
  • react-amiga-guru-meditation: React JS Class to display a Amiga Guru Meditation Tribute
  • react-autosuggest WAI-ARIA توافق للمكوّن React و الاقتراح الآلي لها
  • react-beautiful-dnd: توفر هذه المكتبة ميزة السحب والإسقاط بطريقة جميلة و سهلة الوصول للقوائم مع React.js.
  • react-bootstrap: مكونات Bootstrap 3 المبنية على React.
  • react-bootstrap-dialog: React Dialog هي مكون علبة حوار متوافق مع react-bootstrap بدلا من window.alert أو window.confirm.
  • react-bootstrap-table2: واجهة جدول جميلة متوافقة مع Bootstrap.
  • react-component: مجموعة من مكونات React التي يقوم موظف Alibaba/Alipay بصيانتها.
  • react-data-menu: تصيير القائمة الذكية لتسيير البيانات في تراكب والمحاذات على أساس التلميحات مع تخصيص مصيرين مع المعاملات ولا تقص أبدًا المكونات الأخرى أو حواف الشاشة.
  • react-date-picker: مكون datepicker بسيط قابل لإعادة الاستخدام ل React.
  • react-dates: حقول مدخلات للتاريخ ( Date-inputs + date-picker ).
  • react-dnd خدمة سحب وإفلات مرنة لـ React مع السيطرة الكاملة على DOM.
  • react-document-title عنوان محايد و متداخل و تعريفي لـ React عبر document.title.
  • react-dropzone: منطقة إسقاط ( Dropzone ) لتحميل الملفات.
  • react-forms: تصيير الإستمارة و المصادقة للـReact.
  • react-highlight: تضليل الكلمات المفتاحية لمكوّن React.
  • react-image: مثل <img /> ومكون الصور المحسنة لـ React.
  • react-input-autosize: مثل <input /> ولكن يتم تغيير حجمها تلقائيًا لتناسب جميع محتوياتها.
  • react-intense: مكون لعرض الصور الكبيرة عن قرب.
  • react-joyride: يمكنك إنشاء مسارات وجولات إرشادية لتطبيقات ReactJS الخاصة بك.
  • react-ladda: مكتبة React توفر ميزة تفاعلية ( التحميل .. ) لازرار ..
  • react-lorem-component: لوريم ابسوم ( Lorem Ipsum ) لمكونات React.
  • react-notification: شريط ( Snackbar ) ذو نمط إشعارات.
  • react-select: مكونات التحديد لـ React.
  • react-selectize: عنصر تحديد مرن و stateless لـ ReactJS.
  • react-sigma: مكتبة خفيفة لكنها قوية لرسم الرسوم البيانية للشبكة.
  • react-slick: مكون Carousel مبني لـ React.
  • react-sparklines: مكون لرسم منحنيات معبرة و جميلة.
  • react-spreadsheet: مكون جدول يمكنك من تبسيط عملية ادارة البيانات من خلاله
  • react-toggle: مكون React لعرض عنصر تحكم زر التبديل
  • react-tappable مكون React قابل للنقر.
  • react-textarea-autosize: مثل <textarea /> ولكن يتم تغيير حجمها تلقائيًا لتناسب جميع محتوياتها.
  • react-toastify: جعل إشعارات React سهلة.
  • React-TimeAgo مكون ReactJS بسيط لزمن.
  • react-translate-component: مكون React لتوطين (i18n).
  • react-treeview: شجرة عرض سهلة وخفيفة و مرنة.
  • react-uwp مجموعة من مكونات React التي تنفذ Microsoft UWP Design و Fluent Design ..
  • react-validate-framework: مكون React خفيف و قابل للتوسع من اجل التحقق من صحة البيانات.
  • reactstrap: مكونات Bootstrap 4 البسيطة مبنية على tether
  • recharts: مكتبة رسوم بيانية مبنية على مكونات React.
  • Selectivity: مكتبة اختيار خفيفة.
  • Semantic-ui: التكامل الدلالي الرسمي لواجهة مستخدم React.
  • storybook-addon-material-ui إضافة material-ui لـ storybook.
  • tcomb-form:توليد ستمارات الهوامش الآلي وملصقات ومصاقة السطرية من إستمارة النطاق.
  • valuelink: ميزة كاملة لربط البيانات ثنائية الإتجاه والمصادقة على الإستمارات مع قابلية الإمتداد لروابط React.
  • video-react: مشغل فيديو ويب مصمم خصيصًا لـ HTML5 باستخدام مكتبة React.
  • Winterfell: قم بإنشاء نماذج JSON معقدة وصحيحة وقابلة للتمديد في React.

مكونات قائمة على الرسوم

  • ag-Grid شبكة بيانات / جدول بيانات متقدم لـ React.
  • DevExtreme Reactive مكونات شبكة البيانات والجدولة والرسم البياني المستندة إلى المكونات الإضافية عالية الأداء من أجل Bootstrap و Material Design.
  • ExtReact components: اكثر من 115 مكون واجهة مستخدم جاهزة للاستخدام.
  • Grapecity Wijmo UI Components for React: وسّع خيارات واجهات React باستخدام مجموعة Wijmo الكاملة لمكونات JavaScript.
  • jQWidgets React components:اكثر من 70 مكون جاهزة للمؤسسات.
  • KendoReact: واجهة المستخدم لمطورين React.
  • Mobiscroll React UI Components ضوابط واجهة المستخدم المتنقلة لمطوّر React.