في هذا الموضوع أشارككم تجربة عملية لفكرة اقترحتها لحل أحد أوجه القصور الموجودة في معظم التطبيقات القرآنية الحالية، وهي غياب التفاعل المباشر بين المعلم والطلاب، إذ يتعلم الطالب بشكل مستقل عن المعلم.
وبما أن التفاعل المشترك مفيد في الجانب التعليمي فكرت لم لا أوفر تطبيق لقرآن متزامن SyncQuran يحقق هذه الفكرة ويحاكي الحلقة القرآنية التقليدية، بحيث يتابع الطلاب تفاعل المعلم مع الأستاذ لحظة بلحظة.
ملاحظة: المشروع الذي وفرته تجريبي مبدئي يهدف لإثبات إمكانية تطبيق فكرة المزامنة proof of concept
الفكرة العامة للقرآن المتزامن SyncQuran
يعتمد التطبيق على مبدأ بسيط: كل ما يفعله المعلم على شاشته يظهر فورًا على شاشات الطلاب.
فعندما يفتح المعلم سورة أو صفحة، أو يحدد آية، أو يشغّل تلاوة صوتية أو يوقفها، يرسل الحدث مباشرة إلى جميع الأجهزة المتصلة.
بفضل هذا التزامن اللحظي، يشعر الجميع وكأنهم يجلسون في مجلس واحد، ترسل حالة الصفحة فورًا إلى الطلاب، ويمكن للمعلم أيضًا التواصل عبر المحادثة المدمجة في التطبيق.
طريقة استخدام التطبيق

- يدخل المعلم لرابط التطبيق من المتصفح وينشئ غرفة تعليمية افتراضية ويحصل على اسم ورمز فريد للغرفة.
- يدخل الطلاب لنفس الرابط كل من متصفحه، ويدخلون بيانات الغرفة التي شاركها المعلم معهم.
- الآن كل تفاعل سيقوم به المعلم في نافذته (فتح سورة، تحديد آية، تشغيل صوت، تعليق) سيُرسل فورًا لجميع الطلاب.
- يحدث التزامن بزمن شبه لحظي ويمكن للطلاب متابعة ما يقوم به المعلم في الوقت الحقيقي وكأن الجميع يتابعون في مصحف واحد متزامن.
البنية التقنية للمشروع
يعتمد المشروع التقنيات الأساسية التالية:
WebRTC
تعد WebRTC حجر الأساس في الاتصال اللحظي بين الأجهزة. توفر هذه التقنية قناة peer-to-peer مباشرة بين المعلم والطلاب دون خادم وسطي دائم، مما يجعل الاتصال أسرع ولا يترك حملاً حقيقياً على الخادم الوسيط الذي يربط بين هذه الأجهزة - لذا يمكننا استخدام موفّرات مجّانية لهذا النوع من الخوادم أو استضافة واحدٍ بأنفسنا بتكلفة لا تذكر.
وتستخدم قنوات البيانات Data Channels ضمن WebRTC لإرسال الأحداث الفورية (فتح سورة، تظليل آية، تشغيل صوت، تعليق… إلخ).
PeerJS
تبسّط مكتبة PeerJS إنشاء الاتصال عبر WebRTC، وتسهل تبادل معلومات الاتصال الأولية signaling، وهي لا تخزن أي بيانات للمحتوى، بل تمرر فقط معرّفات الاتصال بين الأطراف.
عند إنشاء جلسة:
const peer = new Peer();
عند انضمام الطالب:
const conn = peer.connect(teacherId);
conn.on('open', () => console.log('Connected'));
لإرسال الأحداث:
conn.send({ type: 'highlight', ayah: 5 });
conn.on('data', handleEvent);
خوادم STUN
في المشروع استخدمت خوادم Google STUN الافتراضية، تؤدي هذه الخوادم دورًا مشابهًا لنظام أسماء النطاقات DNS ولكن في عالم الاتصالات اللحظية فهي تساعد الأجهزة على معرفة عناوين بعضها الحقيقية خلف جدران NAT أو شبكات محلية، مما يمكّن من الاتصال بين نطاقات مختلفة بسهولة. هذا ضروري في حالة أغلب المستخدمين، بسبب اختلاف نوع البنية التحتية والجهاز المستخدم وقواعد الشبكة وغيرها من التفاصيل التي لا يمكن حلّها كلّ واحدة على حدة من طرف المبرمج في هذا النوع من المشاريع.
Quran Cloud API
استخدمت الواجهة البرمجية التي توفرها منصة Al Quran Cloud مفتوحة المصدر للحصول على النص القرآني والتفسير والترجمة:
fetch(`https://api.qurancloud.com/surah/${surahNumber}`)
.then(res => res.json())
.then(displaySurah);
كما اعتمدت على خط أميري Amiri لعرض النصوص لضمان دعم عرض رموز الرسم العثماني وإظهار النص القرآني بالشكل الصحيح.
الكود البرمجي للتطبيق
وفرت كود المشروع على GitHub يمكنك تحميله وتشغيله محليًا عبر خادم محلي بإحدى الطرق التالية:
الطريقة الأولى: عبر Live Server في VS Code
- ثبّت إضافة Live Server.
- انقر برز الماوس الأيمن على الملف index.html ثم اختر Open with Live Server.
- سيفتح المتصفح على:
http://127.0.0.1:5500
الطريقة الثانية: عبر Python Server
- انتقل لمجلد المشروع ونفذ:
cd D:\SyncQuran-main
python -m http.server 8000
- ثم افتح:
http://127.0.0.1:8000
الطريقة الثالثة: مباشرة من GitHub Pages
تجد هنا رابط النسخة التجريبية للتجريب المباشر:
SyncQuran
التحديات الحالية
رغم نجاح النموذج التجريبي في إثبات جدوى الفكرة، ما زال المشروع يواجه بعض التحديات التي تحتاج لتحسين وأبرزها:
لا يوجد تخزين دائم للجلسات بعد الإغلاق.
الاعتماد على خادم PeerJS مجاني يحدّ من الاستقرار ويقيد التوسع لذا من الضروري إطلاق خادم شخصيّ وضبطه بطريقة مناسبة لهدف المشروع ولتسهيل الاتصال مستقبلاً.
واجهة المستخدم بحاجة إلى تحسين لتناسب حلقة تعليم القرآن.
ختامًا
تلك كانت خلاصة تجربتي في تطوير قرآن متزامن باستخدام تقنية WebRTC التي تمكنت من خلالها من تحقيق التفاعل المباشر بين المعلم والطلاب في الزمن الحقيقي.
لتعزيز هذه التجربة مستقبلًا، يمكن تطوير نسخة مخصصة للموبايل أو PWA للمعلمين والطلاب، وتوفير لوحة تحكم للمعلم لتوزيع المهام ومتابعة الأداء الجماعي بشكل أكثر كفاءة.وإضافة نظام لتسجيل الجلسات والملاحظات لمتابعة أداء الطلاب، ودعم الترجمة والتفسير التفاعلي أثناء التلاوة، وتحسين التزامن الصوتي.
إذا كنت مهتمًا بتجربة هذه التقنية ولديك أسئلة حولها أو أفكار تطويرية أخرى، شاركنا إياها في التعليقات أسفل الموضوع.