بلال بن زازوة

أنا مهندس واجهات أمامية أركّز على بناء تطبيقات ويب مدروسة وسهلة الوصول وقابلة للصيانة باستخدام React و TypeScript. أهتم بالتفاصيل، بدءًا من الواجهات البديهية والتصميم المتجاوب وصولًا إلى البنية النظيفة والمكوّنات القابلة لإعادة الاستخدام والشفرة الموثوقة.

أعمل حاليًا مهندس واجهات أمامية في DataMasterDZ، حيث أساهم في تطوير نظام ERP حديث لتبسيط العمليات التجارية. يتضمّن عملي بناء واجهات قابلة لإعادة الاستخدام، وتحسين البنية الأمامية، وترحيل شفرة JavaScript القديمة إلى TypeScript، ورفع جودة الشفرة من خلال المراجعات والاختبارات.

خارج العمل، أبني منتجات متكاملة (full-stack) تدفعني لاستكشاف تقنيات جديدة والتفكير خارج نطاق الواجهة الأمامية. منحتني هذه المشاريع خبرة عملية في المصادقة، والتحكم في الوصول القائم على الأدوار، والمدفوعات، والميزات الفورية، وواجهات برمجة التطبيقات، وقواعد البيانات، وتكاملات الذكاء الاصطناعي.

أنا دائمًا أتعلّم وأجرّب وأبحث عن طرق أفضل لبناء برمجيات ممتعة في الاستخدام ومهندَسة بإتقان.

• أكتوبر 2024 - الحاضر

  DataMasterDZ

  مهندس واجهات أمامية لنظام ERP حديث.

  • وحّدت عدة واجهات ERP طُوّرت بشكل مستقل في قاعدة شفرة واحدة ببنية مشتركة قائمة على الميزات، مما قلّل التكرار وحسّن الاتساق بين الوحدات.
  • بدأت وقُدت عملية ترحيل 8 وحدات ERP من JavaScript إلى TypeScript، مما عزّز أمان الأنواع وقابلية الصيانة.
  • صممت وبنيت نظام مكوّنات قابلة لإعادة الاستخدام وأنماطًا أمامية مشتركة لتطوير ميزات متسقة وبأقل تكرار.
  • أدخلت مراجعات الشفرة واختبارات الوحدة والاختبارات الشاملة، مما عزّز الجودة وقابلية الصيانة والثقة في مواجهة الانحدارات.

  DataMasterDZ

  مهندس واجهات أمامية على منصة ERP الحديثة لدى DataMasterDZ. أبني وأصون الواجهات التي تدعم العمليات التجارية اليومية، بالتعاون مع المصممين ومهندسي الواجهة الخلفية لتسليم ميزات عبر وحدات ERP متعددة.

  المسؤوليات

  • التعاون الوثيق مع مصممي UI/UX لتحويل تصاميم Figma إلى واجهات عملية ومظهر بصري متقن.
  • بناء واجهات متجاوبة وسهلة الوصول باستخدام React وTailwind CSS وMUI وAnt Design.
  • ضمان تكامل سلس بين الواجهة الأمامية والخلفية عبر استهلاك واجهات API بكفاءة.
  • تنفيذ ميزات جديدة تحسّن تجربة المستخدم وتلبّي متطلبات العملاء والأعمال.
  • إعادة هيكلة الشفرة الحالية وتحسينها لرفع الأداء وقابلية الصيانة والتوسّع.
  • تشخيص الأخطاء وإصلاحها عبر المنصة.

  الإنجازات الرئيسية

  • وحّدت عدة تطبيقات ERP أمامية طُوّرت بشكل مستقل في قاعدة شفرة واحدة ببنية مشتركة قائمة على الميزات، مما قلّل التكرار وحسّن الاتساق بين الوحدات.
  • بدأت وقُدت عملية ترحيل 8 وحدات ERP من JavaScript إلى TypeScript، مما عزّز أمان الأنواع وأنماطًا أكثر قابلية للصيانة.
  • صممت نظام مكوّنات قابلة لإعادة الاستخدام وأنماطًا أمامية مشتركة لسلوك واجهة متسق وتكرار أقل بين الوحدات.
  • أدخلت مراجعات الشفرة واختبارات الوحدة والاختبارات الشاملة، مما عزّز جودة الشفرة وقابلية الصيانة والثقة في مواجهة الانحدارات.

  التقنيات

  • React
  • TypeScript
  • JavaScript
  • Tailwind CSS
  • MUI
  • Ant Design
  • Figma
  • REST APIs
  • اختبارات الوحدة
  • اختبارات E2E

  • الموقع الإلكتروني
  • LinkedIn
