صفحة هبوط Ai Maestro Pro — CMS ودفع Fawaterak وجسر تسجيل تلقائي و Meta Conversions API
landingpage.aaahub.online
1 / 5
نبذة عن المشروع
صفحة مبيعات عالية التحويل لكورس «Ai Maestro Pro»، فيها CMS كامل من لوحة تحكم، وعدّاد تنازلي، و Checkout بالدفع الإلكتروني عبر Fawaterak. أول ما الدفع يتأكد، الصفحة بتكلّم منصة aaahub.online سيرفر لسيرفر عشان تعمل حساب للطالب وتسجّله في الكورس وترجّع له رابط دخول تلقائي — مع تتبّع إعلانات من المتصفح والسيرفر.
25نوع قسم في الـ CMS
3مسارات لتأكيد الدفع
5Service
36صفحة Blade
21مسار (Route)
التقنيات المستخدمة
Backend
PHP 8.3Laravel 13MySQL (existing Prisma tables kept intact)
Frontend
Blade (36 views19 page sections)hand-written CSS & JS
Payments & Tracking
Fawaterak (OAuthv3 transactionsHMAC webhooks)Meta PixelMeta Conversions APITikTok Pixel
Integrations
server-to-server LMS bridge with aaahub.onlineGoogle Drive video streamingWhatsApp
Previous version
Next.js 14React 18Prisma 6Tailwind 3
Hosting & DevOps
Hostingerframework outside the webrootpre-migration DB & file backups
الـ CMS وصفحة البيع
- المحتوى كله document واحد بـ 25 نوع قسم بيتعدّل من المحرر، بترتيب وإخفاء لكل قسم.
- دمج ذكي للمحتوى: الأقسام الجديدة مع أي إصدار بتتحط مكانها الصح وتعديلات الأدمن تفضل هي الغالبة، وأمر لإعادة ترتيب الأقسام بترتيب الـ Funnel.
- فيديو تعريفي، نتائج الطلاب، المنهج، «الكورس لمين»، الهدايا، الأسئلة الشائعة، وعدّاد تنازلي من الـ CMS.
الدفع والتسجيل التلقائي
- Checkout عبر Fawaterak (OAuth مع تخزين التوكن و createTransaction v3).
- Webhook بتوقيع HMAC-SHA256، و تأكيد ذاتي لو الـ webhook ما وصلش — صفحة النجاح بتسأل البوابة مباشرة بحد زمني.
- نقطة واحدة لتأكيد الطلب بيدخلها 3 مسارات: الـ webhook، والاستعلام، وزرار الأدمن.
- جسر المنصة: بعد الدفع بيتعمل الحساب والتسجيل على aaahub.online ويرجع رابط دخول لمرة واحدة يظهر للمشتري فورًا.
التتبّع الإعلاني
- Meta Conversions API من السيرفر بـ event_id مشترك مع البيكسل لمنع العد المزدوج، وبيانات العميل مشفّرة SHA-256، وتحويل الأرقام المصرية للصيغة الدولية.
- Meta و TikTok Pixels بتتضبط من اللوحة ومش بتشتغل في صفحات الأدمن.
مزايا تانية
- بروكسي فيديو Google Drive بيعرض الفيديو كـ <video> عادي مع دعم Range.
- وسائط مخزّنة في قاعدة البيانات بتتقدّم بـ ETag و cache دائم.
- لوحة أدمن: إحصائيات، طلبات ببحث وتأكيد ورفض، محرر محتوى، وسائط، وصفحة تشخيص.
الأمان
السعر بيتحسب على السيرفر ولا يتاخد من العميل، توقيع HMAC بمقارنة آمنة، مطابقة دقيقة لحالة الدفع، bcrypt مع ترقية تلقائية للهاش، CSRF، و timeouts على كل نداء خارجي.
تحديات تقنية اتحلّت
- process slots على الاستضافة المشتركة كانت بتخلص — cache للمحتوى و timeouts وتأجيل نداءات Meta لبعد إرسال الرد.
- التوقيع الأول للـ webhook كان بيرفض دفعات حقيقية — تصحيح صيغة الرسالة.
- هاش bcrypt القادم من Node ($2b$) — ترقية تلقائية عند الدخول.
- التحويل من Next.js لـ Laravel من غير ما تتلمس جداول الإنتاج.
استكشف المزيد
كل الأعمال 
