مقدمة

مكتمل

إنه لأمر مثير للإعجاب ما يمكنك القيام به على شبكة الإنترنت اليوم. يمكنك إنشاء تجارب ويب تعمل على جميع الأجهزة، وتضمين جميع أنواع محتوى الوسائط، وإجراء حساب معقد. يمكنك حتى إنشاء تطبيقات تبدو وتبدو وكأنها تطبيقات أصلية.

إذا كنت مهتما ببدء تطوير الويب اليوم، فقد تواجه مجموعة كبيرة من الخيارات. في هذه الوحدة، ستتعرف على المكونات الأساسية لموقع ويب، والأدوات التي يمكنك استخدامها لبدء تطوير الويب. ستستخدم HTML وCSS وJavaScript معا لإنشاء موقع ويب ثم استخدام أدوات المطور في المستعرض لفهم ما يحدث.

مع وجود هذه المعرفة الأساسية، سيكون لديك سياق أفضل لاتخاذ القرارات في المستقبل عند إنشاء مواقع الويب؛ على سبيل المثال، ما إذا كان يجب عليك اختيار أطر عمل JavaScript أو إنشاء وظائف JavaScript الخاصة بك لإنشاء موقع الويب الخاص بك.

لنبدأ بالنظر إلى المكان الذي نريد الذهاب إليه.

السيناريو

تخيل أنك مطور ويب، وطلب منك أن تجعل موقع شركتك على الويب يروق لمجموعة أوسع من العملاء. للسماح لعملائك بتخصيص تجربتهم على موقعك على الويب، قررت إضافة دعم للنسق الفاتحة والداكنة. يمكنك إنشاء موقع إثبات مفهوم بسيط لإثبات مبدأ دعم السمات باستخدام CSS، ويمكنك كتابة دالة JavaScript للتبديل بين تلك السمات.

عند الانتهاء، يبدو موقع الويب الخاص بك مثل هذا المثال عند تحديد النسق الداكن:

ماذا يوجد في صفحة الويب؟

يُفصل المحتوى والنمط والمنطق التفاعلي إلى ملفات HTML، وCSS، وJavaScript على التوالي. مبدأ التصميم في البرمجة الحديثة هو الفصل بين المخاوف. من بين الأسباب العديدة التي تدعو إلى الفصل بين المخاوف، هناك سببان هما: البساطة، وإعادة الاستخدام. على سبيل المثال، من خلال تصميم عناصر HTML باستخدام CSS، يمكنك تبسيط تعليمة HTML البرمجية. بدلًا من كتابة التعليمات البرمجية للمظهر داخل كل عنصر، يمكنك تطبيق أنماط CSS على جميع العناصر الموجودة على الصفحة، بغض النظر عن تعقيد الصفحة. بالإضافة إلى ذلك، يمكنك ارتباط صفحات HTML متعددة بملف CSS واحد، مما يساعد على تبسيط شكل وأسلوب متناسقين عبر موقعك على الويب بأكمله.