ZeyoFlow
منصة SaaS على غرار Webflow تتيح للشركة التسجيل وبناء موقعها من كتل جاهزة، مع محرّر مرئي مباشر ومساعد ذكاء اصطناعي. مقسّمة إلى خدمات Fastify منفصلة — بوابة API، الهوية، إدارة المستأجرين، الكتالوج والقوالب — كل منها بمعمارية نظيفة مع Inversify، ومدعومة بـ Drizzle وPostgres، وواجهة Next.js تحمل المحرّر ولوحة التحكم والإعداد. أُنجزت كمشروع تخرّج هندسي (Synergistic AI).
- دَوري
- مطور Full Stack
- الفترة
- فبراير 2025 — مايو 2025
- الحالة
- مُنجز
يتيح ZeyoFlow لأي شركة إنشاء حسابها والحصول على مساحة عمل خاصة بها، ثم تركيب موقعها من كتل معيارية دون كتابة أي كود. يعرض المحرّر المرئي كل تعديل فورًا على لوحة عرض حيّة مع أدوات مباشرة للتحكم في الخطوط والمسافات والتخطيط، ويرافقه مساعد ذكاء اصطناعي حواري يولّد مكوّنات الواجهة ويحسّنها عبر المحادثة بدل الإعداد اليدوي.
أما البنية فتقوم على خمس خدمات مصغّرة مبنية بـ Fastify — بوابة API، والهوية، وإدارة المستأجرين، وكتالوج المنتجات، وخدمة القوالب — كلٌّ منها وفق مبادئ الـ Clean Architecture مع حقن التبعيات عبر Inversify وطبقة وصول إلى PostgreSQL عبر Drizzle. ويجمع تطبيق Next.js كل ما يلمسه المستخدم: منشئ الصفحات، ولوحة تحكم المستأجر، ومسار تهيئة موجَّه. أُنجز المشروع كأطروحة هندسية (Synergistic AI).
المشكلة المطلوب حلّها
يجمع منشئ المواقع عدّة مشكلات هندسية صعبة في منتج واحد: فكل مستأجر يتشارك البنية التحتية نفسها مع ضرورة عزل هويته ومساحته ومحتواه عزلًا صارمًا؛ وعلى المحرّر أن يعكس كل تغيير في الخطوط أو المسافات أو التخطيط فورًا على لوحة حيّة لا بعد دورة حفظ وإعادة تحميل؛ وعلى مساعد الذكاء الاصطناعي أن ينتج مكوّنات تنسجم مع نظام الكتل لا مخرجات اعتباطية. ولو جُمع كل ذلك في تطبيق واحد متراصّ لتشابك منطق المستأجرين وبيانات الكتالوج ومعالجة القوالب في قاعدة كود واحدة — لذا كان فصل هذه المسؤوليات شرطًا منذ البداية.
كيف بُني
قُسّم الخادم إلى خمس خدمات Fastify خلف بوابة API: خدمة الهوية للمصادقة، وخدمة إدارة المستأجرين لمساحات العمل، وخدمتان مستقلتان لكتالوج المنتجات والقوالب. تتبع كل خدمة التنظيم نفسه وفق الـ Clean Architecture — نطاق، وحالات استخدام، ومحوّلات — مع Inversify لحقن التبعيات، فتبقى قواعد العمل قابلة للاختبار وتبقى طبقة التخزين لكل خدمة خلف حدودها. ويوفّر Drizzle وصولًا منضبط الأنواع إلى PostgreSQL في كل الخدمات.
وفي الواجهة، يستضيف تطبيق Next.js واحد منشئ الصفحات — لوحة حيّة بأدوات التحكم في الخطوط والمسافات والتخطيط — إلى جانب لوحة تحكم المستأجر ومسار التهيئة الموجَّه، بينما يحوّل مساعد الذكاء الاصطناعي الطلبات الحوارية إلى مكوّنات واجهة تُولَّد ثم تُحسَّن تدريجيًا.
ماذا يفعل
منشئ الكتل المعيارية
تُركَّب الصفحات من كتل قابلة لإعادة الاستخدام على لوحة عرض حيّة، مع أدوات مباشرة للتحكم في الخطوط والمسافات والتخطيط بدل كتابة CSS يدويًا.
مساعد المكوّنات الذكي
مساعد محادثة يولّد مكوّنات الواجهة من طلبات بلغة طبيعية ثم يحسّنها عبر رسائل المتابعة داخل المحرّر.
مساحات عمل متعددة المستأجرين
تعمل كل شركة داخل مستأجر خاص بها تملكه خدمة مستقلة لإدارة المستأجرين ويُدار عبر لوحة التحكم.
تهيئة موجَّهة
مسار خطوة بخطوة يأخذ الشركة الجديدة من التسجيل إلى مساحة عمل مهيّأة وجاهزة لبدء البناء.
خدمة قوالب مستقلة
تُدار قوالب المواقع في خدمة مصغّرة مستقلة، بما يفصل تخزينها وتقديمها عن منشئ الصفحات وبقية المنصة.
خدمة كتالوج المنتجات
خدمة كتالوج منفصلة تدير منتجات كل مستأجر خلف حدود API خاصة بها.
بُني باستخدام
الواجهة الأمامية
يشكّل منشئ الصفحات ولوحة التحكم ومسار التهيئة واجهة React واحدة عالية التفاعل، ويوفّر لها Next.js التوجيه والعرض وبنية التطبيق — لمنتج ناتجه النهائي صفحات ويب أصلًا.
لغة واحدة منضبطة الأنواع تمتد عبر الخدمات الخمس والواجهة، فيما تُبقي الأنواع المستنتَجة من Drizzle صفوف قاعدة البيانات وحمولات الـ API وحالة المحرّر متوافقة.
تقابل الأصناف الأداتية في Tailwind مباشرةً أدوات التحكم في الخطوط والمسافات والتخطيط داخل المنشئ، فتبقى أنماط المكوّنات قابلة للتركيب ومتّسقة عبر الكتل المولَّدة.
الخلفية
إطار HTTP خفيف يمكن تشغيله خمس مرات — مرة لكل خدمة مصغّرة — دون كلفة تُذكر، وينسجم نموذج إضافاته مع محوّلات الـ Clean Architecture.
البيانات
المستأجرون والمستخدمون ومدخلات الكتالوج والقوالب بيانات علائقية بقيود سلامة حقيقية؛ يفرضها PostgreSQL بينما يُبقي Drizzle المخطط داخل الكود.
بوصفه مخزنًا في الذاكرة، يمثّل Redis المكمّل المعتاد لمنظومة خدمات Node قائمة على PostgreSQL في التخزين المؤقت والحالة قصيرة العمر — بيانات يهون فقدانها وتكلف إعادة جلبها.
يستوعب نموذج المستندات في MongoDB بيانات JSON المتداخلة والمرنة البنية التي يصعب حصرها في جداول علائقية ثابتة، مكمّلًا بذلك البيانات الصارمة البنية التي يغطيها PostgreSQL.