رأيت في الفترة السابقة منشوراً على شبكة لينكدإن لأخت تتحدث عن محاولة تعليمها لأحد الناطقين بالإنجليزية مصطلحات مرتبطة بالقرآن الكريم، وأردت شخصياً البحث عن هذه المصطلحات باللغة الإنجليزية (مثل قواعد الوقف والمدّ والتجويد عموماً) وقد وجدت عدداً من المصادر المفيدة في هذا السياق لكن لم يكن هناك مصدرٌ سهل التصفح فيه أمثلة واضحة وشرح وافٍ عن كلّ المصطلحات الضرورية.
هذا ما شجعني على العمل على مشروع بسيط تقنياً ولكنه ذو فائدة كبيرة، يتيح هذه البيانات بواجهة سهلة الاستخدام، وبدون تكاليف تشغيل إطلاقاً.
فكرة المشروع ومعماريته
الهدف الأساسي كان بناء تطبيق ويب (Web App) سريع، لا يتطلب تكلفةً للتشغيل إطلاقاً، وسهل الصيانة. لذا اعتمدت في بناء هذا المشروع على الأدوات التالية:
قاعدة البيانات:
بدلاً من تعقيدات SQL أو NoSQL، اعتمدت على Google Sheets. نعم، جدول بيانات بسيط يتم مشاركته على الانترنت بصيغة CSV من خلال ميزة النشر على الويب من Google Sheets مع دالة بسيطة بجافاسكريبت لتحميل هذا الملف ومعالجته محلياً واعتماده كقاعدة بيانات للصفحة.
هذا يجعل عملية إضافة أو تعديل المصطلحات سهلة جداً لأي شخص غير تقني يريد المساهمة في المحتوى، وبهذا أيضاً ننتهي من الحاجة لبناء لوحة تحكم معقدة مع نظام صلاحيات للوصول إلى قاعدة البيانات وتعديلها، يمكن ببساطة استخدام نظام صلاحيات الوصول إلى ملف الSheet مباشرة للسماح للناس الوصول والتحرير.
طبعاً لهذا محدوديات، إذ أنّ قاعدة البيانات ستكون مفتوحة للقراءة للجميع، لذا لا يمكن استخدامها لتخزين أيّ بيانات حساسة، لكن في حال مشروعنا هذا لم يكن هناك داعٍ لإخفاء البيانات من الأساس.
الاستضافة:
تم إطلاق المشروع عبر GitHub Pages، مما يعني استضافة مجانية، سريعة، وآمنة (HTTPS).
الواجهة:
تطبيق صفحة واحدة (SPA) مبني بلغة JavaScript (Vanilla) مع Tailwind CSS، مما يجعله خفيفاً جداً وسريع التحميل. اعتمدت على عناصر Shadcn في تصميم الواجهة للحصول على نتيجة مرضية بسرعة
دور الذكاء الاصطناعي في تنظيم البيانات
التحدي الأكبر كان في جمع البيانات الخام وتنظيفها. قمت بتجميع قوائم للمصطلحات من عدة مواقع مثل Koran.Center وموقع islamicstudies.info واعتمدت أيضاً على بيانات موجودة في مستودع أحد المشاريع التي تصفحتها مؤخراً والتي احتوت معلومات عن قواعد التجويد أيضاً QuranWBW. ولكن المشكلة في هذه البيانات أنها لم تكن مهيكلة بصيغة واحدة وكانت تفاصيلها مختلفة، لذا أردت أولاً جمعها وتنظيمها في جدول واحد، ثم تدقيقها والزيادة عليها يدوياً.
هنا جاء دور الذكاء الاصطناعي، حيث نسخت هذه البيانات كما هي وطلبت منه تحويلها إلى جداول مهيكلة (CSV) بأعمدة محددة. النقطة الجوهرية هنا هي ضبط الأمر بشكل يمنع الهلوسة قدر الإمكان، فقد كان الشرط هو: "قم بالتصنيف والتنظيم فقط، يمنع منعاً باتاً إضافة أي معلومة أو شرح من عندك". وذلك لتفادي أي تحريف للمعاني الشرعية أو اللغوية، فالدقة هنا مهمة جداً - وبالطبع يجب تدقيق البيانات بعد معالجتها بالذكاء الاصطناعي.
الصور التوضيحية وموقع EveryAyah
بعض المصطلحات، وخاصة قواعد الوقف والرموز في المصحف، تحتاج إلى أمثلة بصرية من صفحات المصحف ليفهمها المستخدم. اعتمدت على مشروع EveryAyah هذا الموقع يوفر روابط ثابتة (Permalinks) لصور الآيات بدقة عالية، مما مكنني من جلب صورة الآية المطلوبة كشاهد أو مثال وعرضها مباشرة داخل الموقع من خلال إدراج هذا الرابط في الجدول واستخدامه في الواجهة مباشرة.
أبرز مميزات الموقع
على الرغم من بساطة البنية التحتية، يوفر التطبيق تجربة مستخدم متقدمة:
بحث ذكي يدعم العربية:
محرك البحث الداخلي مبرمج لتجاهل التشكيل، وتوحيد أشكال الهمزات والتاء المربوطة (Normalization)، مما يجعل البحث عن كلمة مثل "الآخرة" يعطي نتائج سواء كتبتها "الاخرة" أو "الآخرة".
دعم العمل دون اتصال (Offline Support):
إذا انقطع الإنترنت، التطبيق يحاول إعادة الاتصال تلقائياً (Exponential backoff)، ويعتمد على التخزين المؤقت (LocalStorage) لعرض البيانات التي تم تحميلها سابقاً.
تجربة بصرية مريحة:
يدعم الوضع الليلي (Dark Mode) وتغيير طريقة العرض بين شبكة (Grid) أو جدول (Table).
المشاركة:
عند البحث أو الفلترة، يتم تحديث رابط URL، مما يسمح لك بنسخ الرابط وإرساله لصديق ليفتح له التطبيق مباشرة على النتيجة التي تريدها.
روابط المشروع
يمكنكم تجربة التطبيق أو الاطلاع على الكود المصدري والمساهمة في تطويره:
بالطبع، مازالت البيانات تحتاج لتنقيح وما زلت أعمل على إضافة صور لكل العناصر، وقررت أيضاً إضافة شرحاً عربياً للمصطلحات، بحيث تكون التجربة شاملة للغتين، بهذا يكون النفع منها أكبر إن شاء الله.
أسعد جداً لو قرر أحد المساهمة في هذا المشروع سواء من ناحية المقترحات للميزات أو المساهمة في تدقيق المحتوى أو تنقيحه أو الإضافة عليه، خصوصاً في سياق الصور والأمثلة.
