المشكلة — TypeScript مش بيراجع الـ API

تلات حاجات مختلفة

في React مع TypeScript وTanStack Query، لازم نفرّق بين تلات حاجات:

• الـ Typing: إيه نوع الداتا اللي الكود متوقع يتعامل معاها؟
• الـ Runtime Validation: هل الداتا اللي رجعت من الـ API مطابقة فعلًا للنوع المتوقع؟
• الـ Error Handling: هنعمل إيه لو الداتا مش مطابقة؟

TypeScript مش بيعمل validation للـ API

تخيّل إن عندك API بترجع بيانات المستخدم بالشكل ده:

type User = {  id: number;  name: string;  email: string;};

وعندك الـ API request:

const getUser = async (): Promise<User> => {  const response = await fetch("/api/user");  return response.json();};

هنا أنت بتقول لـ TypeScript إن الدالة بترجع User، لكن هل TypeScript اتأكد إن الـ API رجعت فعلًا id من نوع number وname من نوع string؟

الـ API ممكن ترجع:

{  "id": "wrong-id",  "name": null,  "email": 123}

ومع ذلك، TypeScript مش هيكتشف المشكلة وقت تشغيل البرنامج. الـ JSON بيانات خارجية، وTypeScript بيعمل type checking وقت التطوير والـ compilation، مش runtime validation.

خلّصت الفصل لما

• تفرّق بين Typing وRuntime Validation وError Handling
• تشرح ليه Promise<User> مش بيتأكد من شكل الـ JSON
• تعرف إن TypeScript بيراجع وقت الـ compilation مش وقت التشغيل