الثلاثي التقني للواجهة الأمامية
اكتشف الدور الفريد لكل من HTML وCSS وJavaScript، وهي البنية والتنسيق والسلوك، وكيف تجتمع لإنشاء كل موقع ويب استخدمته من قبل
الثلاثي التقني للواجهة الأمامية درس مجاني في Frontend Academy على CoddyKit. هذا هو الدرس 2 من أصل 3. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Frontend Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Frontend Academy 3 دروس في المجموع.
تعرّف إلى الثلاثي 🤝
تعتمد الواجهة الأمامية على ثلاث أدوات: HTML وCSS وJavaScript. تعلّم هذه الأدوات الثلاث، وستتمكّن من بناء أي شيء تقريبًا. لنتعرّف إليها!
ابنِ منزلًا 🏠
تخيّل أنك تبني منزلًا. HTML هو الهيكل، وCSS هو الطلاء والتنسيق، أما JavaScript فيمنحه الحياة. الأمر بهذه البساطة.
HTML: البنية
ينظّم HTML محتوى الصفحة: العناوين والفقرات والصور والروابط. إنه الهيكل العظمي الذي يثبّت كل شيء في مكانه.
نظرة سريعة على HTML
إليك مثالًا صغيرًا. هذا السطر ينشئ عنوانًا في الصفحة فحسب. لا تحاول حفظه، بل لاحظ مدى سهولة قراءته!
<h1>Hello!</h1>CSS: التنسيق
يجعل CSS العناصر أكثر جاذبية، من خلال الألوان والخطوط والمسافات والتخطيطات. فهو يحوّل الصفحة البسيطة إلى شيء ترغب فعلًا في النظر إليه.
نظرة سريعة على CSS 🎨
تجعل هذه القاعدة الصغيرة النص باللون الأزرق. أرأيت؟ أنت تصف ما تريده، والمتصفح ينفّذه. الأمر سهل وممتع.
h1 { color: blue; }JavaScript: التفاعل
يجعل JavaScript الصفحات تنفّذ أفعالًا، مثل النقرات والنوافذ المنبثقة والقوائم والتحديثات المباشرة. إنه ما يحوّل الصورة الثابتة إلى تجربة حقيقية.
تعمل معًا كفريق
نادرًا ما تستخدم أداة واحدة فقط. تتعاون HTML وCSS وJavaScript في كل صفحة. ومعًا تصبح هذه الأدوات قوة لا تُوقَف، وكذلك أنت.
ابدأ بخطوات صغيرة وتطوّر بسرعة
لا تحتاج إلى إتقان الأدوات الثلاث كلها دفعة واحدة. يكفي القليل من HTML لإنشاء صفحة حقيقية. وكل خطوة تضيف قدرة جديدة إلى مهاراتك.
اكتمل فتح الثلاثي! 🚀
لقد تعرّفت للتو إلى مجموعة أدوات الواجهة الأمامية كاملة. لقد أنجزت الجزء الأصعب! التالي: كيف يمكن أن يبدو مستقبلك المثير بصفتك مطوّرًا للواجهة الأمامية.
تحقّق سريع
سؤال سريع! أي أداة تمثّل بنية صفحة الويب؟
الأسئلة الشائعة
هل درس «الثلاثي التقني للواجهة الأمامية» مجاني؟
نعم — نص درس «الثلاثي التقني للواجهة الأمامية» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Frontend Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Frontend Academy 3 دروس في المجموع.
ماذا ستتعلم في «الثلاثي التقني للواجهة الأمامية»؟
اكتشف الدور الفريد لكل من HTML وCSS وJavaScript، وهي البنية والتنسيق والسلوك، وكيف تجتمع لإنشاء كل موقع ويب استخدمته من قبل تتمرن على Frontend Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Frontend Academy؟
لا تُشترط خبرة سابقة. Frontend Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 3.
كم من الوقت يستغرق درس «الثلاثي التقني للواجهة الأمامية»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Frontend Academy هذا؟
نعم. كل درس في Frontend Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- ما تطوير الواجهة الأمامية؟
- الثلاثي التقني للواجهة الأمامية
- مستقبلك كمطوّر واجهة أمامية