🎓 نظام إدارة المركز التعليمي

منصة شاملة لإدارة المراكز التعليمية مع لوحات تحكم متعددة للإدارة والأساتذة

المميزات • التثبيت • الاستخدام • البنية • المساهمة

---

📋 نظرة عامة

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

✨ المميزات

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

• ✅ لوحة تحكم الإدارة الشاملة - إدارة كاملة لجميع جوانب المركز
• 👨‍🏫 لوحة تحكم الأساتذة - إدارة الملف الشخصي والإعلانات
• 📚 إدارة الدورات - نظام كامل لإدارة الدورات التدريبية
• 👥 إدارة الأساتذة - إضافة وتعديل بيانات الأساتذة
• 📢 نظام الإعلانات - نشر وإدارة الإعلانات بأولويات مختلفة
• 📝 المدونة - نظام كامل للمقالات مع إحصائيات التفاعل
• 📊 إحصائيات تفصيلية - تقارير شاملة عن الأداء
• 🌐 متعدد اللغات - دعم اللغة العربية والإنجليزية
• 🎨 واجهة عصرية - تصميم احترافي باستخدام Shadcn/UI
• 🌙 الوضع الليلي - دعم كامل للوضع الداكن

🔐 نظام الصلاحيات

• الإدارة (Admin): صلاحيات كاملة لإدارة النظام
• الأساتذة (Teachers): إدارة الملف الشخصي والإعلانات

📦 إدارة المحتوى

• الدورات: إضافة، تعديل، حذف، وتتبع التسجيلات
• الإعلانات: أولويات متعددة (منخفضة، متوسطة، عالية، عاجل)
• المدونة: مقالات بتصنيفات متعددة مع إحصائيات المشاهدات
• معرض الصور: رفع وإدارة الصور والفيديوهات

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

Frontend Stack

{
  "framework": "React 18.3.1",
  "language": "TypeScript 5.6.2",
  "build-tool": "Vite 5.4.2",
  "styling": "Tailwind CSS 3.4.1",
  "ui-library": "Shadcn/UI",
  "routing": "React Router DOM 6.26.0",
  "icons": "Lucide React 0.441.0"
}

Backend & Services

{
  "database": "Supabase",
  "storage": "Supabase Storage",
  "authentication": "Custom Auth System"
}

Additional Libraries

• @supabase/supabase-js: ^2.45.4 - تكامل قاعدة البيانات
• react-hot-toast: ^2.4.1 - إشعارات المستخدم
• clsx: ^2.1.1 - إدارة الـ CSS classes
• tailwind-merge: ^2.5.2 - دمج Tailwind classes

📦 التثبيت

المتطلبات الأساسية

تأكد من تثبيت البرامج التالية:

• Node.js: >= 18.0.0
• pnpm: >= 8.0.0 (مُفضل) أو npm/yarn

خطوات التثبيت

1. استنساخ المشروع

git clone https://github.com/your-username/centre-ui.git
cd centre-ui/shadcn-ui

2. تثبيت التبعيات

pnpm install
# أو
npm install

3. إعداد متغيرات البيئة

أنشئ ملف .env في المجلد الرئيسي:

VITE_SUPABASE_URL=your_supabase_url
VITE_SUPABASE_ANON_KEY=your_supabase_anon_key

4. إعداد قاعدة البيانات

قم بتنفيذ السكريبت SQL المرفق في مجلد database/:

# نفذ الملفات بالترتيب
1. schema.sql       # الجداول الأساسية
2. policies.sql     # سياسات الأمان
3. seed.sql         # البيانات التجريبية (اختياري)

5. تشغيل المشروع

pnpm run dev

سيعمل المشروع على: http://localhost:5173

🚀 الاستخدام

تسجيل الدخول

حسابات تجريبية:

لوحة الإدارة:

• المستخدم: admin
• كلمة المرور: admin123
• الرابط: /secret-admin-login-2025

لوحة الأساتذة:

• المستخدم: teacher
• كلمة المرور: teacher123
• الرابط: /secure-teacher-login-2025

الأوامر المتاحة

# تشغيل المشروع في وضع التطوير
pnpm run dev

