Nabra Media - Full-Stack Bilingual Web Platform

تطبيق ويب حديث بمستوى مؤسسي، تم تطويره خصيصًا لوكالة إعلامية، ويضم نظام إدارة محتوى متكامل مع دعم ثنائي اللغة (الإنجليزية / العربية) وإمكانيات كاملة لتخطيطات RTL.

الميزات الرئيسية:

بنية الواجهة الأمامية (Frontend Architecture)

بنية React قائمة على المكوّنات، تضم أكثر من 50 مكوّنًا معياريًا وقابلًا لإعادة الاستخدام، مع الالتزام الصارم بمعايير التسمية

حركات وانتقالات متقدمة باستخدام Framer Motion، تشمل تأثيرات دخول متتابعة وانتقالات تفاعلية

تصميم متجاوب بالكامل يعتمد على منهجية Mobile-First مع أنماط UI/UX احترافية

Hooks مخصّصة لفصل منطق الأعمال عن الواجهة وإدارة الحالة

تطوير آمن من حيث الأنواع عبر تطبيق شامل لـ TypeScript

النظام ثنائي اللغة (Bilingual System)

تبديل كامل بين اللغتين العربية والإنجليزية مع حفظ الاختيار في localStorage

تحويل تلقائي لاتجاه الواجهة RTL / LTR مع تكيّف التخطيط

إدارة مركزية للترجمات مع تقديم محتوى مخصص لكل لغة

إدارة حالة اللغة على مستوى التطبيق باستخدام Context

الخلفية ونظام إدارة المحتوى (Backend & CMS)

Backend مبني بـ Laravel 12 مع لوحة تحكم Filament 5 لإدارة المحتوى

نظام محتوى ديناميكي للصفحات مع دعم تعدد اللغات

واجهات RESTful API للحجوزات، ونماذج التواصل، والأخبار

محتوى مرتبط بقاعدة البيانات باستخدام Eloquent ORM وملفات migrations

نظام مصادقة باستخدام Laravel Fortify مع دعم التحقق الثنائي (2FA)

الوحدات الأساسية (Core Modules)

Hero Slider ديناميكي: قسم رئيسي متحرك يحتوي على إحصائيات، أزرار CTA، ومؤشرات تمرير

عرض الخدمات: باقات أسعار، مميزات، ووصف تفصيلي للخدمات

نظام الأخبار / المدونة: إدارة المقالات مع التصنيفات، البحث، والتقسيم الصفحي

آراء العملاء (Testimonials): سلايدر تفاعلي مع مؤشرات تنقّل وتمرير سلس

نظام الحجز: اختيار الخدمات وجدولة المواعيد

نماذج التواصل: نماذج متعددة الحقول مع التحقق وخيارات تواصل سريعة

قسم من نحن: إحصائيات الشركة، القيم، والرؤية والرسالة

أبرز الجوانب التقنية (Technical Highlights)

دعم العرض من جهة الخادم (SSR) باستخدام Inertia.js

Vite 7 لعملية بناء محسّنة ودعم Hot Module Replacement

Laravel Wayfinder لتوجيه آمن من حيث الأنواع بين الواجهة الأمامية والخلفية

اختبارات آلية باستخدام PHPUnit وأدوات جودة الكود (Pint، ESLint، Prettier)

توليد Sitemap لتحسين محركات البحث (SEO)

دعم Docker باستخدام Laravel Sail

ممارسات التطوير (Development Practices)

بنية مكوّنات معيارية مع فصل واضح للمسؤوليات

اعتماد نمط Custom Hooks لإعادة استخدام منطق الأعمال

معايير تسمية موحّدة (ComponentName + Component)

استخدام Props وInterfaces آمنة من حيث الأنواع في جميع أنحاء التطبيق

تنسيق احترافي للكود والالتزام الصارم بمعايير linting