مهندس Frontend

أبني تطبيقات ويب قابلة للتوسع، تبدو وتعمل كمنتجات حقيقية.

متخصص في Angular، أبني لوحات تحكم ومنصات تجارة إلكترونية وأنظمة مؤسسية جاهزة للإنتاج.

Angular • TypeScript • RxJS • Signals

صورة شخصية لكريم زكريا
  • Angular
  • TypeScript
  • RxJS
  • Signals
  • SSR
  • REST APIs
  • Real-time (SignalR)
  • RTL/LTR
  • Testing
  • CI/CD
  • 5

    مشاريع منفذة

    لوحات تحكم ومتاجر ومواقع

  • 20+

    كيان تشغيلي في منصة واحدة

    CleanTech

  • 5

    أدوار مستخدمين بصلاحيات منفصلة

    CleanTech

  • 2

    لغتان بدعم كامل لـ RTL

    السلام، المتجر، موقع AI Cloud

أبرز الأعمال

تطبيقات إنتاجية بُنيت لاحتياجات عمل حقيقية.

كل المشاريع →
لوحة تحكم منصة السلام الدولية تعرض ملخصات الشحنات والمنتجات والشركات وجدولًا بأحدث الشحنات.

منصة إدارة اللوجستيات والاستيراد

AlSalam International

منصة لعمليات الاستيراد تتابع الشحنات والموردين والشركات وتسجيل المنتجات في نظام واحد، مع صلاحيات حسب الدور وتقارير وصفحة تحقق عامة عبر QR ودعم كامل للعربية والإنجليزية بنظام RTL.

  • Angular 21
  • PrimeNG
  • ngx-translate
  • Vitest
الصفحة الرئيسية للمتجر مع سلايدر رئيسي وبحث عن المنتجات والسلة ومبدّل اللغة.

متجر إلكتروني ولوحة تحكم

E-Commerce Platform

واجهة متجر بتقنية Server-Side Rendering مع دفع عبر Paymob وعربية/إنجليزية بنظام RTL، ولوحة تحكم مرافقة للمنتجات والطلبات والمرتجعات والبنرات وتقارير المبيعات.

  • Angular 21 SSR
  • Angular Material
  • RxJS
  • Paymob
شاشة تسجيل الدخول في منصة CleanTech لإدارة المرافق، مع مبدّل اللغة ورسم توضيحي لوحدات المنصة.

منصة إدارة المرافق والنظافة

CleanTech

منصة لإدارة المرافق والنظافة بخمس مساحات عمل حسب الدور تغطي المهام والورديات والحضور والمخزون والحساسات والتقارير، مع إشعارات فورية عبر SignalR.

  • Angular
  • SignalR
  • ngx-translate
  • jsPDF

مشاريع أخرى

موقع خدمات الأجهزة الطبية

MedGate

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

  • Angular 18
  • Bootstrap 5

موقع الشركة التسويقي

AI Cloud Corporate Website

الموقع التعريفي للشركة، بُني بـ Next.js ثم أُعيد بناؤه بـ Angular 18: 8 صفحات و35 مكوّنًا مع الحفاظ على حركات التمرير والتبديل الفوري بين العربية والإنجليزية.

  • Next.js
  • Angular 18
  • Tailwind CSS
  • GSAP

ما أبنيه

خمس طرق أساعدك بها على تحويل المتطلبات إلى منتج يعمل.

كل الخدمات →
  • تطوير الواجهات الأمامية

    واجهات Angular حديثة وجاهزة للإنتاج، بمعمارية نظيفة ومكوّنات قابلة لإعادة الاستخدام واهتمام بالأداء.

  • تطوير تطبيقات الويب

    تطبيقات ويب متكاملة تُبنى من متطلبات عملك وتُربط بواجهات الـ API الخاصة بك.

  • تطوير المتاجر الإلكترونية

    واجهات متاجر وأنظمة إدارة تشمل المنتجات والمصادقة والسلة والدفع والتكامل مع بوابات الدفع والتعريب.

  • تطوير لوحات التحكم

    لوحات تحكم للأعمال بجداول ومرشّحات وبحث ورسوم بيانية ونماذج وصلاحيات وتقارير وتصدير وتحديثات فورية.

  • من Figma إلى Angular

    تحويل التصميمات الاحترافية إلى واجهات Angular متجاوبة، سهلة الوصول، وقابلة لإعادة الاستخدام.

طريقة عملي

  1. فهم المتطلبات

    أحدد هدف العمل والمستخدمين وعقود الـ API قبل كتابة أي كود.

  2. تصميم المعمارية

    أُنظّم التطبيق في طبقات واضحة (واجهة، خدمات، Repositories) ليبقى قابلًا للاختبار وسهل التوسع.

  3. البناء

    أسلّم على مراحل صغيرة تعمل، باستخدام مكوّنات قابلة لإعادة الاستخدام وواجهات مُنمّطة بالأنواع.

  4. الإطلاق

    أربط التطبيق بالـ API الحقيقية، وأختبر المنطق الأساسي، وأنشره للإنتاج.

الهندسة خلف الواجهة

أين يظهر العمق التقني، وفي أي المشاريع.

  • معمارية نظيفة وقابلة للاختبار

    طبقة بيانات صارمة (Repository ← Service ← Mock) تسمح ببناء الواجهة واختبارها على بيانات تجريبية ثم التحويل إلى الـ API الحقيقية دون المساس بالمكوّنات.

    ظهر في: AlSalam International

  • العربية والإنجليزية بشكل صحيح

    دعم كامل لـ RTL/LTR، بما في ذلك خدمة ترجمة مبنية على Signals بتبديل فوري للغة وبدون إعادة تحميل الصفحة.

    ظهر في: AlSalam International · E-Commerce Platform · AI Cloud Website

  • العرض والأداء

    Server-Side Rendering مع جلسات قائمة على الـ Cookies، وإعدادات بناء تشمل التحميل عند الطلب للمسارات وحدودًا لحجم الحزم.

    ظهر في: E-Commerce Platform · AI Cloud Website

  • التحديثات الفورية والتكاملات

    تحديثات فورية عبر SignalR، ودفع آمن عبر Paymob، وتتبع أخطاء الإنتاج عبر Sentry.

    ظهر في: CleanTech · E-Commerce Platform

نبذة عني

مطوّر Frontend بخبرة تتجاوز سنتين في بيئات الإنتاج، متخصص في Angular (الإصدارات 18–21). أبني تطبيقات مؤسسية قابلة للتوسع وعالية الأداء، من لوحات التحكم الفورية إلى منصات التجارة الإلكترونية ثنائية اللغة وأنظمة اللوجستيات، مع تركيز على المعمارية النظيفة والمكوّنات القابلة لإعادة الاستخدام وتجربة مستخدم متقنة. أتولى تنفيذ الميزات من البداية للنهاية، من ربط الـ API حتى النشر للإنتاج.

  1. يوليو 2024 — الآن

    مطوّر Frontend · AI Cloud

    • بناء لوحات تحكم Angular فورية ببيانات حساسات حية وعروض وصلاحيات حسب الدور.
    • تسليم مواقع ثنائية اللغة (عربي/إنجليزي) لعملاء في السعودية، منها موقع شركة بـ Next.js.
    • قيادة نقل موقع الشركة من Next.js إلى Angular 18 مع الحفاظ على تطابق 1:1 في الواجهة والحركة.
    • العمل مع فرق الـ Backend وUI/UX وFlutter والتصميم الجرافيكي لتسليم مشاريع العملاء بالكامل.

لديك مشروع في بالك؟

أخبرني بما تبنيه، ولنرَ كيف يمكنني مساعدتك.