آریانیک ...

مجله آریانیک - اخبار > bootstrap چیست، معرفی کامل فریم ورک بوت استرپ و آموزش bootstrap

Aryanic Blog

Blog



دوشنبه ١٣ دی ١٤٠٠ ١٤:١٦
photo

آموزش bootstrapبه شما کمک می‌کند که به راحتی بتوانید از کدهای آن در طراحی وب سایت خود استفاده کنید. بوت استرپ یک فریم ورک رایگان بر مبنایCSS است که برای توسعه وب سایت‌ها از آن استفاده می‌شود. هدف استفاده از بوت استرپ توانایی پاسخگویی وب سایت‌ها برای تلفن‌های همراه است. با استفاده این نوع کد نویسی، توسعه وب سایت‌های ریسپانسیو برای گوشی‌های موبایل آسان‌تر می‌شود.

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

قبل از اینکه آموزش bootstrapرا شروع کنیم بهتر است در خصوص خود بوت استرپ اطلاعاتی را ارائه دهیم. بوت استرپ در ابتدا با نامTwitter Blueprint شناخته می‌شد. این ابزار در توییتر به عنوان چارچوبی برای تشویق سازگاری و استفاده از ابزارهای داخلی بود. قبل از بوت استرپ از کتابخانه‌های مختلف استفاده می‌شد که باعث بروز ناهماهنگی‌ها شده و فرایندهای تعمیر زیادی را در وب سایت‌ها به وجود می‌آورد.

بعدها گروه کوچکی دور هم جمع شدند تا بتوانند ابزاری را توسعه دهند که از طریق آن بتوانند فرایندهای مخصوص به خود را اجرا کنند. ماه‌ها بعد نسخه‌های اولیه بوت استرپ ساخته شد. بعد از انتشار نسخه اولیه و دریافت بازخوردهای مثبت، خیلی سریع فرایند توسعه بوت استرپ آغاز شد. دلیل این توسعه سریع متن باز یا همانopen-source بودن آن بود که باعث شد توجه برنامه نویسان زیادی به آن جلب شود. از همان جا بود که نام بوت استرپ برای آن برگزیده شد.

نسخه‌های مختلف بوت اسپرت

در خصوص شروع آموزش bootstrapباید به این نکته اشاره کنیم که نسخه‌های مختلفی از بوت استرپ تا به امروز ارائه شده است. به همین دلیل بهتر از در ابتدای آموزش bootstrapبا این نسخه‌ها و کارایی‌های آن‌ها آشنا شویم. سپس به سراغ آموزش bootstrapنسخه 5 خواهیم رفت که جدیدترین نسخه از آن است.

  1. بوت استرپ نسخه 2

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

  1. بوت استرپ نسخه 3

در سال 2013 از نسخه سوم بوت استرپ رونمایی شد. از این نسخه برای طراحی مؤلفه‌های مسطح استفاده شد. بوت استرپ 3 دارای سیستم پلاگین جدید بود که امکانات زیادی را به آن اضافه می‌کرد. در این نسخه برای اولین بار پشتیبانی از مرورگرهای اینترنت اکسپلورر نسخه 7 و فایرفاکس 3.6 حذف شدند.

  1. بوت استرپ نسخه 4

قبل از اینکه آموزش bootstrapنسخه 5 را شروع کنید بهتر است نگاهی به بوت استرپ نسخه 4 داشت باشید. این نسخه از بوت استرپ توانست در مدت چند سال نسخه‌های مختلفی از خود را منتشر کند تا بتواند ویژگی‌های زیادی را به خود اضافه کند. در ابتدا نسخه آلفای بوت استرپ 4 در سال 2014 معرفی و منتشر شد. سپس در سال 2017 نسخه بتای آن معرفی و منتشر شد. در سال 2016 به صورت رسمی پشتیبانی و فعالیت روی بوت استرپ نسخه 3 و قبل تر از آن پایان یافت تا تمام تمرکز روی بوت استرپ نسخه 4 باشد. نسخه نهایی بوت استرپ نسخه 4 در سال 2018 رونمایی و منتشر شد.

