بوت استرپ چیست؟ تاریخچه کلمه Bootstrap چیست؟ انواع نسخه های فریم ورک بوت استرپ کدام ها هستند؟ فریمورک بوت استرپ شامل چه مواردی است؟ مزایا و معایب فریمو ورک بوت استرپ چیست؟ نحوه دانلود و استفاده از فریمورک Bootstrap چگونه است؟ اینها سوالاتی هستند که در مطلب از مجله برنامه نویسی سایت الکامکو میخواهیم به آنها پاسخ دهیم.

بوت استرپ چیست؟ 

بوت استرپ (Bootstrap) مجموعه ای از ابزارهای رایگان برای ایجاد صفحات وب و نرم افزارهای تحت وب است که شامل دستورات HTML، CSS و توابع جاوا اسکریپت جهت تولید و نمایش فرم ها، دکمه ها، تب ها، ستون ها و سایر المان های مورد نیاز طراحی وب می باشد.

بوت استرپ به اصطلاح یک فریمورک رایگان و منبع باز برای توسعه وب سایت است و به توسعه دهندگان وب کمک می کند تا وب سایت ها را سریعتر بسازند زیرا با بوت استرپ نیازی نیست که در مورد دستورات و عملکردهای اساسی نگرانی داشته باشند. بوت استرپ یک فریم ورک فرانت اند است که برای توسعه آسانتر و سریعتر وب استفاده می شود.

همچنین بخوانید » انواع زبان برنامه نویسی

تاریخچه کلمه Bootstrap چیست؟

جدای از بحث مربوط به طراحی وب و موارد مربوط به آن، عبارت Bootstrap به تنهایی به معنی “خود راه انداز” بوده و کلمه Bootstraping به معنی راه اندازی یک فرآیند بصورت مستقل و بدون استفاده از منابع خارجی می باشد.

این عبارت در علم کامپیوتر کمی کوتاهتر شده و با عنوان Booting بکار می رود، که نشان دهنده فرآیند راه اندازی سیستم و واردسازی اطلاعات اولیه نرم افزار در حافظه کامپیوتر می باشد.

کلمه Boot در زبان انگلیسی به معنی پوتین یا چکمه می باشد، برخی از پوتین ها زبانه کوچکی در انتهای خود دارند که هنگام پوشیدن پوتین برای قرارگرفتن بهتر پا در آن استفاده می شود (چیزی شبیه به پاشنه کش) این زبانه با نام Bootstrap شناخته می شود.

تاریخچه نسخه های فریم ورک بوت استرپ: 

انتشار نسخه اولیه بوت استرپ

بوت استرپ، که در ابتدا با نام Twitter Blueprint شناخته میشد، توسط مارک اتو و جیکوب تورنتون در توییتر به عنوان چارچوبی برای تشویق سازگاری در ابزارهای داخلی ایجاد شد. قبل از بوت استرپ، کتابخانه های مختلفی برای توسعه رابط استفاده می شد که منجر به ناهماهنگی ها و بار تعمیر و نگهداری بالا می شد. به گفته اتو:

من و یک گروه بسیار کوچک از توسعه دهندگان دور هم جمع شدیم تا یک ابزار داخلی جدید طراحی و بسازیم و فرصتی برای انجام کارهای بیشتر پیدا کردیم و تصمیم گرفتیم چیزی خیلی فراتر از ابزار داخلی دیگری بسازیم. ماه‌ها بعد، به نسخه اولیه Bootstrap رسیدیم.

پس از چند ماه، بسیاری از توسعه دهندگان توییتر شروع به مشارکت در پروژه ما کردند و نام آن از Twitter Blueprint به Bootstrap تغییر پیدا کرد و به عنوان یک پروژه منبع باز در ۱۹ اوت ۲۰۱۱ منتشر شد.

انتشار نسخه Bootstrap 2

در ۳۱ ژانویه ۲۰۱۲، Bootstrap 2 منتشر شد که پشتیبانی داخلی برای Glyphicons، چندین مؤلفه جدید و همچنین تغییراتی در بسیاری از مؤلفه‌های موجود اضافه کرد. این نسخه از طراحی وب ریسپانسیو پشتیبانی می کند، طراحی وب ریسپانسیو (Responsive Web Design) به این صورت است که صفحات وب در دستگاه ها با سایزهای مختلف مانند موبایل، تبلت و … بخوبی دیده می شوند و اندازه های آن بصورت پویا تنظیم می شوند.

انتشار نسخه Bootstrap 3

در ۱۹ آگوست ۲۰۱۳، Bootstrap 3 منتشر شد. بوت استرپ ۳ دارای سیستم پلاگین جدیدی است. بوت استرپ ۳ پشتیبانی اینترنت اکسپلورر ۷ و فایرفاکس ۳.۶ را حذف کرد.

انتشار نسخه Bootstrap 4

