لوحة تحكم حديثة وقابلة للتوسع لإدارة المشاريع، تم بناؤها باستخدام Next و TypeScript لمساعدة المستخدمين على إدارة مشاريعهم، الـ Epics، والمهام بكفاءة عالية وضمن سير عمل منظم.
🔧 التقنيات المستخدمة (Tech Stack):
Framework: Next.js
Language: TypeScript
State Management: Redux Toolkit, Redux Thunk
Data Fetching & Caching: TanStack Query (React Query) - لإعادة هيكلة وتحسين كفاءة جلب البيانات
Styling: Tailwind CSS
Forms & Validation: React Hook Form + Zod
Features: Authentication (نظام مصادقة وتأمين الحسابات), REST API Integration
⚙️ الميزات الأساسية (Key Features):
نظام حماية ومصادقة آمن: تأمين الحسابات مع ميزة المسارات المحمية (Protected Routes).
إدارة كاملة للبيانات (CRUD Operations): إمكانية (إنشاء، قراءة، تحديث، وحذف) المشاريع، الـ Epics، والمهام.
بنية هيكلية متسلسلة: تنظيم مرن يبدأ من (المشاريع ← Epics ← المهام).
معالجة متطورة للنماذج: إدارة الاستمارات عبر React Hook Form مع التحقق من صحة المدخلات بواسطة Zod.
تقسيم البيانات (Pagination): لعرض وتصفح البيانات بكفاءة وسرعة عالية.
إدارة الحالة الشاملة: استخدام Redux Toolkit و Redux Thunk لإدارة حالة التطبيق عالمياً.
سحب وإفلات المهام (Drag & Drop): لتسهيل نقل المهام وتغيير حالتها بسلاسة.
واجهة مستخدم متجاوبة تماماً: متوافقة مع جميع الشاشات باستخدام Tailwind CSS.
بنية برمجية نظيفة: تصميم يعتمد على مكونات قابلة لإعادة الاستخدام (Reusable Components).
💡 أبرز نقاط القوة في المشروع (Highlights):
واجهة مستخدم عصرية: تصميم مميز يعتمد على أسلوب الـ Utility-first الخاص بـ Tailwind CSS.
بنية برمجية قابلة للتوسع: هندسة برمجية تعتمد على أنماط التصميم المجزأة (Modular Design Patterns).
أداء فائق وجلب ذكي للبيانات: تحسين عمليات الـ Async Data Fetching وإدارة الحالة البرمجية.
إدارة قوية للأخطاء: تحقق صارم من المدخلات ومعالجة ذكية للأخطاء قبل إرسالها للخادم.
تجربة مستخدم سلسة (UX): تصفح مرن وتصميم متجاوب يضمن راحة المستخدم.