انتقل إلى المحتوى الرئيسي

Trainer OS

منصة سطح مكتب تعمل دون إنترنت، تتيح للمدرّب تقديم برنامج تدريبي متعدد الأيام وإدارة الحضور والدرجات والواجبات والتقارير من جهاز واحد، مبنية بـ Next.js داخل Electron.

المسار المهني
التقنيات المستخدمة :

خاص

Trainer OS: لقطة الشاشة 1 من 3
1 / 3

نظرة عامة على المشروع

يتنقّل المدرّبون الذين يقدّمون برامج تدريبية متعددة الأيام عادةً بين العروض التقديمية وجداول البيانات وكشوف الحضور والمجلدات المشتركة، وغالباً في قاعات لا يُعتمد فيها على الإنترنت. يجمع Trainer OS تقديم التدريب وإدارته في مساحة عمل واحدة تعمل بالكامل على جهاز المدرّب، دون خادم ودون الحاجة إلى اتصال.
للنظام وجهان. وضع التدريب مخصّص للقاعة: وحدات مرتّبة حسب الأيام، ووضع عرض تقديمي مع أسئلة تفاعلية داخل القاعة، ومحاكاة تفاعلية تُفتح بملء الشاشة. ووضع الإدارة، المحمي برمز PIN، مخصّص لكل ما يحيط بالتدريب: المشاركون والحضور والدرجات والواجبات والمشاريع النهائية والتقارير.
بنيتُ النظام لصالح Besterra من البداية إلى النهاية كتطبيق سطح مكتب لنظام Windows: تطبيق Next.js 16 مدمج داخل Electron، مع Prisma فوق قاعدة بيانات SQLite محلية، وواجهة عربية بالكامل من اليمين إلى اليسار.

الميزات الرئيسية

  • وضع العرض التقديمي: شرائح تُدار من لوحة المفاتيح مع ملاحظات المدرّب وسيناريوهات ونقاشات وأسئلة اختيار من متعدد تُكشف إجاباتها وتُشرح داخل القاعة
  • محاكاة تفاعلية: ثماني محاكاة مُقيَّمة (التصيّد الاحتيالي، والروابط الخبيثة، والاستجابة للحوادث، وكشف البيانات الوصفية وغيرها)، لكلٍّ منها نافذة مستقلة بملء الشاشة، وتُحفظ نتائجها تلقائياً
  • إدارة المشاركين: ملفات شخصية وصور توثيقية، واستيراد جماعي من Excel أو CSV مع معاينة لكل صف وكشف للتكرار
  • الحضور والدرجات: حضور لكل يوم (حاضر، متأخر، غائب، بعذر)، وإدخال جماعي للدرجات، ولوحة متصدّرين
  • الواجبات والمشاريع النهائية: تسليم الملفات مع مسار مراجعة (قبول أو طلب تعديل) وملاحظات المدرّب
  • لوحة المعلومات: الحضور والدرجات والتقدّم في لمحة واحدة، مع التصفية حسب يوم التدريب
  • التقارير: المشاركون والحضور والدرجات والواجبات بصيغتي Excel وPDF عربي، أو الملفات الثمانية كاملة في ملف ZIP واحد
  • النسخ الاحتياطي والاستعادة: أرشفة البيانات والملفات بنقرة واحدة، مع لقطة أمان تُؤخذ قبل كل استعادة

أبرز الجوانب التقنية

  • Next.js داخل Electron: يعمل خادم Next.js المستقل كعملية فرعية محلية على 127.0.0.1 خلف شاشة تحميل، مع منع تشغيل أكثر من نسخة
  • مصمَّم للعمل دون إنترنت: تُحفظ كل البيانات في SQLite ومجلدات محلية داخل مجلد المستندات، فلا يعتمد شيء على الشبكة
  • مهام متدفّقة: عمليات التصدير والنسخ الاحتياطي الطويلة تعرض تقدّمها مباشرةً ويمكن إلغاؤها أثناء التنفيذ مع تنظيف الملفات الجزئية
  • تقارير PDF عربية: صفحات HTML من اليمين إلى اليسار تُحوَّل إلى PDF عبر متصفح Edge أو Chrome المثبّت باستخدام puppeteer-core، مع تشغيل المتصفح مرة واحدة لكل عملية تصدير
  • طبقة بيانات مرنة: إعادة محاولة بتأخير متزايد عند أقفال SQLite المؤقتة، وتهيئة بيانات آمنة للتكرار، وسجلات منفصلة لكل جزء من النظام
  • غلاف سطح مكتب مُحصَّن: عزل السياق، وجسر preload محدود، وحماية من تجاوز المسارات عند الوصول إلى الملفات، ورمز PIN مُجزّأ بـ scrypt

مساهماتي

  • صمّمتُ المنتج وبنيتُه بالكامل، من الواجهة إلى تغليفه بـ Electron وبرنامج التثبيت لنظام Windows
  • صمّمتُ نموذج البيانات بـ Prisma: الدورات والوحدات والمشاركون والحضور والدرجات والتسليمات ونتائج المحاكاة
  • بنيتُ محرّك العروض التقديمية والمحاكاة التفاعلية الثماني
  • نفّذتُ مسار الاستيراد من Excel وCSV مع التحقق والمعاينة وكشف التكرار
  • بنيتُ محرّك التقارير (ExcelJS وPDF العربي) ونظام المهام المتدفّقة القابلة للإلغاء للتصدير والنسخ الاحتياطي
  • أضفتُ أدوات تشخيص واختباراً ذاتياً يتحقق من التخزين وقاعدة البيانات وإنشاء ملفات PDF

التحديات والحلول

التحدي: يحتاج تطبيق Next.js عادةً إلى خادم، بينما يجري التدريب غالباً في قاعات ضعيفة الاتصال أو بلا إنترنت.
الحل: تضمين خادم Next.js المستقل داخل Electron مقيّداً بالجهاز المحلي، مع حفظ SQLite وكل الملفات المرفوعة في مجلد المستندات لدى المستخدم.
النتيجة: تُثبَّت المنصة كاملةً كتطبيق Windows عادي وتعمل بالكامل دون إنترنت.
التحدي: قد يستغرق تصدير ثمانية تقارير، منها ملفات PDF عربية، وقتاً يكفي لتبدو الواجهة متوقفة.
الحل: بروتوكول مهام متدفّقة يعرض التقدّم مباشرةً ويدعم الإلغاء الفعلي، ويشغّل متصفح PDF مرة واحدة فقط للحزمة كلها.
النتيجة: يرى المدرّب التقدّم ملفاً بملف، ويمكنه الإلغاء بأمان، ويحصل على ملفات Excel حتى إن تعذّر إنشاء ملفات PDF.

التقنيات المستخدمة

Frontend: Next.js 16، React 19، TypeScript، Tailwind CSS 4، shadcn/ui (Radix UI)، Framer Motion، TanStack Table، React Hook Form، Zod
سطح المكتب: Electron 42، electron-builder (برنامج تثبيت Windows)
قاعدة البيانات: SQLite مع Prisma 6
الأدوات: ExcelJS، puppeteer-core، archiver، pnpm، ESLint

تحتاج شيئاً مشابهاً؟أخبرني عن مشروعك