التصنيف react-js

ما هي الـ API

أولاً: ما هي الـ API؟ API اختصار لـ:Application Programming Interfaceواجهة برمجية للتواصل بين “شيئين”: فـ API كلمة عامّة جدًا، مش مرتبطة بالويب فقط. أمثلة بسيطة: إذًا: API = أي طريقة منظمة تخليك تتواصل مع نظام/كود آخر. ثانياً: ما هي REST…

Axios Post Method

1️⃣ ما هي POST ومتى نستخدمها؟ HTTP Method: POST نستخدمها لما نحب: الفرق عن GET: 2️⃣ شكل axios.post الأساسي الصيغة العامة: مثال بسيط: هنا: 3️⃣ أنواع البيانات اللي نرسلها مع POST 🔹 (1) JSON عادي (الأكثر استخدامًا) Axios في المتصفح…

Axios Get

1️⃣ ما هي GET؟ في بروتوكول HTTP فيه عدّة طرق (methods):GET, POST, PUT, DELETE, … الخ. مع Axios نستخدم: 2️⃣ الشكل الأساسي لـ axios.get الصيغة العامة: أو مع async/await: البرامترين: 3️⃣ أهم الخيارات داخل config مع GET 🔹 (1) params…

Axios

أولاً: ما هي Axios؟ Axios هي مكتبة (package) لجافاسكربت نستخدمها عشان نرسل طلبات HTTP مثل: يعني نفس وظيفة fetch، لكن تعطيك مميزات زيادة وتسهّل التعامل مع الـ APIs. تثبيتها (لو تستخدم React مع npm): أو: ثانياً: أهم مميزات Axios (للمبتدئين)…

fetchData

الشرح المبسّط ملاحظة: داخل Product تأكد تستقبل الـ prop كذا: وعند عرض العناصر استخدم key مثل product.id داخل الـ map.

useReducer

ما هي useReducer؟ هي هوك لإدارة الحالة (state) في React عندما تصبح منطقية التحديث معقّدة أو مترابطة. بدل ما تكتب useState كثيرة وتُبعثر منطق التحديث داخل مكوّناتك، تضع قواعد التحديث في دالة واحدة اسمها reducer. صيغة الاستخدام: تشريح الـ reducer…

Context API

🎯 ما هي Context API ؟ Context API هي طريقة في React لتمرير البيانات بين المكونات بدون الحاجة لتمرير props يدويًا عبر كل المستويات. يعني بدل ما تعمل: تقدر تستخدم context وتخلي كل المكونات تشوف نفس القيمة مباشرة، بدون تمرير…

useMemo

ما هي useMemo؟ هو هوك يرجّع لك قيمة مُحاسَبة (computed value) مُخزّنة تُعاد حسابها فقط عندما تتغيّر الاعتمادات (dependencies). فكر فيها كـ “كاش” لنتيجة دالة غالية التكلفة. التوقيع: متى أستخدمها؟ أمثلة أساسية 1) حساب مكلف (Expensive Computation) 2) فلترة وفرز…

useRef

ما هي useRef؟ التوقيع: متى أستخدمه بدل useState؟ فروقات مهمة: useRef vs useState أفضل الممارسات أخطاء شائعة لمحة سريعة مع TypeScript (اختياري) أمثلة أساسية: 🧩 المثال 1 — تركيز تلقائي على input بعد الرندر 🧩 المثال 2 — حفظ القيمة…