تخطي إلى المحتوى
محمود.
العودة للمشاريع

مؤسسي

قياس

منصة مؤسسية لقياس التحول الرقمي لأكثر من 230 جهة حكومية سعودية، مع Dashboards متعددة، وRBAC، وReview Workflows معقدة.

قياس

التصنيف

الدور
مطور واجهات أمامية
المدة
يناير 2024 – يوليو 2024
حجم الفريق
فريق متعدد التخصصات
السنة
2024
التقنيات
ReactNext.jsTypeScriptTanStack Query

01

نظرة عامة

قياس منصة مؤسسية طُورت لصالح هيئة الحكومة الرقمية في السعودية لقياس مستوى التحول الرقمي لأكثر من 230 جهة حكومية.

تتيح المنصة للجهات الحكومية رفع المستندات التي تثبت التزامها بمعايير الهيئة، بينما يقوم المدققون والخبراء بمراجعتها وتقييمها، لينتهي الأمر بإصدار درجة تعكس مستوى نضج التحول الرقمي لكل جهة.

انضممت إلى المشروع أثناء مرحلة التطوير، وساهمت في تطوير الكثير من الميزات واستكمال الواجهات الأساسية، وصولًا إلى إطلاق المنصة على Production ضمن الجدول الزمني المحدد.

02

التحدي

عند انضمامي إلى المشروع، كان التطوير قد بدأ بالفعل، لكن الموعد النهائي كان يقترب وما زالت هناك العديد من الميزات غير المكتملة.

كان التحدي يتمثل في التعامل مع تعقيد كبير في الـ Business Rules وتعدد الـ Review Workflows، مع الحفاظ على سرعة التطوير حتى الوصول إلى Production.

كما كانت المتطلبات تتطور باستمرار من خلال الاجتماعات مع الـ Stakeholders، مما تطلب بناء واجهات مرنة وقابلة للتوسع دون التأثير على استقرار النظام أو جودة تجربة الاستخدام.

03

دوري

ساهمت في استكمال المشروع وإطلاقه على Production، وتولّيت تطوير الكثير من الميزات التي يعتمد عليها المستخدمون داخل المنصة اليوم، وشمل ذلك:

  • تطوير وتسليم الكثير من الميزات وتحويلها إلى ميزات جاهزة للإنتاج ضمن الجدول الزمني المحدد.
  • المساهمة في إطلاق المنصة على Production.
  • تطوير Dashboards مختلفة لكل نوع من المستخدمين داخل هيئة الحكومة الرقمية، مثل المدققين والخبراء ومديري النظام.
  • تحويل الـ Business Rules المعقدة إلى واجهات استخدام واضحة وسهلة.
  • المشاركة المستمرة في اجتماعات تحليل المتطلبات مع الـ Stakeholders، مما ساعدني على بناء فهم عميق للـ Business Domain.
  • تحسين إدارة الـ Server State باستخدام TanStack Query من خلال Caching وتقليل الطلبات غير الضرورية.
  • التعاون المستمر مع فريق الـ Backend لضمان توافق الواجهات مع المتطلبات التي كانت تتطور أثناء تنفيذ المشروع.

لم يقتصر دوري على تنفيذ واجهة واحدة أو ميزة محددة، بل شمل العمل على عدد كبير من الميزات عبر مسارات مختلفة داخل المنصة، مع فهم منطق التقييم المؤسسي، وتحليل احتياجات كل Role، وتحويل المتطلبات المتغيرة إلى حلول قابلة للتنفيذ.

04