اتو بوت استرپ ۴ را در ۲۹ اکتبر ۲۰۱۴ معرفی کرد. اولین نسخه آلفای Bootstrap 4 در ۱۹ آگوست ۲۰۱۵ منتشر شد. اولین نسخه بتا در ۱۰ آگوست ۲۰۱۷ منتشر شد. اتو کار روی Bootstrap 3 را در ۶ سپتامبر ۲۰۱۶ به حالت تعلیق درآورد تا زمان خود را برای کار بر روی Bootstrap 4 آزاد کند. Bootstrap 4 در ۱۸ ژانویه ۲۰۱۸ نهایی شد. تغییرات عمده ای که در این نسخه صورت گرفته عبارتند از:

• بازنویسی اصلی کد
• جایگزینی Less با Sass
• افزودن راه اندازی مجدد، مجموعه ای از تغییرات CSS خاص عنصر در یک فایل واحد، بر اساس Normalize
• قطع پشتیبانی از IE8، IE9 و iOS 6
• پشتیبانی از CSS Flexible Box
• افزودن گزینه های سفارشی سازی ناوبری
• افزودن فاصله پاسخگو و ابزارهای اندازه گیری
• جابجایی از واحد پیکسل در CSS به root ems
• افزایش اندازه قلم جهانی از ۱۴ پیکسل به ۱۶ پیکسل برای خوانایی بیشتر
• حذف فونت نماد Glyph icons
• بهبود استایل فرم، دکمه‌ها، منوهای کشویی، اشیاء رسانه و کلاس‌های تصویر
• Bootstrap 4 از آخرین نسخه های Google Chrome، Firefox، Internet Explorer، Opera و Safari (به جز ویندوز) پشتیبانی می کند. علاوه بر این، از IE10 و آخرین نسخه پشتیبانی توسعه یافته فایرفاکس (ESR) پشتیبانی می کند.

همچنین مشاهده کنید » دوره های آموزش طراحی اپلکیشن های اندرویدی با جاوا | دوره طراحی اپلیکیشن با یادگیری کاتلین

همچنین بخوانید» آموزش android studio | اموزش نصب اندروید استودیو | اندروید استودیو چیست؟

انتشار نسخه Bootstrap 5

بوت استرپ ۵ به طور رسمی در ۵ می ۲۰۲۱ منتشر شد. تغییرات عمده ای که در این نسخه صورت گرفته عبارتند از:

• قطع پشتیبانی از اینترنت اکسپلورر
• انتقال زیرساخت تست از Quit به Jasmine
• افزودن مجموعه سفارشی از نمادهای SVG
• افزودن خصوصیات سفارشی CSS
• API بهبود یافته  | همچنین بخوانید » واسط برنامه نویسی کاربردی (API) چیست؟ | مفسر برنامه نویسی چیست؟ | IDE چیست؟
• سیستم شبکه پیشرفته
• سفارشی سازی اسناد بهبود یافته
• فرم های به روز شده
• پشتیبانی از RTL
• و…

به طور کلی در این نسخه راه حل مناسبی برای طراحان وب و کدنویسان از نظر طراحی قدیمی و خسته کننده می باشد و این خلا پر رنگ را تا حدودی برطرف کرده است تا با استفاده از دستورات معین شده در کمترین زمان ممکن بهترین نتیجه را بگیرید.

1. Scaffolding: Bootstrap یک ساختار اساسی با Grid System، سبک های پیوند و پس زمینه فراهم می کند.
2. CSS: بوت استرپ با ویژگی تنظیمات جهانی CSS، سبک عناصر اساسی HTML و سیستم شبکه پیشرفته ارائه می شود.
3. کامپوننت‌ها: Bootstrap شامل بسیاری از اجزای قابل استفاده مجدد است که برای ارائه نماد نگاری، فهرست‌های بازشو، ناوبری، هشدارها، پاپ‌اورها و موارد دیگر ساخته شده‌اند.
4. پلاگین های جاوا اسکریپت: بوت استرپ همچنین شامل تعداد زیادی پلاگین سفارشی جی کوئری است. شما به راحتی می توانید همه آنها را یا یکی یکی اضافه کنید.
5. سفارشی سازی: اجزای Bootstrap قابل تنظیم هستند و شما می توانید اجزای Bootstrap، متغیرهای LESS و پلاگین های jQuery را سفارشی کنید تا استایل مورد نظرتان را بدست آورید.

کاربرد و مزایا بوت استرپ چیست و چرا توسط توسعه دهندگان زیادی در سراسر دنیا استفاده می شود؟

۱- اولین مزایای برنامه نویسی با bootstrap :

به توسعه دهندگان کمک می کند صفحات وب ریسپانسیو طراحی کنند. دیگر نیازی به صرف ساعت‌ها برای کدنویسی شبکه ای نیستید چون بوت استرپ با سیستم شبکه از پیش تعریف شده خود ارائه می‌شود. در واقع وبسایت واکنشگرا می‌تواند به‌طور خودکار خودش را تنظیم کند تا در همه دستگاه‌ها، از تلفن‌های هوشمند گرفته تا رایانه‌های رومیزی و غیره، بخوبی نمایش داده شود.

