إذا لم تسمع مطلقًا عن Bootstrap ، وهو إطار تم تطويره بواسطة Twitter لإنشاء مواقع ويب جميلة ، فأنت في عداد المفقودين! يجعل Bootstrap تصميم موقع الويب سريعًا وسهلًا إلى حد ما دون معرفة كبيرة في CSS (أوراق الأنماط المتتالية). إذا كنت جديدًا في البرمجة على الويب ، فلن تحتاج إلى معرفة شيء عن CSS لبدء تعلم كيفية عمل Bootstrap ؛ كل ما ستحتاج إليه هو مستند HTML واحد. سنلقي نظرة على Bootstrap ، ونظهر لك كل شيء ، وكيف يعمل ، وإذا كان خيارًا جيدًا لكل موقع ويب تقوم بإنشائه.
إدراج API Bootstrap في ملف HTML الخاص بك
لديك بعض الخيارات لإدراج Bootstrap في ملف المشروع الرئيسي. الخيار الأول هو إدراج جميع ملفات Bootstrap اللازمة في مشروعك. يمكنك القيام بذلك عن طريق تنزيل الحزمة وتحميلها إلى مجلد المشروع. سيكون عليك ، بالطبع ، ربط ملف Bootstrap CSS الأساسي بمستندك. يحتوي موقع Bootstrap الرسمي على دليل تفصيلي حول كيفية القيام بذلك.
الخيار الآخر هو تخطي تنزيل الحزمة واستخدام شبكة توصيل المحتوى (CDN). يتيح لك CDN ربط ملفات Bootstrap الأساسية بمستند HTML الخاص بك دون تنزيله من أي وقت مضى. هذا ، بالطبع ، ليس شيئًا جيدًا دائمًا للمواقع الاحترافية ، حيث لن أكون سريعًا جدًا في ترك صفحة نشاطي التجاري أو مجموعة الأوراق المالية لتترك لي إذا كان ذلك الخادم سيتوقف عن العمل. من الأفضل أن يكون لديك ملفات في مشروعك ، ولكن لغرض التعلم ، سيكون أداء CDN جيدًا.
لإدراج Bootstrap في مستند HTML الخاص بك ، ستحتاج فقط إلى وضع الكود التالي داخل
العلامة في مستند HTML الخاص بك:بمجرد إدراج هذه الروابط في علامة الرأس هذه ، يجب أن تكون جاهزًا للبدء في استخدام فئات Bootstrap. يجب أن يبدو المستند الخاص بك كما يلي:
الحذاء والفصول
يتم تقسيم عناصر Bootstrap إلى فئات ، وهي مجرد مجموعة من CSS المكتوبة مسبقًا والتي يمكنك إدراجها في الترميز. من السهل إدراج الفئات في الترميز الخاص بك ، ما عليك سوى معرفة اسم الفصل الذي تريد استخدامه ثم تطبيقه على أحد عناصر HTML باستخدام قيمة class = "classname" ، كما تمت مناقشته في مقال سابق.
الجزء الصعب هو معرفة كيف يعمل كل ذلك معًا لإنشاء شيء جميل. يمكنك التحقق من جميع الفئات المختلفة المتاحة في Bootstrap مباشرة من الوثائق الرسمية. الآن ، إتقان Bootstrap هي قصة أخرى. هذا ليس شيئًا يمكننا تعليمه أنت أو أي شخص آخر. يمكنك مشاهدة البرنامج التعليمي بعد البرنامج التعليمي ، ولكن لكي تتقن استخدام الإطار ، يأتي ذلك مع الكثير من التجربة والخطأ. وهذا يتطلب منك الحصول على التدريب العملي في المشاريع الخاصة بك.
مع وضع ذلك في الاعتبار ، أناشدكم أن تبدأ مشروع HTML الخاص بك على جهاز الكمبيوتر الخاص بك باستخدام Atom أو بعض برامج تحرير النصوص الأخرى ، ومراجعة فئات HTML و CSS ، ومن ثم ابدأ اللعب باستخدام Bootstrap. وإذا كنت تعرف عددًا كافيًا من العلامات ، فربما تنشئ موقع محفظة خاص بك كتمرين اختبار.
هل Bootstrap خيار قابل للتطبيق لكل موقع؟
يعد Bootstrap إطارًا رائعًا ، ولكن هل يعد خيارًا قابلاً للتطبيق لكل موقع تنشئه؟ ذلك يعتمد حقًا على المطور وكذلك متطلبات المشروع. في العديد من البيئات المهنية ، لن يكون لديك حقًا خيار ما هي التقنيات التي تستخدمها ، لأن ذلك سيكون متروكًا إلى حد كبير لمدير المشروع. إذا اختار مدير المشروع استخدام Bootstrap ، فستقوم بدمجه مع الكثير من CSS المخصص أيضًا. هذا هو ما يجعل موقع الويب الخاص بك فريدًا ومختلفًا عن مواقع الويب الأخرى التي تستخدم Bootstrap.
أنا شخصياً لا أرى Bootstrap كخيار رائع لكل موقع ويب. من المؤكد أنه يمكن أن يساعد في تقديم بعض الاختصارات ، لكنني وجدت في النهاية أن التصميم من البداية إلى القمة باستخدام CSS هو أفضل طريق إلى حد كبير بسبب التحكم الذي لديك عليه. ولكن مرة أخرى ، إذا كنت بدأت للتو في برمجة الويب ، فليس من الأمور السيئة استخدام Bootstrap على الإطلاق ، لكن لا تعتمد عليها في حياتك المهنية.
تجدر الإشارة إلى أنه إذا كنت مطورًا مبتدئًا ، فلا يجب عليك استخدام Bootstrap لجميع المشاريع في محفظتك. يمكن أن تتقن أنك قد تكون بارعًا في واجهة برمجة التطبيقات ، لكنك لا تعرف تمامًا طريقك نحو CSS. ومع ذلك ، من الجيد أن يكون لديك مزيج مناسب من كليهما في محفظتك (أو حتى CSS حصريًا ، لأنه من السهل التقاط Bootstrap).
إغلاق
هذا كل ما هو Bootstrap باختصار. كما ذكرت سابقًا ، أشجعك على بدء مشروع HTML الخاص بك وإضافة بعض الفئات المختلفة إلى عناصر لبدء الالتفاف باستخدام الإطار. يمكنك العثور على جميع المكونات المختلفة التي يقدمها Bootstrap مع التوضيحات والأمثلة البرمجية هنا.
يعد Bootstrap حقًا أداة أنيقة ، لكن تذكر أن لا تعتمد عليها وحدها! من الجيد أن تكون على دراية به ومعرفة طريقك حول الإطار ، ولكن تأكد أيضًا من الغوص في CSS لفهم حقيقة ما يجري خلف الكواليس. ليس ذلك فحسب ، ولكن المعرفة القوية في CSS تكمل Bootstrap كثيرًا ، مما يتيح لك حقًا إنشاء بعض المواقع الفريدة والجميلة بتخصيصك الخاص.
