تطوير تطبيقات الويب (Web Development)
دليل عملي مرافق لمادة تطوير تطبيقات الويب — من بنية الصفحة الأساسية إلى واجهة تفاعلية حديثة، بالترتيب الصحيح.
- 1
🟧الوحدة 1: HTML — بنية الصفحة
24 درس💡 ليش هاي الوحدة مهمة؟
نقطة البداية لأي صفحة ويب — الهيكل قبل أي تصميم أو تفاعل.
🎯 أهم ما ستتقنه
الوسوم الأساسيةالنماذج (Forms)إمكانية الوصول (Accessibility)SEO الأساسيابدأ HTML — بنية الصفحة ←📌 المتطلّبات السابقة
لا شيء — نقطة البداية.
💼 في سوق العمل
أساس كل صفحة ويب على الإنترنت بلا استثناء.
- 2
🟦الوحدة 2: CSS — التصميم والتنسيق
29 درس💡 ليش هاي الوحدة مهمة؟
بعد بنية الصفحة، تتعلّم كيف تصمّمها وتجعلها متجاوبة مع كل أحجام الشاشات.
🎯 أهم ما ستتقنه
Box ModelFlexbox وGridالتصميم المتجاوب (Responsive)المتغيّرات (CSS Variables)ابدأ CSS — التصميم والتنسيق ←📌 المتطلّبات السابقة
أساسيات HTML.
💼 في سوق العمل
مهارة أساسية لأي دور frontend، ومطلوبة حتى لأدوار full-stack.
- 3
🟨الوحدة 3: JavaScript — التفاعل
36 درس💡 ليش هاي الوحدة مهمة؟
اللغة التي تحوّل الصفحة من ثابتة لتفاعلية — التحقق من النماذج، التحديث الديناميكي، التواصل مع الخادم.
🎯 أهم ما ستتقنه
DOM Manipulationالأحداث (Events)Fetch APIغير المتزامن (Async/Await)ابدأ JavaScript — التفاعل ←📌 المتطلّبات السابقة
إتقان HTML وCSS.
💼 في سوق العمل
لغة الويب الوحيدة التي يفهمها كل متصفّح مباشرة، ومطلوبة بأي وظيفة frontend تقريبًا.
- 4
⚛️الوحدة 4: React — بناء واجهات حديثةاختياري
32 درس💡 ليش هاي الوحدة مهمة؟
بعد إتقان JavaScript، تتعلّم كيف تبني واجهات معقّدة بمكوّنات (Components) قابلة لإعادة الاستخدام — الطريقة المعتمدة بأغلب الشركات اليوم.
🎯 أهم ما ستتقنه
المكوّنات (Components)الحالة (State)الخصائص (Props)الخطافات (Hooks)ابدأ React — بناء واجهات حديثة ←📌 المتطلّبات السابقة
إتقان JavaScript جيّدًا.
💼 في سوق العمل
أكثر مكتبة واجهات طلبًا بسوق العمل حاليًا، تستخدمها شركات مثل Meta وNetflix وAirbnb.
جاهز تبدأ؟ 🚀
هاد دليل مرافق للمادة، مو بديل عن المحاضرة — استخدمه للتطبيق العملي جنب دراستك.
ابدأ بـ HTML — بنية الصفحة