E-Learn Pro - Modern Learning Platform

? منصة تعليم إلكتروني احترافية – E-Learn Pro

منصة تعليمية حديثة ومتطورة مبنية باستخدام React

مشروع E-Learn Pro هو منصة تعليم إلكتروني (E-Learning Platform) احترافية ومتكاملة، تم تصميمها وتطويرها باستخدام أحدث تقنيات الويب لتقديم تجربة تعليم سلسة لكلٍّ من الطلاب والمدرّسين، مع لوحة تحكم كاملة للمشرفين والقدرة على إدارة الدروس ومتابعة تقدم الطلاب بسهولة.

✨ مميزات المنصة

? المميزات الأساسية

تسجيل الدخول وإنشاء حساب (تسجيل آمن وسهل)

إدارة الدورات التعليمية (عرض – تسجيل – متابعة التقدم)

لوحة إدارة كاملة للمشرف مع صلاحيات كاملة (CRUD)

نظام تتبع التقدم للطلاب مع عرض نسبة الإنجاز

تصميم متجاوب بالكامل لجميع الأجهزة (موبايل – تابلت – كمبيوتر)

? مميزات متقدمة

فيديوهات داخل الدروس مع تتبع المشاهدة

لوحة تحكم تفاعلية للطالب مع تحليلات شخصية

صلاحيات متعددة (طالب – مدير)

تحديثات فورية لحالة تقدم الدروس

واجهة مستخدم حديثة جداً مع أنيميشن احترافي

?️ التقنية المستخدمة (Tech Stack)

الواجهة الأمامية (Frontend)

React 18

Vite

Tailwind CSS v4

React Router

Framer Motion

Lucide Icons

Axios

البيانات والباك إند (Backend)

JSON Server كـ API تجريبي

LocalStorage لحفظ الجلسات والتقدم

? هيكل المشروع (Project Structure)

يحتوي المشروع على:

صفحات رئيسية (Home – Courses – Dashboard – Login – Register – Admin Panel … وغيرها)

مكوّنات قابلة لإعادة الاستخدام (Navbar – Course Card – Progress Bar …)

نظام سياق (Context API) لإدارة المستخدم والدورات

قاعدة بيانات JSON Server جاهزة (db.json)

? صفحات المنصة

الصفحة الرئيسية: عرض مميزات المنصة والدورات المميزة

صفحة الدورات: عرض كل الكورسات مع البحث والتصفية

صفحة تفاصيل الدورة: مشاهدة الدروس – فيديو – تقدم – تسجيل

لوحة الطالب: تحليلات – متابعة الدروس – نسبة التقدم

لوحة الإدارة: إدارة الدروس – إضافة – تعديل – حذف

صفحات معلومات (من نحن، تواصل معنا، سياسة الخصوصية)

? التصميم والواجهة

تصميم حديث باحترافية عالية

متجاوب 100%

استخدام Tailwind CSS لضمان سرعة التطوير

أنيميشن سلس باستخدام Framer Motion

تجربة استخدام مثالية UX / UI