تطوير واجهة منصة "امتثال" (SaaS) لإدارة الجودة | Next.js & Performance Optimization

قمت بتصميم وتطوير الواجهة الأمامية (Front-End) لمنصة "امتثال"، وهي منصة SaaS متخصصة في حلول الامتثال الرقمي وإدارة الجودة لقطاع الضيافة في المملكة العربية السعودية (B2B). الهدف من المشروع كان بناء موقع تعريفي تفاعلي، فائق السرعة، ويدعم اللغتين (العربية والإنجليزية) مع تجربة مستخدم (UX) سلسة تليق بالشركات الكبرى. ?️ أبرز المزايا التقنية التي قمت بتنفيذها: الأداء والسرعة (High Performance): تم بناء الموقع باستخدام Next.js (App Router) للحصول على أداء فائق، مع تحقيق درجات عالية (95-100) في اختبارات Google Lighthouse. ثنائي اللغة (Bilingual Support): نظام تعريب كامل (Internationalization) يدعم الاتجاهين (RTL/LTR) بسلاسة تامة، مع ضبط المسارات (/ar, /en) لخدمة السيو. تفاعلية حديثة (Interactive UI): استخدام مكتبة Framer Motion لإضافة تأثيرات بصرية ناعمة (Scroll Animations, Shrinking Navbar) تعطي طابعاً احترافياً دون التأثير على الأداء. تحسين محركات البحث (Technical SEO): هيكلة كاملة للكود (Semantic HTML)، ضبط الـ Meta Tags ديناميكياً، إنشاء Sitemap تلقائي، وإضافة Schema.org لضمان الظهور القوي في جوجل. نظام تواصل متطور (Advanced Contact System): بناء نماذج تواصل ذكية باستخدام Server Actions وربطها بخدمة Resend لإرسال إشعارات بريدية فورية بتصميم مخصص (Custom Email Templates). تصميم متجاوب (Responsive Design): استخدام Tailwind CSS لضمان ظهور الموقع بشكل مثالي على جميع الشاشات (Mobile First Approach). ? التقنيات المستخدمة: Framework: Next.js 15 (App Router) Language: TypeScript Styling: Tailwind CSS Animations: Framer Motion Email Services: Resend & React Email Analytics: Google Tag Manager & GA4 الموقع يمثل نموذجاً للمواقع الحديثة التي تجمع بين جمال التصميم، وقوة الأداء، وجودة الكود (Clean Code).