۲- دومین مزایا bootstrap :

استفاده از فریمورک بوت استرپ آسان است و هر کسی که دانش اولیه HTML و CSS داشته باشد می تواند از Bootstrap استفاده کند.

۳- سومین مزایا bootstrap :

بوت استرپ با اکثر مرورگرها مانند کروم، فایرفاکس، اینترنت اکسپلورر، سافاری و اپرا و غیره سازگار است.

۴- چهارمین مزایا بوت استرپ:

مستندات Bootstrap بصورت کامل یعنی هر قطعه کد با جزئیات در وب سایت آن توضیح داده شده است. توضیحات همچنین شامل نمونه‌های کد برای پیاده‌سازی اولیه است که کار را برای حتی برای مبتدی‌ترین افراد ساده می‌کند. تنها کاری که باید انجام دهید این است که یک کامپوننت انتخاب کنید، کد را کپی کرده و در صفحه خود جایگذاری کنید، و از آنجا تغییر دهید.

۵- پنجمین مزایای بوت استرپ:

با افزایش محبوبیت بوت استرپ، توسعه دهندگان شروع به ایجاد قالب هایی بر اساس Bootstrap کردند تا روند توسعه وب را سریعتر کنند. وب سایت های زیادی وجود دارد که به اشتراک گذاری و خرید قالب های سفارشی مبتنی بر بوت استرپ اختصاص داده شده اند.

۶- ششمین مزایای فریمورک بوت استرپ: 

مثل خیلی از پروژه های متن باز، Bootstrap هم جامعه بزرگی از طراحان و توسعه دهندگان را همراه دارد. میزبانی در GitHub باعث می شود توسعه دهندگان به راحتی بتوانند پایگاه کد Bootstrap را تغییر دهند و در آن مشارکت کنند. همچنین همکاری، ارائه مشاوره و تعامل با کاربران دیگر را برای افراد آسان می کند.

Bootstrap دارای یک صفحه توییتر فعال، یک وبلاگ بوت استرپ و حتی یک انجمن اختصاصی GitHub است. حتی توسعه دهندگانی که مایل به کمک به مشکلات فنی در Stack Overflow هستند، می توانند همه سؤالات خود را در برچسب bootstrap-5 در Stack Overflow پیدا کنند.

۷- هفتمین مزایای فریم ورک بوت استرپ: 

مهمتر از هرچیز دیگر سرعت بالای کار با بوت استرپ است که زمان راه اندازی و اتمام یک پروژه را حتی تا ۸۰ درصد کاهش می دهد.

۸- هشتمین کاربرد بوت استرپ: 

این فریم ورک رایگان و متن یا منبع آن باز (open source) است و قابل شخصی سازی است و این مسئله به شما آزادی عمل بیشتری می دهد.

۹- نهمین کاربرد Bootstrap : 

در بوت استرپ دیگر نگرانی برای افزونه های مد نظر خود وجود ندارد چرا که برای هر ایده ای می توانید روی آن حساب باز کنید و نیازی به صرف زمان های زیاد برای انتخاب پلاگین های مختلف ندارید و همه چیز مثل یک پکیج کامل در اختیار شما قرار می گیرد.

۱۰- دهمین کاربرد بوت استرپ: 

سیستم گرید نیز از دیگر مزایای آن به شمار می‌رود در جهت چیدمان المان ها در فرم های مختلف که این این امکان را به شما می دهد تا صفحه را به دوازده ستون مختلف تقسیم کرده و تغییرات مد نظر خود را ایجاد کنید.

همچنین بخوانید » دوره فلاتر از مبتدی تا پیشرفته | فلاتر چیست؟

معایب فریم ورک بوت استرپ چیست؟ 

همانطور که قطعاً مشخص است بوت استرپ هم مانند همه فریمورک های دیگر در کنار مزایای خوبی که دارد معایبی هم دارد که البته چالش برانگیز نیست و اگر از ویژگی اپن سورس بودن و خلاقیت خود به بهترین شکل استفاده کنید راه حل دارند:

1. به دلیل اینکه قالب های بوت استرپ محبوبیت زیادی بین توسعه دهندگان دارد اکثر وب سایت ها شبیه هم می شوند و بهتر است در این مورد کمی خلاقیت نشان داد تا از وبسایت هایدیگر متفاوت باشد.
2. همچنین استفاده زیاد از بوت استرپ در عین داشتن طراحی زیبا و مجذوب کننده اما باعث افزایش و بالا رفتن حجم سایت شما می شود. اگر علاقه زیادی به استفاده از کدهای بوت استرپ دارید باید نگران سرعت سایت خود باشید و برای آن راه حل بیندیشید چرا که در سئو سایت سرعت از عوامل تعیین کننده محسوب می شود.
3. بوت اساترپ در گاهی موارد مطابق با HTMl رفتار نمی کند.

همچنین بخوانید » معرفی بازی های برنامه نویسی

نحوه دانلود و استفاده از فریمورک بوت استرپ چگونه است؟