Student Affairs System web Application using js ECMAScript

هذا المشروع عبارة عن منصة إدارية متكاملة تعتمد على بنية التطبيق أحادي الصفحة (Single Page Application - SPA)، صُممت خصيصاً لإدارة شؤون الطلاب بكفاءة وسلاسة. تم بناء النظام بالكامل باستخدام المعايير الحديثة للغة JavaScript (ECMAScript) مع التركيز على البنية البرمجية القائمة على الفئات والموديولات البرمجية (Modular, Class-based Architecture)، مما يضمن أداءً فائق السرعة وتجربة مستخدم سلسة دون الحاجة لإعادة تحميل الصفحات.

الميزات والقدرات التشغيلية والتقنية للمشروع

يتميز النظام بهندسة برمجية منظمة وفصل واضح للمهام لضمان الكفاءة وسهولة التطوير:

بنية التطبيق أحادي الصفحة (Modular SPA):

تم بناء النظام بالكامل كـ SPA لضمان عدم إعادة تحميل المتصفح أثناء التنقل بين الأقسام، مما يمنح المستخدم تجربة سريعة تشبه تطبيقات الهواتف الذكية أو تطبيقات سطح المكتب.

الاعتماد على الموديولات والفئات (Modules & Classes) يمنح الكود البرمجي تنظيماً احترافياً يسهل عملية الصيانة وإضافة ميزات جديدة مستقبلاً.

خدمة الاتصال الذكي بالبيانات (Custom ApiService):

يتضمن النظام فئة مخصصة (ApiService) تدير كافة عمليات إدارة البيانات الأساسية (CRUD Operations: إنشاء، قراءة، تحديث، وحذف بيانات الطلاب).

تعتمد هذه الخدمة على تقنية الاتصال الحديثة والمدمجة في المتصفح (fetch API) للتواصل الفوري مع خادم البيانات (json-server) دون الحاجة لمكتبات خارجية ثقيلة الوزن.

محرك واجهة المستخدم التفاعلي (UiService):

تم بناء فئة مخصصة وعزلها بالكامل لإدارة عناصر الواجهة (UiService)، وهي مسؤولة عن التحكم في ديناميكية الـ DOM وتحديث البيانات معالجة العناصر التفاعلية.

يدير هذا المحرك التنقل السلس بين التبويبات (Tabs)، بناء وتحديث جداول البيانات (Tables)، ونظام تقسيم الصفحات الذكي (Pagination) لضمان عرض مريح للبيانات الضخمة.

بيئة تطوير واختبار آمنة ومستقرة:

تم إعداد المشروع ليعمل من خلال خادم محلي (Local HTTP Server) متصل بخادم بيانات محاكي (json-server). تم ضبط هذه البيئة بعناية لتفادي وحل مشاكل مشاركة الموارد بين نطاقات مختلفة (CORS Issues) التي تواجه مطوري الويب عادةً أثناء التطوير.