كل مشروع لوحة تحكم يعيد بناء الطبقة نفسها: تسجيل الدخول، والتخطيط، والجداول، والأشجار، والإشعارات، والإعدادات، والحالات الفارغة وحالات الخطأ. ثم تختلف الألوان والمسافات وتفاصيل التفاعل، ويزيد كلفة الحفاظ على الاتساق مع كل صفحة جديدة.

جمعنا هذه الطبقة في أساس واحد قابل لإعادة الاستخدام وأتاحناه برخصة MIT: admin-design، تصميم وتنفيذ لوحة تحكم معيارية مستخرجان من واجهة منصة Runlume.

ما الذي يشمله

  • السمة والرموز الدلالية: لا يمر اللون إلا عبر أصناف أدوات دلالية، مع ست لوحات ألوان جاهزة تُدمج مع اللون الأساسي ولون السمة، ويتابع الوضعان الفاتح والداكن تلقائياً.
  • ثلاثة هياكل تخطيط: تنقّل جانبي، وأعلى مع جانبي، وتنقّل علوي. ويمكن ضبط عرض الشريط الجانبي والاستدارة وانتقالات الصفحة وترتيب إجراءات الشريط العلوي.
  • تسع صفحات مكوّنات: عناصر أساسية، ونماذج واختيارات، وعرض بيانات، وتنبيهات وطبقات، وتنقّل ومسارات، ومؤشرات ومخططات، وأيقونات، وسمة وإعدادات، وصفحات معيارية. ويعمل المعرض كتوثيق وكمساحة قبول في الوقت نفسه.
  • أنواع الصفحات المعيارية: لوحة العمل، والقائمة، والتفاصيل، والإعدادات، ومركز الإشعارات، وتسجيل الدخول، والتسجيل، واستعادة كلمة المرور.
  • الصينية والإنجليزية افتراضياً، والوصول بلوحة المفاتيح وخيارات إمكانية الوصول، مع البحث نفسه بلوحة الأوامر المستخدم في موقع التوثيق.

ثلاثة مداخل

لمن يناسب، وأين الحدود

يناسب الفرق التي تبني لوحة التحكم بنفسها ولا تريد كتابة الواجهة من الصفر مرة ثانية: انسخ المستودع، وغيّر الاسم في package.json، واستبدل القائمة وأصول العلامة، ووجّه البيانات التجريبية إلى واجهتك البرمجية.

لا يحتوي المشروع إلا طبقة التصميم والتفاعل: بلا واجهات أعمال، وبلا تنفيذ للمصادقة، وبلا نموذج صلاحيات، وبلا قواعد عمل. البيانات التجريبية في الذاكرة وتُعاد عند التحديث. أما الهوية والرفع والسحب في الأشجار والتحميل المتأخر فتُحقن عبر props، أي أن ربط خدمة حقيقية يعني استبدال الدالة وليس تعديل المكوّن.