كمطور واجهة أمامية، أريد تطبيق نظام الألوان والثيم الموحد على المشروع بالكامل وفق مواصفات SRD، بحيث يشمل: الخلفية #F9FAFB، السطح #FFFFFF، النص #333333، اللون التمييزي #4A90E2، والرمادي الخفيف #E5E7EB. يجب إنشاء ملف متغيرات CSS أو Tailwind config يعكس هذه الألوان، مع ضمان التناسق البصري على جميع المكونات.
كمطور واجهة أمامية، أريد بناء الهيكل العام للصفحات وتجهيز البنية التحتية للتوجيه في React، بما يشمل: إعداد React Router، تعريف مسارات جميع الصفحات (Landing، Login، Signup، Home، Public Info، Profile، Dashboard، Data Manager، Settings، AI Assistant)، وإنشاء مكونات Layout مشتركة مثل Header وFooter وSidebar بشكل مستقل عن باقي المهام.
كمطور خلفي، أريد بناء نقاط نهاية API المصادقة وإدارة المستخدمين باستخدام FastAPI، بما يشمل: تسجيل الدخول وإصدار JWT، تحديث بيانات الملف الشخصي، استرجاع معلومات المستخدم الحالي، وتسجيل الخروج. يجب تطبيق middleware الحماية للمسارات المحمية وربط البيانات بقاعدة بيانات MySQL.
كمطور خلفي، أريد بناء نقاط نهاية API للبيانات العامة التي يمكن للزوار غير المسجلين الوصول إليها، بما يشمل: جلب قائمة المحتوى العام، عرض تفاصيل عنصر محدد، والبحث والتصفية. يجب تطبيق pagination وضمان أداء جيد مع MySQL.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Landing إلى مكون React متكامل ومتجاوب، يعرض الميزات الرئيسية للتطبيق ويوجه الزوار نحو استكشاف الميزات أو التسجيل. يجب أن تتوافق الصفحة مع الثيم المحدد وتتضمن روابط التنقل إلى Public Info وSignup.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Login إلى مكون React يتضمن نموذج الدخول بحقلي البريد الإلكتروني وكلمة المرور، مع معالجة حالات الخطأ وعرض رسائل التحقق. يجب ربط النموذج بـ API المصادقة عند جاهزيته وتطبيق ثيم المشروع بالكامل.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Signup إلى مكون React يحتوي على نموذج التسجيل بجميع الحقول المطلوبة (الاسم، البريد الإلكتروني، كلمة المرور، التأكيد)، مع التحقق من صحة المدخلات في الواجهة الأمامية وعرض رسائل الخطأ المناسبة. يجب تطبيق الثيم الموحد للمشروع.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Home إلى مكون React تفاعلي يتضمن التدفق الدائري المتحرك (Interactive Circular Flow) المذكور في SRD. يجب تطبيق الرسوم المتحركة باستخدام CSS Animations أو Framer Motion، وضمان أن العناصر الدائرية التفاعلية تعمل بشكل سلس على جميع الأجهزة.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Public Info إلى مكون React يعرض المحتوى العام للزوار دون الحاجة لتسجيل الدخول. يجب أن تدعم الصفحة تصفح المحتوى وعرض التفاصيل، مع وجود دعوة للتسجيل للمستخدمين غير المسجلين.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Profile إلى مكون React يتيح للمستخدم عرض وتعديل بياناته الشخصية، بما يشمل: الاسم، الصورة الشخصية، البريد الإلكتروني، والمعلومات الأخرى. يجب تطبيق وضع العرض ووضع التعديل مع حفظ التغييرات عبر API.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Dashboard إلى مكون React يعرض لوحة التحكم الرئيسية للمدير، بما يشمل: الإحصائيات العامة، الرسوم البيانية، والروابط السريعة لإدارة البيانات والإعدادات. يجب أن تكون الصفحة متجاوبة وتدعم التحديث الديناميكي للبيانات.
كمطور خلفي، أريد بناء نقاط نهاية API لوحة التحكم الخاصة بالمدير، بما يشمل: إحصائيات النظام، ملخص البيانات، ومعلومات النشاط الأخير. يجب حماية جميع المسارات بصلاحية المدير وتحسين الاستعلامات لضمان سرعة الاستجابة.
كمطور خلفي، أريد بناء نقاط نهاية API لإدارة البيانات الكاملة (CRUD) للمدير، بما يشمل: جلب قائمة السجلات مع التصفية والبحث، إنشاء سجل جديد، تعديل سجل موجود، وحذف سجل. يجب تطبيق التحقق من صحة البيانات الواردة وتسجيل العمليات للمراجعة.
كمهندس ذكاء اصطناعي، أريد بناء طبقة تكامل نماذج الذكاء الاصطناعي باستخدام Langchain، بحيث تدعم نموذجي GPT 5.2 وClaude Opus 4.5، مع تعريف سلاسل المحادثة (conversation chains)، إدارة سياق الجلسة، وتخزين تاريخ المحادثة. يجب عزل هذه الطبقة في وحدة مستقلة قابلة للاختبار والتوسع.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Data Manager إلى مكون React يتيح للمدير إدارة البيانات بشكل كامل، بما يشمل: عرض البيانات في جدول أو قائمة، إضافة وتعديل وحذف السجلات، والبحث والتصفية. يجب ربط الصفحة بـ API إدارة البيانات مع معالجة حالات التحميل والأخطاء.
كمطور واجهة أمامية، أريد تحويل تصميم JSX الجاهز لصفحة Settings إلى مكون React يتيح للمدير ضبط إعدادات التطبيق، بما يشمل: إعدادات النظام، إدارة المستخدمين، والتفضيلات العامة. يجب حفظ الإعدادات عبر API مع التحقق من الصلاحيات وعرض تأكيد نجاح الحفظ.
كمطور واجهة أمامية، أريد بناء واجهة صفحة AI Assistant التفاعلية بما يشمل: نافذة المحادثة (Chat UI) مع دعم الرسائل المتعددة، مؤشر الكتابة، وعرض استجابات النموذج بشكل متدفق (streaming). يجب دمج الصفحة في هيكل التوجيه الحالي وربطها بـ API الخاص بالذكاء الاصطناعي عند جاهزيته.
كمهندس ذكاء اصطناعي، أريد إعداد LiteLLM كطبقة توجيه موحدة للنماذج اللغوية، بحيث يمكن التبديل بين GPT 5.2 وClaude Opus 4.5 بشكل ديناميكي بناءً على الإعدادات أو الحمل. يجب تطبيق fallback logic، تتبع الاستخدام وتكاليف الـ tokens، وتعريف نقطة نهاية API موحدة للاستفسارات من الواجهة الأمامية.
No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No comments yet. Be the first!