فصل صفر

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

بوت استرپ یک فریم ورک اوپن سورس برای توسعه صفحات وب هست که با HTML, CSS  و JS  کار می کند و برای ساده سازی زیبا سازی و سرعت و دقت توسط شرکت توئیتر در سال 2011 عرضه شد.

بوت استرپ چکار می کند؟

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

مثلا برای اینکه چندین تگ Div را در کنار هم داشت در قوانین HTML پایه باید از تگ های Table و tr td و خیلی تگ های دیگر برای هر سطر استفاده می کردیم ولی الان با استفاده از بوت استرپ می شود با دادن کلاس های Col که مخفف Column می باشد تعیین کنید که چند قسمت کنار هم داشته باشید و هر بخش چه اندازه ای داشته باشند بدون اثر گذاری به سطر بالا و پایین و البته به صورت ریسپانسیو که به صورت اتوماتیک نوع نمایش صفحه را بر اساس نمایشگر دستگاه و عرض صفحه تنظیم می کند؛ در وب کلاسیک این کار باید توسط کد نویسی های طاقت فرسا به زبان جاوا اسکریپت و یا جی کوئری و... انجام شود.

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

1. چون ساده است و هر کس تنها با داشتن دانش HTML می تواند با آن کار کند.
2. قابلیت ریسپانسیو بودن مادرزاد دارد (واکنشگرایی) و در هر صفحه نمایشگر مطابق با عرض صفحه خود را تطبیق داده و نیاز به کد نویسی برای این منظور ندارد.
3. براساس الگوی Mobile First طراحی شده زیرا در حال حاضر اکثر مردم دنیا برای دیدن صفحات وب از موبایل و تبلت و دستگاه های قابل استفاده می کنند و کمتر از کامپیوتر شخصی پس طراحی بر اساس موبایل اهمیت بیشتری دارد.
4. با اکثر مرورگر های مدرن امروزی سازگار است و از آخرین تکنولوژی ها و بهینه سازی ها استفاده می کند.

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

بوت استرپ دو فایل اصلی و هسته دارد که یکی به زبان CSS نوشته شده و دیگری به زبان جاوا اسکریپت و کتابخانه های Jquery که باید این سه فایل در بالای صفحه وب فراخوانی شود.

همچنین در بوت استرپ 4 فایل جاوا اسکریپتی جدید به نام کتابخانه Popper JS اضافه شده که قابلیت های جدیدی به آن اضافه کرده که در ادامه به بررسی آنها خواهیم پرداخت.

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

چند روش برای این کار وجود دارد:

1. دانلود فایل های آن از سایت رسمی آن به آدرس getbootstrap.com 
2. استفاده از یکی از سیستم های تحویل محتوا یا CDN مانند MaxCDN

   <!-- Latest compiled and minified CSS -->
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
   
   <!-- jQuery library -->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   
   <!-- Popper JS -->
   <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
   
   <!-- Latest compiled JavaScript -->
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>

   
   
3. استفاده از سیستم های مدیریت بسته یا Package Manager ها مانند Nuget یا npm.