مشروع "FailSafe Lab" ليس مجرد تطبيق محاكاة عادي، بل هو منصة تعليمية متكاملة (EdTech App) تعكس هندسة برمجية متطورة. الهيكلة الفعلية للكود تُظهر احترافية عالية في بناء تطبيقات الويب المعقدة التي تتطلب تفاعلاً لحظياً، أماناً عالياً، وصلاحيات متعددة.
وصف المشروع :
1. معمارية النظام والتقنيات (System Architecture)
تطوير الواجهات (Frontend): تم بناء التطبيق كـ (Single Page Application) باستخدام React 19 و Vite لتحقيق أقصى سرعة في البناء والتشغيل.
النوعية الصارمة (Strict Typing): اعتماد كامل على TypeScript لضمان استقرار المنطق الفيزيائي والرياضي المعقد وتقليل الأخطاء البرمجية إلى الصفر تقريباً.
البنية التحتية وقواعد البيانات (Backend/BaaS): تكامل عميق مع Supabase لإدارة المستخدمين (Authentication)، حفظ بيانات الامتحانات، وتأمين البيانات عبر سياسات (Row Level Security) محكمة مبرمجة برمجياً في ملفات SQL.
2. الوحدات البرمجية الأساسية (Core Modules)
التطبيق مقسم باحترافية إلى ميزات (Features) مستقلة لتسهيل الصيانة والتطوير:
وحدة التجارب الفيزيائية التفاعلية (Physics Engine):
تتضمن أربع بيئات معزولة مبرمجة كـ Components مستقلة تدير حساباتها وحالتها (State) الخاصة:
قانون أوم (Ohm's Law)
قانون هوك (Hooke's Law)
تجارب اللزوجة (Viscosity)
قنطرة ويتستون (Wheatstone Bridge)
نظام المراقبة والامتحانات (Proctoring & Exam System):
نظام تقييم متقدم يتضمن وحدة مراقبة عبر الكاميرا (CameraProctor) مرتبطة بقاعدة بيانات لتسجيل التنبيهات والأحداث اللحظية (proctor_alerts)، مما يضمن نزاهة بيئة الاختبارات.
نظام إدارة الصلاحيات متعدد المستويات (Multi-Role Access Control):
نظام توجيه (Routing) آمن يحمي الصفحات بناءً على دور المستخدم:
لوحة الطالب (Student): بيئة مخصصة لأداء التجارب والاختبارات المراقبة.
لوحة المعلم (Instructor): واجهة متقدمة لإنشاء الامتحانات (CreateExamPage) ومراجعة تقارير الطلاب ونتائج المراقبة (StudentResultsPage).
لوحة الإدارة (Admin): للتحكم الشامل في النظام وحسابات المستخدمين.
3. هندسة واجهة المستخدم (UI/UX & Styling Architecture)
بدلاً من الاعتماد على مكتبات التنسيق الجاهزة، تم بناء النظام البصري من الصفر لتوفير واجهة مخصصة (Custom UI). تم استخدام هندسة CSS معيارية تعتمد على متغيرات شاملة (CSS Variables) وملفات تنسيق مقسمة بذكاء (core, components, features, pages). هذا يضمن أداءً فائقاً للتطبيق (بدون أي ملفات زائدة) وتجربة مستخدم (UX) متجاوبة وسينمائية تناسب تركيز الطلاب.
4. التجهيز والجاهزية للإنتاج (Production Readiness)
المشروع مجهز بالكامل للتشغيل الفعلي على بيئات الاستضافة المتقدمة مثل Vercel (عبر إعدادات vercel.json)، بالإضافة إلى تضمين ملفات تهيئة محركات البحث (robots.txt, sitemap.xml) لتسهيل أرشفة المنصة إن لزم الأمر.
