0%
Aymen
العودة إلى الأعمال
ويبمُنجز2026

Landing Agents

منشئ صفحات هبوط بالذكاء الاصطناعي للبائعين العرب — يخطّط صفحة البيع قسمًا بقسم ويولّد صورها عبر Gemini، ثم ينشرها على Cloudflare Pages مع ربط الدفع بمتجر WooCommerce.

دَوري
مطور Full Stack
الفترة
مايو 2025 — أبريل 2026
الحالة
مُنجز
نظرة عامة

يحوّل Landing Agents وصفًا مكتوبًا بلغة عادية لنشاط تجاري إلى صفحة بيع جاهزة للعمل. يكتب البائع بضع جمل عمّا يبيعه، فتتولى مجموعة من الوكلاء المدعومين بـ Gemini تخطيط بنية الصفحة، وكتابة كل قسم، وتوليد الصور، ثم التكرار مع المستخدم حتى تكتمل الصفحة — لتُنشر في النهاية على Cloudflare Pages مع ربط الشراء عبر WooCommerce.

بُني الخادم على Fastify وفق مبادئ DDD وCQRS: تجري عمليات التوليد والنشر كأوامر في مسار الكتابة، بينما تقرأ واجهة البناء عبر استعلامات مستقلة. أما الواجهة فمبنية بـ React على نمط MVVM — تبقى الصفحات عرضًا خالصًا، وتتركز الحالة والمنطق في طبقة ViewModels — ما يسمح بتطوير الواجهة دون المساس بقواعد العمل.

التحدّي

المشكلة المطلوب حلّها

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

الحل

كيف بُني

قُسّم سير التوليد إلى وكلاء بمهام محددة: وكيل يخطط الصفحة كسلسلة مرتبة من الأقسام، وآخرون يولّدون النص والصور عبر Gemini لكل قسم، وتتيح حلقة التكرار للمستخدم إعادة صياغة أي قسم بعينه دون إعادة توليد الصفحة كاملة. في الخادم، يعزل DDD نموذج المجال عن طبقة النقل، ويفصل CQRS أوامر التوليد كثيفة الكتابة عن القراءات التي تعتمد عليها واجهة البناء. أما الواجهة فتتبع نمط MVVM في React: الصفحات تعرض الحالة، وطبقة ViewModels تدير استدعاءات الوكلاء والتعديلات.

والنشر نفسه أمر كسائر الأوامر: تُنشر الصفحة النهائية على Cloudflare Pages مع ربط الشراء عبر WooCommerce، فتغدو الصفحة نقطة بيع لا مجرد عرض.

أبرز الميزات

ماذا يفعل

💬

من الوصف إلى الصفحة

يصف البائع نشاطه بلغة عادية، ويكون هذا الوصف هو المدخل الوحيد الذي يحتاجه النظام — فيستخرج الوكلاء منه خطة الصفحة ونصوصها وصورها.

🧠

تخطيط الصفحة قسمًا قسمًا

يخطط أحد الوكلاء صفحة البيع كسلسلة مرتبة من الأقسام قبل توليد أي محتوى، فتخرج الصفحة ببنية مقصودة بدل كتلة نصية طويلة.

🎨

توليد الصور عبر Gemini

تُولَّد صور الصفحة عبر Gemini بما يناسب الأقسام المخططة، فتحصل كل صفحة على صور خاصة بالنشاط بدل الصور الجاهزة.

🔁

مراجعة تكرارية مع الوكلاء

التوليد حلقة لا محاولة واحدة: يبدي المستخدم ملاحظاته فيراجع الوكلاء الصفحة قسمًا بعد قسم حتى تلائم نشاطه.

☁️

النشر على Cloudflare Pages

تُنشر الصفحة النهائية على Cloudflare Pages ضمن سير العمل نفسه — فالاستضافة جزء من المنتج، لا عبء يُترك للبائع.

🛒

شراء عبر WooCommerce

تخرج كل صفحة منشورة ومعها عملية شراء مربوطة بـ WooCommerce، فتعمل صفحة الهبوط كنقطة بيع لا كمجرد واجهة عرض.

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

بُني باستخدام

الواجهة الأمامية

Next.js

يستضيف Next.js واجهة React المبنية على نمط MVVM: فهو يوفر التوجيه والعرض جاهزين، بينما تبقى مكوّنات الصفحات عرضًا خالصًا ويتركز منطق أداة البناء كله في ViewModels.

الخلفية

Fastify

توفر مسارات Fastify الخفيفة والمُتحقَّق منها عبر المخططات طبقة نقل نظيفة لخادم DDD وCQRS، إذ يقابل كل أمر وكل استعلام endpoint محدد النوع.

البيانات

PostgreSQL

يدعم PostgreSQL مسار الكتابة بتخزين علائقي مُعامَلاتي يحافظ على اتساق الصفحات والأقسام وحالة التوليد مع كل أمر يعدّلها.