منصة ZDF – نظام متكامل لحجز الفعاليات وورش العمل
منصة احترافية متكاملة لإدارة الفعاليات وورش العمل، تم تطويرها باستخدام أحدث التقنيات مثل Next.js, Tailwind CSS, Redux, Swiper.js, Framer Motion, Socket.io, Express.js, و MongoDB.
تتكون المنصة من موقع للجمهور، و لوحة تحكم إدارية، و خادم API كامل — وجميعها من تطويري بالكامل.
روابط الريبو:
Back-End: https://github.com/AbdElm...
Dashboard: https://github.com/AbdElm...
Front-End: https://github.com/AbdElm...
⭐ نظرة عامة على المشروع
تم تصميم منصة ZDF لتكون نظامًا شاملاً لإدارة الفعاليات، الورش، الحضور، التذاكر، والمدفوعات.
تدعم المنصة تتبع الحضور في الوقت الحقيقي، تسجيل الدخول عبر Google OAuth، وإصدار التذاكر عبر QR Code، مع لوحة تحكم قوية لمتابعة كل شيء لحظة بلحظة.
أهم المميزات
1. استعراض الفعاليات وورش العمل
واجهة تفاعلية لاستكشاف الفعاليات القادمة وورش العمل.
صفحات ديناميكية مع سلايدر باستخدام Swiper.js.
تأثيرات وحركات احترافية بـ Framer Motion.
إمكانية البحث والتصفية حسب التاريخ أو النوع أو السعة.
2. حجز التذاكر والدفع الإلكتروني
يمكن للمستخدم حجز تذاكر الفعالية أو الورشة بسهولة.
دمج بوابة دفع إلكتروني لإتمام العملية بأمان.
إنشاء تذكرة رقمية مباشرة بعد الدفع وظهورها في حساب المستخدم.
3. تسجيل دخول آمن
تسجيل سريع باستخدام Google OAuth 2.0.
حماية APIs باستخدام JWT.
نظام صلاحيات (مستخدم – مسؤول).
4. إدارة الحضور عبر QR Code + التحديث اللحظي
كل تذكرة تحتوي على QR Code فريد.
يقوم المسؤولون بمسح الكود عند الدخول.
تحديث حالة الحضور يتم في نفس اللحظة بفضل Socket.io.
تحديث مباشر:
عدد الحضور
سعة الورش المتبقية
سجلات Check-in
5. لوحة تحكم إدارية متقدمة
لوحة تحكم تم بناؤها باستخدام React + Redux.
إحصائيات شاملة للفعاليات والحجوزات.
تحديثات حية Real-Time للحضور باستخدام WebSockets.
إدارة كاملة:
الفعاليات
الورش
المستخدمين
التذاكر
المدفوعات
عرض تحليلات حول المبيعات وعدد الزوار.
6. خادم خلفي كامل (Express.js + MongoDB)
APIs لكل العمليات (حجوزات – ورش – مستخدمين – مدفوعات).
تصميم MVC منظم.
حماية JWT + نظام أذونات متقدم.
خادم Socket.io للبث المباشر للبيانات.
7. واجهة مستخدم حديثة باستخدام Next.js
تصميم متجاوب بالكامل باستخدام Tailwind CSS.
SEO عالي الأداء وسرعة تحميل كبيرة.
حركات انتقال انسيابية باستخدام Framer Motion.
لوحة مستخدم لإدارة التذاكر والحجوزات.
? التقنيات المستخدمة
الواجهة الأمامية
Next.js
Tailwind CSS
Redux Toolkit
Swiper.js
Framer Motion
الخلفية (Back-End)
Express.js
MongoDB
JWT
Google OAuth
Socket.io
لوحة التحكم
React.js
Redux
Tailwind CSS
Socket.io-client
القيمة التي يقدمها النظام
أتمتة كاملة للحجوزات.
إدارة احترافية للحضور عبر QR Code.
متابعة مباشرة للفعاليات والتذاكر.
واجهة سهلة الاستخدام ومنظمة.
بنية خلفية قوية قابلة للتوسع.