الويب بيشتغل إزاي

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

كل bug هتقابله بعد كده، سواء request فشل أو صفحة بطيئة أو CORS error، مش هتفهمه غير لو عارف إيه اللي بيحصل من أول ما تكتب URL لحد ما الصفحة تظهر. المرحلة دي قصيرة، بس هتفيدك طول شغلك.

تتعلم إيه

1. لازم تعرفه

   ال Internet و DNS وال Hosting

   علّم إنه خلص

   إزاي ال Domain بيتحول ل IP address، يعني إيه Server، والمواقع فعلياً متخزنة فين.

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

   • تقدر تشرح إيه اللي بيحصل لما تكتب URL وتدوس Enter.
   • عارف الفرق بين ال Domain وال DNS وال Hosting.

   المصادر

   • Front-End Developer RoadmapElzero Web School · كورس · عربي
   • MDN — How does the Internet work?Docs
   • MDN — What is a domain name?Docs
2. لازم تعرفه

   HTTP و HTTPS

   علّم إنه خلص

   ال Request وال Response، وال Methods، وال Status codes، وال Headers، وليه HTTPS مهم.

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

   • تقدر تقرا أي request في ال Network tab وتشرح ال Method وال Status وال Headers بتوعه.
   • عارف معنى 200 و 301 و 304 و 401 و 403 و 404 و 500 من غير ما تدور.

   المصادر

   • MDN — An overview of HTTPDocs
   • MDN — HTTP response status codesDocs
3. لازم تعرفه

   ال Browser بيرسم الصفحة إزاي

   علّم إنه خلص

   ال HTML بيتحول ل DOM، وال CSS ل CSSOM، وبعدين Layout و Paint و Composite. دي أساس أي شغل Performance بعد كده.

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

   • تقدر تشرح ال Critical rendering path بكلامك.
   • عارف ليه ال script اللي في ال <head> من غير defer ممكن يوقف ال Rendering.

   المصادر

   • MDN — How browsers workDocs
   • web.dev — Understand the critical pathمقالة
4. لازم تعرفه

   أساسيات ال Terminal

   علّم إنه خلص

   تتنقل بين الفولدرات، وتشغل commands، وتقرا ال errors. كل أداة هتستخدمها بعد كده بتشتغل من ال Terminal.

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

   • تقدر تعمل وتنقل وتمسح ملفات وفولدرات من ال Terminal.
   • تقدر توقف process شغالة وتقرا ال error message بهدوء.

   المصادر

   • Command LineElzero Web School · كورس · عربي
   • The Odin Project — Command Line Basicsكورس

أخطاء شائعة

• إنك تعدّي المرحلة دي عشان مفيهاش حاجة بتبان. هترجعلها أول ما CORS أو ال Caching يعملولك مشكلة.
• إنك تحفظ ال Status codes بدل ما تفتح ال Network tab وتتفرج على requests حقيقية.