ال Data وال APIs

ليه المرحلة دي مهمة

أغلب شغل الفرونت إند إنك تنقل data بين Server وشاشة. وإنك تعمل ده صح يعني تتعامل مع كل الحالات (loading و error و empty و stale)، وتعمل Caching بعقل، وتعرف أنهي Protocol مناسب لأنهي مشكلة.

تتعلم إيه

1. لازم تعرفه

   REST وال HTTP caching

   علّم إنه خلص

   تصميم ال Resources، وال Pagination، وشكل ال Errors، و Caching headers (Cache-Control و ETag) اللي بتخلي ال App سريع ببلاش.

   تبقى خلصته لما

   • تقدر تقرا Docs بتاعة API وتربطها مع Error handling كامل.
   • عارف Cache-Control: no-cache معناها إيه فعلاً.

   المصادر

   • MDN — HTTP cachingDocs
2. اختياري

   GraphQL

   علّم إنه خلص

   ال Queries وال Mutations وال Fragments، وال Client caching ب Apollo أو urql. اتعلمه لما الشركة تستخدمه.

   تبقى خلصته لما

   • تقدر تكتب Query ب Fragments و Variables.

   المصادر

   • graphql.org — LearnDocs
3. اتعلمه بعدين

   ال Real-time وال Streaming

   علّم إنه خلص

   WebSockets للرسايل في الاتجاهين، و Server-Sent Events لما ال Server يبعت، و Streamed responses اللي شغالة بيها واجهات ال AI chat.

   تبقى خلصته لما

   • تقدر تعرض Streamed response حتة حتة وهي جاية.
   • عارف إمتى SSE يكفي وإمتى محتاج WebSockets.

   المصادر

   • MDN — Server-sent eventsDocs
   • MDN — Streams APIDocs

أخطاء شائعة

• إنك تعرض شاشة فاضية لما Request يفشل. كل Request ليه 4 حالات، صمم الأربعة.
• إنك تجيب نفس ال Data في 5 Components بدل ما تعملها Cache مرة واحدة.