SAAS Smart Shipment Tracking
منصة SaaS متكاملة لإدارة الخدمات اللوجستية، تم تطويرها باستخدام Next.js وNestJS وReact Native وPostgreSQL. تتيح لشركات الشحن إدارة الشحنات والاشتراكات وتتبعها بشكل لحظي عبر تطبيقات الويب والجوال والخدمات الخلفية.
هندسة الويب المتكاملة والتصميم التقني

نظرة عامة
SAAS Smart Shipment Tracking هي منصة SaaS لوجستية متكاملة ومتعددة المستأجرين، صُممت لمساعدة شركات الشحن على إدارة عملياتها من خلال منظومة موحدة ومترابطة.
تتكون المنصة من ثلاثة تطبيقات رئيسية: لوحة تحكم ويب مبنية باستخدام Next.js، وتطبيق جوال باستخدام React Native وExpo، وواجهة خلفية مبنية باستخدام NestJS.
تمكّن المنصة الشركات من إدارة الشحنات والعملاء والمسارات والمستخدمين والاشتراكات والبيانات التشغيلية، إلى جانب توفير تجربة سلسة للعملاء لتتبع شحناتهم بشكل لحظي عبر بوابة تتبع عامة مخصصة.

لوحة التحكم
توفر تطبيقات الويب بيئة متكاملة لإدارة العمليات لمختلف الأدوار، بما في ذلك مسؤولي المنصة ومديري الشركات والموظفين.
يتم تخصيص الصلاحيات والوصول إلى الوحدات المختلفة لكل دور بما يتناسب مع مسؤولياته.
يمكن للمستخدمين إدارة:
- الشحنات ومراحل التسليم.
- بيانات العملاء ووسائل التواصل.
- المسارات ونقاط التسليم.
- مستخدمي الشركة والأدوار والصلاحيات.
- خطط الاشتراك وحالة الشركة.
- إحصائيات لوحة التحكم ومؤشرات العمليات.
- الملاحظات والتواصل الداخلي.
تتميز لوحة التحكم بواجهة حديثة ومتجاوبة تدعم اتجاهي RTL وLTR.

إدارة الشحنات
توفر المنصة نظامًا متكاملًا لإدارة دورة حياة الشحنة منذ إنشائها وحتى اكتمال عملية التسليم.
يمكن للشركات:
- إنشاء الشحنات وإدارتها.
- تحديد المسارات.
- تعيين السائقين.
- إدارة محتويات الشحنات.
- متابعة حالة الشحنة.
- مراقبة تقدم عملية التسليم.
- الاطلاع على تفاصيل الشحنات بشكل شامل.
يساعد ذلك فرق العمليات اللوجستية على إدارة أعمالهم اليومية من خلال نظام مركزي واحد.

التتبع اللحظي
يمكن للعملاء متابعة شحناتهم من خلال صفحة تتبع عامة دون الحاجة إلى إنشاء حساب.
توفر بوابة التتبع:
- الحالة الحالية للشحنة.
- مستوى تقدم الشحنة.
- تفاصيل نقطة الانطلاق والوجهة.
- معلومات المسار.
- الموقع الحالي.
- بيانات السائق.
- الخط الزمني للشحنة.
- مراحل عملية التسليم.
ويتم تحديث بيانات الشحنات بشكل لحظي باستخدام Socket.IO، مما يتيح ظهور التغييرات مباشرة دون الحاجة إلى إعادة تحميل الصفحة.

الخرائط والمسارات
تتضمن المنصة خصائص تفاعلية تعتمد على الخرائط لإدارة مسارات التوصيل ومواقع الشحنات.
يمكن للمستخدمين:
- إنشاء وتعديل المسارات.
- تحديد نقاط المسار.
- متابعة حركة الشحنات على الخريطة.
- مراقبة مسارات التوصيل.
وتتكامل المنصة مع تقنيات الخرائط لتقديم تجربة أكثر وضوحًا وكفاءة في إدارة العمليات اللوجستية وتتبع الشحنات.

