لوحة تحكم تحليلية

تفاصيل المشروع

تفاصيل المشروع:

واجهة حديثة متجاوبة

تصميم احترافي باستخدام CSS و Tailwind أو Styled Components، مع دعم كامل لجميع الشاشات (كمبيوتر – تابلت – هاتف).

هيكلية مشروع منظمة

اعتماد بنية مجلدات احترافية مع فصل المكوّنات، الصفحات، الخدمات، والهوكس (Hooks)، مما يجعل التطوير والصيانة أسهل.

إدارة الحالة

استخدام:

Redux Toolkit أو React Context API لإدارة البيانات عبر جميع صفحات اللوحة.

إمكانية دمج React Query لطلبات الـ API وتخزين الكاش.

نظام مصادقة (Authentication)

تسجيل دخول وخروج باستخدام JWT مع حماية الصفحات الخاصة (Protected Routes).

عرض البيانات بشكل مرئي

دمج مكتبات الرسوم البيانية مثل:

Recharts

Chart.js

ApexCharts

لعرض الإحصائيات والمبيعات والأداء بشكل جذّاب وسهل القراءة.

جداول ديناميكية

جداول احترافية مع:

بحث

تصفية

فرز

ترقيم الصفحات (Pagination)

باستخدام مكتبات مثل Material UI DataGrid أو TanStack Table.

لوحة إعدادات

تحكم في ألوان اللوحة (Dark/Light Mode)، وإعدادات الحساب والمظهر العام.

نظام إشعارات

تنبيهات فورية (Toast Notifications) باستخدام مكتبات مثل React Hot Toast أو Notistack.

تكامل مع API

الاتصال بواجهة خلفية (Node.js / Laravel / Django) عبر Axios أو Fetch لعرض بيانات حقيقية.