TailAdmin هو قالب لوحة تحكم إداري مجاني ومفتوح المصدر مبني على React وTailwind CSS ، مما يوفر للمطورين كل ما يحتاجون إليه لإنشاء حل شامل ومعتمد على البيانات أو لوحة تحكم أو لوحة تحكم لمشاريع الويب القادمة.
باستخدام TailAdmin، يمكنك الوصول إلى جميع مكونات واجهة مستخدم لوحة المعلومات والعناصر والصفحات اللازمة لإنشاء لوحة تحكم أو لوحة تحكم كاملة وغنية بالميزات. سواء كنت تقوم بإنشاء لوحة تحكم أو لوحة إدارة لتطبيق ويب معقد أو موقع ويب بسيط، فإن TailAdmin هو الحل الأمثل لمساعدتك في البدء والتشغيل بسرعة.
5 لوحات تحكم فريدة: التحليلات والتجارة الإلكترونية والتسويق وإدارة علاقات العملاء (سيتم إضافة المزيد)
120+ مكونات واجهة المستخدم للوحة القيادة
200+ إجمالي عناصر واجهة المستخدم
45+ ملفات HTML
جميع العناصر والملفات الأساسية
مصدر تصميم Figma الكامل - كما هو موضح في العرض التوضيحي
1 لوحة تحكم مميزة
30+ مكونات واجهة المستخدم للوحة القيادة
50+ إجمالي عناصر واجهة المستخدم
10+ ملفات HTML
دعم تايب سكريبت
عناصر وملفات مجموعة واجهة المستخدم الأساسية
مصدر تصميم فيجما – عينة مجانية
يعد قالب لوحة معلومات TailAdmin React المستند إلى Tailwind CSS بمثابة نقطة بداية مصممة مسبقًا لإنشاء لوحة معلومات على الويب باستخدام مكتبة React JavaScript وإطار عمل الأداة المساعدة Tailwind CSS أولاً. تم تصميم قالب Tailwind CSS + React Dashboard باستخدام Tailwind CSS ويتضمن مكونات تم إنشاؤها مسبقًا، مثل قوائم التنقل والمخططات والجداول والنماذج، والتي يمكن تخصيصها بسهولة ودمجها في تطبيق ويب React صغير إلى كبير .
إذا كنت تبحث عن لوحة معلومات React-Tailwind عالية الجودة، أو قالب لوحة الإدارة، أو مجموعة أدوات واجهة المستخدم ، فسيكون TailAdmin هو الخيار الأمثل لك!
ستحتاج إلى تثبيت Node.js >=v14.16+ (الإصدار الموصى به) (يأتي NPM معه) ويستخدم TailAdmin Vite لأدوات الواجهة الأمامية، لإجراء التثبيت وبناء إصدار الإنتاج، يرجى اتباع الخطوات التالية أدناه:
استخدم المحطة وانتقل إلى جذر المشروع (tailadmin-react).
ثم قم بتشغيل: npm install
ثم قم بتشغيل: npm run dev
الآن، في المتصفح انتقل إلى localhost:5173
لتشغيل بناء الإنتاج : npm run build
دليل إخراج البناء الافتراضي: /dist
سيقوم هذا الأمر بإنشاء مجلد إنشاء في جذر القالب الخاص بك والذي يمكنك تحميله على الخادم الخاص بك.
React وTailwind هما تقنيتان شائعتان أحدثتا ثورة في عالم تطوير الويب. React هي مكتبة JavaScript لبناء واجهات المستخدم، في حين أن Tailwind عبارة عن إطار عمل CSS أولي يسهل تصميم تطبيقات الويب. يقدم TailAdmin React أكثر من 200 مكون أساسي من مكونات React + Tailwind CSS UI التي تقوم بنسخها ولصقها واستخدامها مع مشاريع لوحة المعلومات الخاصة بك. يتضمن ذلك - الرسوم البيانية، والرسوم البيانية، وأشرطة التنقل، وعلامات التبويب، والأزرار، والبطاقات، والجداول، والملف الشخصي، وعلامات التبويب، والنماذج، والنماذج، وصفحات التطبيق، والتقويم، وقوالب أمثلة تطبيقات الويب والمزيد... لـ React and Styled باستخدام Tailwind CSS
التحسين 01: إزالة تكرار DefaultLayout في كل الصفحات
التحسين 02: إضافة ClickOutside Component لتقليل الوظائف المتكررة في رسالة الرأس والإشعارات والقوائم المنسدلة للمستخدم.
التحسين 01: دمج flatpickr في [منتقي التاريخ/عناصر النموذج]
التحسين 02: تغيير اللون بعد تحديد خيار [تحديد عنصر/عناصر النموذج].
التحسين 03: اجعله فعالاً [عناصر النموذج/القائمة المنسدلة المتعددة التحديد].
التحسين 04: جعل أفضل قيمة قابلة للتحرير [جدول التسعير الأول/جدول التسعير].
التحسين 05: إعادة ترتيب بنية المجلد.
أضف Typescript في TailAdmin React.
الإصدار الأولي من TailAdmin React.