تطبيق الجوال
يتضمن المشروع تطبيقًا متعدد المنصات مبنيًا باستخدام React Native وExpo، ليتيح الوصول إلى المنصة خارج بيئة الويب.
يوفر التطبيق تجربة استخدام متكاملة تشمل:
- تنفيذ العمليات المتعلقة بالشحنات.
- دعم تعدد اللغات.
- الوضع الداكن.
- التخزين المحلي الآمن.
- إعدادات التطبيق وتفضيلات المستخدم.
- واجهة متجاوبة ومهيأة للأجهزة المحمولة.
كما يعتمد التطبيق على نظام الترجمة نفسه المستخدم في منصة الويب.


دعم اللغات
تدعم المنصة 10 لغات مع توفير تجربة مترجمة بالكامل:
- الإنجليزية
- العربية
- الصينية
- الهندية
- الإسبانية
- الفرنسية
- البنغالية
- البرتغالية
- الروسية
- الأردية
ويشمل نظام الترجمة:
- دعم اتجاه RTL للغتين العربية والأردية.
- توجيه الصفحات بناءً على اللغة.
- واجهات مستخدم مترجمة.
- تجربة جوال متعددة اللغات.
الواجهة الخلفية
تم بناء النظام الخلفي باستخدام NestJS وفق بنية API قابلة للتوسع، ليكون الأساس الذي تعتمد عليه تطبيقات الويب والجوال.
تشمل أبرز وظائف النظام:
- بناء واجهات RESTful API.
- المصادقة باستخدام JWT.
- إدارة الصلاحيات وفق أدوار المستخدمين.
- إدارة قاعدة البيانات باستخدام Prisma ORM.
- التكامل مع PostgreSQL.
- الاتصال اللحظي باستخدام Socket.IO.
- التحقق من صحة البيانات والطلبات.
- توثيق واجهات API باستخدام Swagger.
التقنيات المستخدمة
الواجهة الأمامية
- Next.js 16
- React 19
- TypeScript
- Tailwind CSS
- TanStack React Query
- React Hook Form
- Zod
- Axios
- Socket.IO Client
الواجهة الخلفية
- NestJS
- Prisma ORM
- PostgreSQL
- JWT Authentication
- Socket.IO
- Swagger
تطبيق الجوال
- React Native
- Expo
- Expo Router
- react-i18next
- Expo Secure Store
أبرز مميزات المشروع
- بنية SaaS متكاملة Full-Stack.
- نظام متعدد المستأجرين لدعم عدة شركات.
- تكامل كامل بين الويب والجوال والخدمات الخلفية.
- نظام صلاحيات قائم على الأدوار.
- إدارة متكاملة لدورة حياة الشحنات.
- إدارة الاشتراكات.
- تتبع لحظي للشحنات.
- خرائط تفاعلية وإدارة للمسارات.
- إحصائيات ومؤشرات تشغيلية عبر لوحة التحكم.
- بوابة عامة لتتبع الشحنات للعملاء.
- نظام توطين يدعم 10 لغات.
- دعم كامل لاتجاهي RTL وLTR.
- تصميم متجاوب عبر مختلف المنصات.
دوري في المشروع
بصفتي Full-Stack Developer، توليت مسؤولية تصميم وتطوير البنية العامة للمنصة والمساهمة في بناء مختلف مكوناتها.
وشملت مسؤولياتي:
- تطوير لوحة التحكم وبوابات التتبع باستخدام Next.js.
- تطوير واجهات الـAPI الخلفية وربطها مع التطبيقات.
- تنفيذ أنظمة المصادقة وإدارة الصلاحيات.
- بناء لوحات تحكم مخصصة حسب أدوار المستخدمين.
- تطوير سير عمل متكامل لإدارة الشحنات.
- تنفيذ الخصائص اللحظية باستخدام Socket.IO.
- تطوير مكونات واجهة مستخدم متجاوبة وقابلة لإعادة الاستخدام.
- تطبيق ودعم نظام تعدد اللغات عبر تطبيقات الويب والجوال.
- العمل على بنية قاعدة البيانات باستخدام Prisma وPostgreSQL.
- تطوير وصيانة تطبيق الجوال باستخدام React Native وExpo.