منصة تعليمية

1) الهدف

إنشاء منصة تعليمية بسيطة:

صفحة رئيسية تحتوي على أقسام 4 أقسام أو أكثر (قابلة للزيادة).

عند الضغط على قسم ➜ تظهر الدورات التابعة له.

عند الضغط على دورة ➜ تظهر صفحة تفاصيل (شرح + سعر + زر شراء).

عند إتمام الدفع بنجاح ➜ تصبح الدورة متاحة داخل (اشتراكاتي / دوراتي).

يتم إرسال إيميل تأكيد للمستخدم بعد الشراء.

لا يوجد تحميل للدورة: المستخدم فقط يشاهد المحتوى من داخل المنصة.

2) الأدوار والصلاحيات

Guest (زائر): تصفح الأقسام والدورات فقط.

Student (مستخدم): تسجيل/دخول، شراء، مشاهدة الدورات التي اشتراها فقط.

Admin (مدير): إدارة الأقسام والدورات والدروس والمدفوعات والمستخدمين.

3) الصفحات المطلوبة (UI)

A) Home

شعار + تسجيل/دخول

عرض الأقسام كبطاقات (اسم + صورة/أيقونة + عدد الدورات)

(اختياري) أحدث الدورات

B) Category Page

عنوان القسم

قائمة الدورات (Card: عنوان + وصف قصير + سعر + تفاصيل)

C) Course Details

عنوان + وصف + ماذا سيتعلم + عدد الدروس + مدة تقريبية

السعر + زر شراء الآن

إذا المستخدم اشترى: يظهر زر اذهب للدروس

إذا غير مسجل: توجيه إلى تسجيل/دخول

D) Checkout

بيانات المستخدم + اختيار بوابة الدفع

عند نجاح الدفع: إنشاء اشتراك + تحويل لـ “اشتراكاتي” + إرسال إيميل

E) My Subscriptions (اشتراكاتي)

قائمة الدورات المشتراة

زر دخول لكل دورة

F) Course Player

قائمة الدروس على الجانب (Sidebar)

مشغل فيديو/محتوى

التالي/السابق

تتبع تقدم المشاهدة

G) Admin Dashboard

CRUD للأقسام

CRUD للدورات

CRUD للدروس (ترتيب، عنوان، فيديو)

إدارة الطلبات والمدفوعات

إدارة المستخدمين

تقارير بسيطة (اختياري)

4) رحلة المستخدم (Flow)

Home ➜ يضغط قسم

تظهر الدورات ➜ يضغط دورة

تفاصيل الدورة ➜ شراء

تسجيل/دخول (إن لزم)

Checkout ➜ دفع

نجاح الدفع ➜ إضافة الدورة لـ “اشتراكاتي” + إرسال إيميل

المستخدم يدخل “اشتراكاتي” ➜ يشاهد الدروس داخل المنصة

5) الدفع (Payments)

بوابة دفع مقترحة:

عالمي: Stripe

بدائل حسب البلد: PayTabs / Tap / HyperPay (حسب توافرها)

لازم استخدام Webhooks للتحقق النهائي من نجاح الدفع.

لا يتم تفعيل الاشتراك بمجرد رجوع المستخدم للصفحة؛ فقط بعد webhook: payment_succeeded.

6) حماية المحتوى ومنع التحميل (قدر الإمكان)

ملاحظة: لا يوجد منع 100% (يمكن تسجيل الشاشة)، لكن مطلوب حماية قوية تمنع التحميل المباشر.

المطلوب تنفيذه:

تشغيل الفيديو بصيغة HLS Streaming وليس MP4 مباشر.

استخدام Signed URLs / Tokenized playback:

رابط تشغيل ينتهي خلال دقائق.

لا يعمل إذا تم نسخه لحساب آخر.

عدم كشف روابط الملفات الأصلية للمستخدم.

API لا تُرجع أي رابط تشغيل إلا بعد:

user logged in

لديه Enrollment للدورة

(مستحسن) Watermark ديناميكي داخل المشغل:

يظهر email أو userId بشكل شفاف ومتحرك.

حماية الجلسات:

منع مشاركة الرابط بين المستخدمين (token مرتبط بالجلسة/المستخدم).

خيار إضافي قوي (اختياري حسب الميزانية):

DRM (Widevine/FairPlay/PlayReady) عبر Mux/Bitmovin/AWS.

7) الأمان (Security Requirements)

كلمات مرور: bcrypt/argon2

Auth:

JWT + Refresh أو Cookie HttpOnly

Email verification + Password reset

RBAC لصلاحيات Admin/Student

Rate limiting على login و reset

HTTPS فقط

Headers أمان (CSP, HSTS, X-Frame-Options…)

Audit log للأحداث الحساسة (شراء، دخول، تعديل أسعار)

8) قاعدة البيانات (Models)

users: id, name, email, password_hash, role, email_verified, created_at

categories: id, name, slug, image

courses: id, category_id, title, slug, description, price, thumbnail, published

lessons: id, course_id, title, order, video_asset_id, duration

orders: id, user_id, course_id, amount, currency, status, provider, provider_txn_id

enrollments: id, user_id, course_id, order_id, active, start_at

progress: id, user_id, lesson_id, watched_seconds, completed

9) الإيميلات المطلوبة

تأكيد البريد عند التسجيل

تأكيد شراء الدورة + تفاصيل الوصول

استرجاع كلمة المرور

خدمة إرسال: SendGrid / Mailgun / AWS SES

10) التقنية المقترحة (Language/Stack)

مفضل وسريع وقابل للتوسع:

Frontend: Next.js + TypeScript

Backend: NestJS (Node.js) أو Next.js API

Database: PostgreSQL + Prisma

Payments: Stripe + Webhooks

Video: Mux (أسهل) أو AWS (S3 + CloudFront + MediaConvert)

Hosting: Vercel للواجهة + سيرفر للبك-إند + Cloudflare/WAF

(بدائل ممكنة حسب خبرة الفريق: Laravel أو Django)

11) التسليم المطلوب (Deliverables)

واجهة كاملة للصفحات المذكورة

لوحة Admin

نظام Auth + Email verify

نظام شراء + Webhooks

صفحة اشتراكاتي + صلاحيات الوصول

مشغل HLS + Signed URLs + حماية الوصول

تتبع تقدم المستخدم

توثيق تشغيل ونشر + ملف env + Backup DB

كود نظيف وقابل للتوسع والتطوير

تسليم الكود كاملا

المحافظه على الحقوق

الافضلية لمن لدية عمل مماثله ومطبقة على ارض الواقع وفعالة