#react

الصفحة ١ من ٣

• 

  تطوير الواجهة الأمامية٢ يوليو ٢٠٢٦١٤ دقيقة

  إنشاء Combobox سهل الوصول إليه باستخدام React Aria (٢٠٢٦)

  قم ببناء combobox متاح بالكامل باستخدام React و React-aria-components 1.19: مع ربط ARIA صحيح، وتصفح بلوحة المفاتيح، ومجموعة اختبارات حقيقية باستخدام jest-axe و Testing Library.

• 

  تطوير الواجهة الأمامية٢٩ يونيو ٢٠٢٦١٢ دقيقة

  كيفية إلغاء طلب Fetch في JavaScript (٢٠٢٦)

  إلغاء طلب fetch في JavaScript و React باستخدام AbortController: الإلغاء عند unmount، وإضافة مهلة زمنية باستخدام AbortSignal.timeout، والتعامل مع AbortError بأمان.

• 

  تطوير الواجهة الأمامية٢٦ يونيو ٢٠٢٦١٠ دقائق

  React Hook Form + Zod: شرح عمل نماذج Type-Safe (٢٠٢٦)

  ابنِ نماذج React بنظام type-safe باستخدام React Hook Form 7 و Zod 4: إعداد zodResolver، و register مقابل Controller، وإصلاح type-error باستخدام z.coerce. كل الأكواد قابلة للتشغيل.

• 

  تطوير الواجهة الأمامية٢٤ يونيو ٢٠٢٦١١ دقيقة

  TanStack Query Optimistic Updates: Rollback في

  التحديثات المتفائلة في TanStack Query (React Query) باستخدام useMutation: وcancelQueries، وsnapshot، وsetQueryData، والتراجع التلقائي عند فشل الطلب.

• 

  تطوير الواجهة الأمامية٢٢ يونيو ٢٠٢٦٨ دقائق

  TanStack Form + Zod Validation في React (٢٠٢٦)

  ابني نماذج React type-safe باستخدام TanStack Form v1 و Zod: التحقق من صحة النموذج والحقول، فحوصات async، حقول array، وحالة submit. بدون adapter، كل شيء قابل للتشغيل.

• 

  تطوير الواجهة الأمامية١٢ يونيو ٢٠٢٦١٢ دقيقة

  دليل مكون النشاط من نيرد ليفل تك: التبويبات ذات الحالة (٢٠٢٦)

  درس تطبيقي عن مكون Activity في React: الحفاظ على حالة التبويب (tab state) مع وضع الإخفاء، وإيقاف التأثيرات مؤقتاً، والتقديم المسبق لواجهة المستخدم المخفية. كود React 19.2 قابل للتشغيل، ٢٠٢٦.

• 

  تطوير الواجهة الأمامية١٢ يونيو ٢٠٢٦٩ دقائق

  React الـ ViewTransition مش شغال؟ كل الحلول (٢٠٢٦)

  React الخاص بـ <ViewTransition> لا يقوم بالتحريك؟ الأسباب الأربعة الحقيقية — sync setState و DOM placement والتوفر في نسخة canary-only ودعم المتصفح — والحل لكل منها.

• 

  تطوير الواجهة الأمامية٨ يونيو ٢٠٢٦١٣ دقيقة

  دليل useEffectEvent: أوقف تكرار تشغيل الـ Effect (٢٠٢٦)

  دليل عملي لـ React useEffectEvent: إصلاح مشكلة الـ stale closures، ومنع إعادة تشغيل useEffect عند تغيير الـ props، والانتقال من useCallback. كود قابل للتنفيذ لعام ٢٠٢٦.

• 

  تطوير الواجهة الأمامية٤ يونيو ٢٠٢٦١٦ دقيقة

  TanStack Router: معاملات بحث آمنة النوع باستخدام Zod (٢٠٢٦)

  التحقق من صحة معاملات البحث (URL search params) في TanStack Router باستخدام Zod: القيم الافتراضية، البدائل، برمجيات search middlewares الوسيطة، وملاحظة هامة حول محول Zod 4. دليل عملي لعام ٢٠٢٦.

• 

  تطوير الواجهة الأمامية١ يونيو ٢٠٢٦١٣ دقيقة

  Next.js 16 مكونات Cache: دليل تعليمي للمستأجرين المتعددين (٢٠٢٦)

  دليل إنتاج Next.js 16 لمكونات التخزين المؤقت (Cache) لأنظمة SaaS متعددة المستأجرين: مفاتيح تخزين مؤقت بنطاق المستأجر باستخدام use cache، وcacheTag لكل مستأجر، وcacheLife.

• 

  تطوير الواجهة الأمامية١٨ مايو ٢٠٢٦١٣ دقيقة

  Next.js 16 شرح Optimistic UI: Server Actions

  دليل عملي للإنتاج: إطلاق optimistic UI في Next.js 16.2 مع React 19.2 باستخدام useOptimistic و useActionState و useFormStatus و rate limits و revalidatePath.

• 

  تطوير الواجهة الأمامية١٢ مايو ٢٠٢٦٢٠ دقيقة

  Next.js 16 شرح Streaming: Suspense + use cache

  شرح عملي لـ Next.js 16.2: بث Server Components باستخدام Suspense و loading.tsx، ثم تخزينهم مؤقتاً باستخدام use cache و cacheLife و updateTag في ٢٠٢٦.