العملية

  1. 01

    فهم المشروع

    شاركت في جلسات تحليل المتطلبات مع الـ Stakeholders لفهم آلية تقييم الجهات الحكومية، ودورة مراجعة المستندات، واختلاف الصلاحيات بين أنواع المستخدمين المختلفة داخل النظام.

  2. 02

    التخطيط

    تم تقسيم النظام إلى مجموعة من الـ Workflows حسب كل User Role، مع التركيز على تقديم تجربة استخدام واضحة رغم تعقيد الـ Business Logic، وتحديد أولويات الميزات اللازمة للوصول إلى Production.

  3. 03

    التطوير

    تم تطوير الكثير من الميزات باستخدام React وNext.js وTypeScript، بما في ذلك صفحات الجهات الحكومية، وواجهات المراجعة والتقييم، وDashboards متعددة تناسب احتياجات كل Role، مع الاعتماد على TanStack Query لإدارة الـ Server State بكفاءة.

  4. 04

    الاختبار

    قبل الإطلاق، تم التحقق من:

    • سيناريوهات رفع المستندات ومراجعتها.
    • صلاحيات المستخدمين حسب كل Role.
    • صحة الـ Review Workflows.
    • سلامة تجربة الاستخدام عبر الصفحات الرئيسية.
    • توافق الواجهات مع المتطلبات النهائية من الـ Stakeholders.
  5. 05

    الإطلاق

    تم إطلاق الميزات تدريجيًا في بيئة الإنتاج، حتى أصبحت المنصة تضم الكثير من الميزات التي تم تطويرها خلال فترة عملي، وأصبحت مستخدمة في تقييم أكثر من 230 جهة حكومية سعودية.

05

الميزات

Dashboards متعددة

طورت Dashboards مختلفة لكل Role داخل النظام، بحيث يحصل كل مستخدم — سواء كان مدققًا أو خبيرًا أو مدير نظام — على تجربة تناسب مسؤولياته وصلاحياته.

رحلة تقييم رقمية متكاملة

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

نظام RBAC

بنيت واجهات تعتمد على Role-Based Access Control (RBAC) لضمان ظهور الصفحات والإجراءات المناسبة لكل مستخدم، ومنع الوصول غير المصرح به داخل المنصة.

أداء عالي في إدارة البيانات

استخدمت TanStack Query لتحسين الـ Caching وتقليل الطلبات المكررة والحفاظ على تزامن البيانات داخل التطبيق، مما حسّن أداء الواجهات وتجربة الاستخدام.

06

أبرز النقاط التقنية

خلال عملي على المشروع، ركزت على بناء واجهات مؤسسية واضحة وقابلة للتوسع، مع التعامل مع تعقيد الـ Business Rules وتعدد الأدوار داخل النظام.

أبرز ما عملت عليه:

  • React.
  • Next.js.
  • TypeScript.
  • TanStack Query.
  • Role-Based Access Control (RBAC).
  • Complex Business Rules.
  • Multi-Role Dashboards.
  • Review Workflows.
  • Advanced Filtering & Data Tables.
  • التعاون المستمر مع فرق Backend وStakeholders.

07

النتائج

خلال فترة عملي على المشروع، ساهمت في:

  • تطوير وتسليم الكثير من الميزات الموجودة في المنصة اليوم.
  • إطلاق المنصة بنجاح إلى Production ضمن الجدول الزمني المحدد.
  • دعم أكثر من 230 جهة حكومية سعودية من خلال منصة موحدة.
  • تطوير Dashboards متعددة تخدم أدوارًا مختلفة داخل هيئة الحكومة الرقمية.
  • تبسيط الـ Business Rules وتحويلها إلى تجربة استخدام واضحة وقابلة للتوسع.
  • اكتساب فهم عميق للـ Business Domain من خلال المشاركة المستمرة في اجتماعات الـ Stakeholders.

08

آراء وتوصيات

طه أبو العطا

مدير

طه أبو العطا

VP of Cloud, AI Governance & Security

كان من دواعي سروري العمل مع محمود، وأستطيع القول بثقة إنه من أكثر مطوري الواجهات الأمامية موهبة تعاونت معهم. يتمتع بمهارة استثنائية وأساس تقني متين، ويقدّم باستمرار أفكارًا إبداعية خارجة عن المألوف. شغفه بصناعة تجارب مستخدم سلسة ملهم حقًا. أي فريق سيكون محظوظًا بوجوده!

اقرأ التوصية كاملة

09

ما تعلمته

في المشاريع المؤسسية، كتابة الكود ليست الجزء الأصعب، بل فهم الـ Business Domain. كلما ازداد فهمي لاحتياجات الـ Stakeholders وآلية عمل المنصة، أصبحت قادرًا على تحويل المتطلبات المعقدة إلى واجهات واضحة وقابلة للتوسع.

كما علّمني العمل ضمن جدول زمني ضيق أهمية اتخاذ قرارات تقنية سريعة ومدروسة في آن واحد، وبناء واجهات مرنة تستوعب تغير المتطلبات دون إعادة بناء النظام من الصفر، بما يخدم المنتج على المدى الطويل.