# بناء المشروع للإنتاج
pnpm run build

# معاينة النسخة النهائية
pnpm run preview

# فحص الأخطاء
pnpm run lint

# تنسيق الكود
pnpm run format

📁 بنية المشروع

shadcn-ui/
├── public/              # الملفات العامة
├── src/
│   ├── components/      # مكونات React
│   │   ├── ui/         # مكونات Shadcn/UI
│   │   ├── admin/      # مكونات خاصة بالإدارة
│   │   └── teacher/    # مكونات خاصة بالأساتذة
│   ├── context/        # React Context
│   │   ├── AuthContext.tsx
│   │   └── LanguageContext.tsx
│   ├── hooks/          # Custom Hooks
│   ├── lib/            # المكتبات والأدوات
│   │   └── supabase.ts
│   ├── pages/          # صفحات التطبيق
│   │   ├── admin/      # صفحات لوحة الإدارة
│   │   ├── teacher/    # صفحات لوحة الأساتذة
│   │   └── public/     # الصفحات العامة
│   ├── services/       # خدمات API
│   │   ├── coursesService.ts
│   │   ├── teachersService.ts
│   │   ├── announcementsService.ts
│   │   ├── blogService.ts
│   │   └── uploadService.ts
│   ├── types/          # TypeScript Types
│   │   └── index.ts
│   ├── App.tsx         # المكون الرئيسي
│   ├── main.tsx        # نقطة الدخول
│   └── index.css       # الأنماط العامة
├── database/           # سكريبتات قاعدة البيانات
├── .env.example        # مثال لمتغيرات البيئة
├── package.json
├── tsconfig.json
├── vite.config.ts
└── tailwind.config.js

🗄️ قاعدة البيانات

الجداول الرئيسية

الجدول	الوصف
teachers	بيانات الأساتذة
courses	الدورات التدريبية
announcements	الإعلانات
blog_posts	مقالات المدونة
gallery	معرض الصور والفيديوهات

Row Level Security (RLS)

تم تفعيل سياسات الأمان على جميع الجداول لضمان:

• حماية البيانات الحساسة
• التحكم في الصلاحيات
• منع الوصول غير المصرح به

🎨 التخصيص

تغيير الألوان

عدّل ملف tailwind.config.js:

theme: {
  extend: {
    colors: {
      primary: 'your-color',
      secondary: 'your-color',
      // ...
    }
  }
}

إضافة مكونات Shadcn/UI

npx shadcn-ui@latest add button
# أو أي مكون آخر

📊 الميزات القادمة

• نظام الدفع الإلكتروني
• تطبيق الموبايل
• نظام الرسائل الفورية
• تقارير متقدمة مع تصدير PDF
• API عامة للمطورين
• دعم لغات إضافية

🤝 المساهمة

المساهمات مرحب بها! يرجى اتباع الخطوات التالية:

1. Fork المشروع
2. إنشاء فرع جديد (git checkout -b feature/AmazingFeature)
3. Commit التغييرات (git commit -m 'Add some AmazingFeature')
4. Push للفرع (git push origin feature/AmazingFeature)
5. فتح Pull Request

معايير الكود

• استخدم TypeScript بشكل صارم
• اتبع ESLint rules
• اكتب تعليقات واضحة بالعربية
• اختبر الكود قبل الـ Push

🐛 الإبلاغ عن مشاكل

إذا وجدت أي مشكلة، يرجى:

1. التحقق من Issues الحالية
2. إنشاء Issue جديد مع:
   • وصف تفصيلي للمشكلة
   • خطوات إعادة الإنتاج
   • لقطات شاشة (إن أمكن)

📄 الترخيص

هذا المشروع مرخص تحت رخصة MIT - انظر ملف LICENSE للتفاصيل.

👥 الفريق

• المطور الرئيسي: [اسمك]
• المصمم: [اسم المصمم]
• المساهمون: [قائمة المساهمين]

📞 التواصل

• البريد الإلكتروني: your-email@example.com
• الموقع: https://your-website.com
• GitHub: @your-username

---

صُنع بـ ❤️ في الجزائر

⭐ إذا أعجبك المشروع، لا تنسَ إعطائه نجمة! ⭐