• يونيو 2024

  Intern2Grow

  أكملت تدريبًا افتراضيًا شمل مسارات الواجهات وJavaScript وReact، وتولّيت مهامًا واقعية من التصميم إلى التسليم.

  • الواجهات: تحويل تصاميم Figma إلى صفحات متجاوبة، بما في ذلك شاشة تسجيل الدخول وصفحة معرض أعمال.
  • JavaScript: إصلاح الأخطاء وإضافة ميزات مثل البحث بتقنية debounce والنسخ إلى الحافظة والحفظ التلقائي عبر localStorage.
  • React: إضافة ميزات مثل أزرار المشاركة الاجتماعية وخطاف useLocalStorage مخصص.

  Intern2Grow

  تدريب افتراضي في تطوير الواجهات الأمامية شمل ثلاثة مسارات — الواجهات وJavaScript وReact — أنجزت خلاله مهامًا واقعية، من تحويل تصاميم Figma إلى صفحات متجاوبة إلى بناء ميزات تفاعلية.

  مطوّر واجهات

  • تحويل تصاميم Figma إلى صفحات ويب متجاوبة.
  • تطوير شاشة تسجيل دخول وصفحة معرض أعمال بسيطة.

  مطوّر واجهات أمامية JavaScript

  • إصلاح أخطاء الواجهة وتنفيذ ميزات جديدة لتحسين التفاعل.
  • تنفيذ تقنية debounce لحقل البحث.
  • إنشاء تنبيهات باستخدام SweetAlert.js.
  • إضافة وظيفة النسخ إلى الحافظة لعينات الشفرة.
  • تنفيذ الحفظ والتحميل التلقائي عبر localStorage.

  مطوّر React.js

  • إضافة أزرار مشاركة على وسائل التواصل للاقتباسات.
  • إضافة عمود الكمية للمنتجات.
  • إنشاء خطاف useLocalStorage مخصص لمحتوى markdown وإضافة تبويب docs.

  التقنيات

  • React
  • JavaScript
  • HTML
  • CSS
  • Figma
  • SweetAlert.js
  • localStorage

  • الموقع الإلكتروني
  • LinkedIn

• KnowSphere

  منصة تعلّم متكاملة لتصفّح الدورات والالتحاق بها وإكمالها عبر الإنترنت — مع شهادات قابلة للتحقق.

  • React
  • Next.js
  • TypeScript
  • PostgreSQL
  • Node.js

  KnowSphere

  يناير 2026

  منصة تعلّم متكاملة لتصفّح الدورات والالتحاق بها وإكمالها عبر الإنترنت — مع شهادات قابلة للتحقق.

  • كتالوج دورات مع البحث والتصفية وحالة محمّلة عبر الرابط، مع تسجيل مجاني أو مدفوع عبر Stripe.
  • تسجيل الدخول عبر GitHub OAuth ورمز بالبريد الإلكتروني، مع تحكم في الوصول قائم على الأدوار يفصل المتعلمين عن المسؤولين.
  • مشغّل دروس مع تتبّع التقدّم واختبارات ونقاشات وتقييمات وشهادات قابلة للتحقق علنًا.
  • لوحة إدارة مع تحليلات وإدارة كاملة للدورات والمناهج والإشراف وسجل نشاط قابل للتدقيق.

  • React
  • Next.js
  • TypeScript
  • PostgreSQL
  • Node.js

  المستودععرض مباشر
• Teamora

  منصة محادثة جماعية فورية حيث تتعاون الفرق عبر القنوات والمواضيع، مع كتابة وملخصات مدعومة بالذكاء الاصطناعي.

  • React
  • TypeScript
  • Node.js
  • WebSockets
  • PostgreSQL

  Teamora

  نوفمبر 2025

  منصة محادثة جماعية فورية حيث تتعاون الفرق عبر القنوات والمواضيع، مع كتابة وملخصات مدعومة بالذكاء الاصطناعي.

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

  • React
  • TypeScript
  • Node.js
  • WebSockets
  • PostgreSQL

  المستودععرض مباشر