رجيمي — منصة متابعة تغذية: تطبيقا المشترك والأخصائي ولوحة تحكم الإدارة

«رجيمي» منصة اشتراكات غذائية تربط المستخدمين بأخصائيي تغذية معتمدين لتقديم خطط غذائية مخصصة، ومحادثات مباشرة، ومتابعة التقدم الصحي. بنيت لها تطبيق المشترك وتطبيق أخصائي التغذية بـ Flutter، ولوحة تحكم الإدارة بـ React، وساهمت في موقع المنصة (regime.chat)، وكلها تتصل بواجهة خلفية مبنية بـ .NET Clean Architecture عبر REST API. التطبيقان منشوران على Google Play في مرحلة الاختبار المغلق.

أولاً: تطبيقا الموبايل (Flutter)

بُني التطبيقان وفق معمارية نظيفة مقسمة حسب الميزات، لكل ميزة طبقات البيانات والمنطق والواجهة، مع إدارة الحالة بـ BLoC/Cubit، وحقن الاعتماديات بـ get_it، وعميل API مكتوب بـ Dio وRetrofit، ونماذج مولَّدة بـ freezed، وFirebase Firestore للمحادثات الفورية ومزامنة البيانات لحظياً.

- شاشات الترحيب (Onboarding) وتسجيل الدخول وإنشاء الحساب، مع تسجيل الدخول عبر Google وApple.

- عرض باقات الاشتراك وتنفيذ عملية الشراء باستخدام Stripe.

- محادثة فورية بين المشترك وأخصائي التغذية: نصوص وصور وملفات ورسائل صوتية، مع حالة القراءة ومؤشر «متصل الآن»، وتتحول المحادثة للقراءة فقط عند انتهاء الاشتراك.

- عرض الخطط الغذائية اليومية والأسبوعية بطريقة منظمة وسهلة الاستخدام.

- متابعة تقدم المستخدم: الوزن، والوجبات، وكمية المياه، والنشاط البدني، مع رسوم بيانية وتقارير أسبوعية.

- نظام نقاط ومكافآت يحفّز المشترك على الالتزام.

- في تطبيق الأخصائي: لوحة بالعملاء والأرباح، ومحفظة مع سحب الأرباح إلى حساب بنكي (IBAN)، والتقييمات ومؤشرات الأداء.

- إشعارات فورية عبر Firebase Cloud Messaging لتذكير المستخدم بالوجبات وشرب الماء والنصائح والعروض، وروابط عميقة (Deep Links) تفتح التطبيق مباشرة، ومنها روابط استعادة كلمة المرور.

- واجهة عربية أولاً بالكامل من اليمين لليسار (RTL).

ثانياً: لوحة تحكم الإدارة (React)

واجهة الإدارة المركزية التي تُدار من خلالها المنصة بالكامل: العملاء وأخصائيو التغذية والاشتراكات والمدفوعات والمحتوى والدعم الفني. بُنيت باستخدام React 19 وTypeScript وVite، مع TailwindCSS 4 ومكتبة مكونات مبنية على Radix UI بدعم كامل للعربية واتجاه RTL والوضع الليلي. تعتمد إدارة حالة الخادم على TanStack Query، والنماذج على React Hook Form مع تحقق Zod، وتتصل بالواجهة الخلفية عبر عميل REST مُولَّد آلياً من مواصفة OpenAPI باستخدام Orval، بما يضمن تطابق الأنواع بين الواجهة والخادم.

- لوحة مؤشرات تحليلية تعرض نمو المنصة والإيرادات وتوزيع الاشتراكات عبر رسوم بيانية تفاعلية (Recharts).

- إدارة أخصائيي التغذية: مراجعة طلبات الانضمام واعتمادها أو رفضها، وملفات تفصيلية، وشاشة مؤشرات أداء (KPIs) لقياس زمن الاستجابة وجودة الخدمة.

- إدارة العملاء والاشتراكات، وشاشة لرصد الاشتراكات التي فقدت أخصائيها مع تعويض العميل بتمديد اشتراكه.

- الوحدة المالية: المدفوعات، والإيرادات، وعمولات المسوّقين، وطلبات السحب، وإدارة الباقات.

- نظام كوبونات خصم كامل مع تحقق من الصلاحية.

- مركز دعم فني: محادثات دعم لحظية عبر Firebase Firestore، وتذاكر، وشكاوى، ومحادثات المساعد الآلي مع إمكانية تدخّل موظف الدعم.

- إدارة الفريق والصلاحيات: حسابات الموظفين والمشرفين مع منح ونزع صلاحيات دقيقة لكل مشرف.

- إدارة المحتوى: المقالات، والأسئلة الشائعة، والبانرات، والإعلانات، ونصوص التطبيق القابلة للتحرير دون إعادة نشر.

- بث إشعارات موجّهة للعملاء أو الأخصائيين أو الجميع.

ثالثاً: موقع المنصة (Next.js)

ساهمت في موقع المنصة المبني بـ Next.js وReact 19 بميزتين:

- ويدجت محادثة للمساعد الذكي والدعم الفني مع إدارة الجلسة.

- نظام الإحالة بالعمولة: صفحة /r/[code] تسجل الزيارة وتحمل كود الإحالة إلى رابط Google Play، فيبقى الكود بعد التثبيت ويُفتح كرابط عميق مؤجل (Deferred Deep Link) عند أول تشغيل للتطبيق.