تغییرات مهم ارائه شده در بوت استرپ نسخه 4

  • بازنویسی کدهای اصلی
  • جایگزینیLess باSass
  • قطع پشتیبانی ازIE8، IE9 وiOS 6
  • پشتیبانی ازCSS Flexible Box
  • افزودن گزینه‌های سفارشی‌سازی ناوبری
  • افزودن فاصله پاسخگو و ابزارهای اندازه‌گیری
  • جابجایی از واحد پیکسل درCSS بهroot ems
  • افزایش اندازه قلم جهانی از 14 پیکسل به 16 پیکسل برای خوانایی بیشتر
  • رها کردن پنل، تصویر کوچک، پیجر و اجزای دیگر
  • حذف فونت نمادGlyphicons
  • بهبود استایل فرم، دکمه‌ها، منوهای کشویی، اشیاء رسانه و کلاس‌های تصویر

 

بوت استرپ 4 از آخرین نسخه‌هایGoogle Chrome، Firefox، Internet Explorer، Opera وSafari به جز ویندوز، پشتیبانی می‌کند. علاوه بر این، ازIE10 و آخرین نسخه پشتیبانی توسعه یافته فایرفاکس(ESR) پشتیبانی می‌کند.

حال که به خوبی با بوت استرپ نسخه 4 و ویژگی‌های آن آشنا شده‌اید می‌توانید برای آموزش bootstrap5اقدام کنید.

  1. بوت استرپ 5

بوت استرپ 5 به طور رسمی در 5 می 2021 منتشر شد. این نسخه از بوت استرپ ویژگی‌ها و قابلیت های زیادی را در خود جای داده است.

ویژگی‌های جدید بوت استرپ 5 عبارت‌اند از:

  • حذف وابستگی بهjQuery به نفعvanilla JavaScript
  • بازنویسی شبکه برای پشتیبانی از ستون‌های ریسپانسیو که در خارج از ردیف‌ها قرار گرفته‌اند
  • مهاجرت اسناد ازJekyll بهHugo
  • قطع پشتیبانی از اینترنت اکسپلورر
  • انتقال زیرساخت تست ازQUnit بهJasmine
  • افزودن مجموعه سفارشی از نمادهایSVG
  • افزودن خصوصیات سفارشیCSS
  • API بهبود یافته
  • سیستم شبکه پیشرفته
  • فرم‌های به روز شده
  • پشتیبانی ازRTL

 

آموزش bootstrap5

حال که با نسخه‌های مختلف بوت استرپ آشنا شده‌اید می‌توانید به راحتی به سراغ آموزش بوت استرپ 5 بروید. البته آموزش bootstrapبه صورت حرفه‌ای نیازمند توضیحات خیلی زیادی است. شما می‌توانید از این مقاله به عنوان مقاله آموزش bootstrapاولیه استفاده کنید.

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

برای اینکه به خوبی در فرایند آموزش bootstrapقرار بگیرید لازم است که آشنایی خوبی باCSS3 وHTML5داشته باشید. البته در این زمینه باید دانش کافی در خصوصresponsive layout وflex box نیز داشته باشد. دانستن این موارد به شما کمک می‌کند که درک بالایی در آموزش بوت استرپ 5 داشته و بتوانید بهترین استفاده را از آن داشته باشید.

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

شما در دوره آموزش bootstrapمی‌توانید اطلاعات کاملی در خصوصlayout ها و مفاهیم اصولیbreakpoints وcontainer ها به دست بیاورید. همچنین فرم و ابزارهای مورد نیاز را به کار گرفته و از آن‌ها برای رنگ و پس زمینه سایت، حاشیه‌ها و مفهومinteractive وoverflow استفاده کنید. البته این موارد به صورت خیلی تخصصی در دوره‌های پیشرفته آموزش bootstrapبه شما یاد داده خواهد شد.

آموزش  bootstrap فارسی

 همان‌طور که گفته شده در نسخه 5 بوت استرپ از ویژگیRTL نیز استفاده شده است. این به معنی است که بوت استرپ از زبان‌های نوشتاری راست به چپ نیز پشتیبانی می‌کند؛ یعنی بوت استرپ فارسی نیز قابل استفاده خواهد بود. البته توسعه دهندگان بوت استرپ از نسخه‌های زیادی برای زبان‌های نوشتاری راست به چپ استفاده کرده‌اند اما آخرین نسخه از بوت اسپرت به خوبی این ویژگی را پیاده سازی کرده است.

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