شرح رفع APK إلى Slack باستخدام GitHub Actions في Flutter Flutter في عالم تطوير التطبيقات الحديثة، أصبحت الأتمتة جزءًا مهمًا جدًا من أي فريق تطوير، خصوصًا عندما يكون الفريق يعمل على تطبيقات يتم تحديثها بشكل مستمر. بدل ما كل مرة…

شرح مكتبة premium_otp_input لإنشاء شاشة OTP احترافية في Flutter تعتبر شاشة إدخال رمز التحقق OTP (One-Time Password) من أهم الشاشات الموجودة داخل تطبيقات Flutter الحديثة، حيث يتم استخدامها في تسجيل الدخول، وإنشاء الحسابات، واستعادة كلمات المرور، وتأكيد العمليات الحساسة. وتوفر…

شرح Prisma في Node.js خطوة بخطوة: كل اللي محتاج تعرفه لو إنت شغال بـ Node.js وبتتعامل مع قواعد بيانات زي MySQL أو PostgreSQL أو SQLite، فأكيد قابلتك مشكلة كتابة استعلامات SQL كتير ومعقدة. هنا بييجي دور Prisma، وهي واحدة من…

بناء متجر إلكتروني باستخدام React و Redux Toolkit خطوة بخطوة اصنع متجر إلكتروني كامل بـ React و Redux Toolkit مع سلة مشتريات احترافية في هذا المقال ستتعلم طريقة إنشاء متجر إلكتروني بسيط باستخدام React و Redux Toolkit و React Router…

شرح React createAsyncThunk لجلب البيانات من API وعرض حالات التحميل والنجاح والفشل عند بناء تطبيقات React الحقيقية، غالبًا ستحتاج إلى جلب البيانات من API خارجي، مثل عرض المنتجات أو المستخدمين أو الطلبات أو المقالات. وهنا تظهر أهمية React createAsyncThunk داخل…

شرح React Redux Toolkit لبناء حاسبة السعر والضريبة خطوة بخطوة تعد مكتبة React Redux Toolkit من أفضل الأدوات الحديثة لإدارة الحالة داخل تطبيقات React، خصوصًا عندما يكبر المشروع وتصبح البيانات مشتركة بين أكثر من مكون. بدلًا من تمرير البيانات يدويًا…

شرح Lifecycle في React ودورة حياة المكونات مع useEffect في React، كل مكون Component يمر بعدة مراحل منذ لحظة إنشائه وحتى إزالته من الصفحة. هذه المراحل تُعرف باسم Lifecycle أو دورة حياة المكون. فهم دورة حياة المكونات في React من…

شرح استخدام react-router-dom في React مع تطبيق عملي على عرض المنتجات وتفاصيلها عند بناء تطبيق باستخدام React، نحتاج إلى نظام تنقل يسمح بالانتقال بين الصفحات بدون إعادة تحميل الصفحة. هنا تأتي مكتبة react-router-dom التي تعتبر الحل الأساسي لإدارة التنقل داخل…

شرح جلب البيانات من API في React باستخدام useEffect و useState مع مثال عملي في تطبيقات React الحديثة، لا يكفي أن نبني واجهات ثابتة فقط، بل نحتاج غالبًا إلى جلب البيانات من مصادر خارجية مثل API ثم عرضها للمستخدم داخل…

ما المقصود بعمليات CRUD في React.js؟ CRUD هو اختصار لأربع عمليات أساسية تُستخدم في أغلب تطبيقات الويب: Create: إضافة بيانات جديدة. Read: قراءة وعرض البيانات. Update: تعديل بيانات موجودة. Delete: حذف بيانات. في React.js يمكن تنفيذ هذه العمليات بسهولة باستخدام…