درباره Bootstrap بیاموزید: وب سایتهای پاسخگو را شروع کنید

افشای: پشتیبانی شما به حفظ سایت کمک می کند! ما برای برخی از خدماتی که در این صفحه توصیه می کنیم هزینه ارجاع دریافت می کنیم.


این راهنما شما را با Bootstrap ، چهارچوب محبوب منبع باز منبع باز برای وب سایت ها آشنا می کند. خواندن یک مقدمه و تاریخچه مختصر را ادامه دهید ، یا از پیمایش در سمت راست برای پرش به منبع Bootstrap مورد نظر خود استفاده کنید.

از آنجا که نسخه 2 ، بوت استرپ دارای مؤلفه های طراحی وب پاسخگو (RWD) است ، آن را به ابزاری عالی برای مقیاس گذاری وب سایتها با یک پایه کد واحد مشترک بین دستگاه های مختلف با استفاده از نمایش داده های رسانه CSS تبدیل می کند..

Bootstrap منبع باز است و در GitHub میزبان ، توسعه و نگهداری می باشد. در حال حاضر ، این ستاره ترین پروژه در GitHub است. بیایید بدانیم چرا.

Bootstrap چیست؟?

توسعه بوت استرپ توسط مارک اتو و جیکوب تورنتون در توییتر به عنوان تلاش برای ایجاد یک ابزار داخلی آغاز شد – چارچوبی جدید برای تشویق سازگاری در میان ابزارهای داخلی در توییتر.

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

تیم اصلی Bootstrap در حال توسعه است و آخرین نسخه آن Bootstrap 3 است که در آگوست 2013 منتشر شد.

Bootstrap یک چارچوب HTML منبع آزاد ، CSS و JS با منبع آزاد است که حاوی قالب هایی برای متن ، فرم ها ، دکمه ها ، پیمایش و سایر مؤلفه های رابط مرتبط است..

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

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

Bootstrap را می توان در هر محیط توسعه یا ویرایشگر و هر فناوری و زبان سمت سرور ، از ASP.NET تا PHP گرفته تا Ruby on Rails استفاده کرد.

از آگوست سال 2015 ، مضامین رسمی Bootstrap برای خرید با پرداخت یکجا و مجوز چند کاره با بروزرسانی رایگان در دسترس است.

Bootstrap توسط توییتر دارای حق چاپ است ، اما تحت مجوز MIT منتشر می شود و به شما امکان می دهد از Bootstrap یا اجزای آن برای اهداف شخصی و تجاری استفاده و تغییر دهید..

ویژگی های بوت استرپ

Bootstrap با جدیدترین نسخه های مرورگرهای Google Chrome ، Mozilla Firefox ، Internet Explorer ، Opera و Safari سازگار است. برخی از این مرورگرها در همه سیستم عامل ها پشتیبانی نمی شوند.

شیوه نامه هایی که تعاریف سبک ابتدایی را برای کلیه مؤلفه های اصلی HTML ارائه می دهند ، با Bootstrap گنجانده شده اند و امکان سفارشی سازی آسان از ظاهر وب سایت را فراهم می کنند.

یکی از اصلی ترین ویژگی های Bootstrap ، سیستم شبکه سیال آن است که با توجه به اندازه صفحه ، می تواند تا 12 ستون مقیاس داشته باشد ، از دستگاه های تلفن همراه گرفته تا اندازه صفحه نمایش دسکتاپ و هر آنچه در این میان قرار دارد ، هم پرتره و هم جهت افقی..

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

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

برخی از این مؤلفه ها عملکرد عناصر واسط موجود را گسترش می دهند ، به عنوان مثال اضافه کردن یک عملکرد خودکار به طور کامل برای فیلدهای ورودی.

مزایای استفاده از Bootstrap

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

طبق گفته های کریستوفر گیمر Bootstrapbay ، پنج دلیل مهم برای استفاده از Bootstrap وجود دارد.

اولین, Bootstrap سرعت توسعه را افزایش می دهد. یكی از مهمترین مزایای بوت استرپ ، سرعت مطلق توسعه است.

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

ثانیا, بوت استرپ وب سایتهای آماده و دارای تلفن همراه آماده تولید می کند.

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

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

سوم, استفاده از بوت استرپ ، ثبات را تضمین می کند.

بوت استرپ در ابتدا برای تشویق سازگاری ساخته شد. بوت استرپ بدون در نظر گرفتن اینکه چه کسی روی پروژه کار می کند ، ثبات را تضمین می کند. علاوه بر این ، نتایج در بین سیستم عامل ها یکنواخت است ، بنابراین خروجی در مرورگرهای مختلف وب یکسان است.

چهارم, Bootstrap به راحتی قابل تنظیم است.

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

پنجم, پشتیبانی خوب.

با تشکر از جامعه و محبوبیت Bootstrap ، حمایت از آن خوب است. تیم اصلی Bootstrap نیز در انتشار به روزرسانی های به موقع خوب عمل کرده است و کار توسعه ادامه دارد. با توجه به محبوبیت آن ، ما انتظار نداریم به زودی این امر تغییر کند.

شروع کار با Bootstrap

اگر آمادگی یادگیری نحوه استفاده از Bootstrap را دارید ، اما با HTML و CSS آشنایی ندارید ، اولین قدم برای یادگیری Bootstrap ، یادگیری اصول HTML و CSS است.

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

با استفاده از Bootstrap می توانید کلاسهای CSS و JavaScript را در عناصر HTML خود اعمال کنید ، بنابراین باید CSS و HTML خوبی داشته باشید. خوشبختانه ، این مسئله برای توسعه دهندگان جدی نخواهد بود.

محیط توسعه بوت استرپ

پس از بارگیری و استخراج نسخه precompiled Bootstrap ، ساختار فایل Bootstrap را دریافت می کنید که بسیار ساده است. پرونده های بوت استرپ در سه دایرکتوری قرار می گیرند: css ، js و font.

این ساختار فایل کاملاً توضیحی است و شامل هر پروژه وب است. علاوه بر پرونده های آماده استفاده CSS و JS ، قلم های Glyphicons نیز با موضوع پیش فرض اختیاری Bootstrap گنجانده شده است..

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

منابع بوت استرپ

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

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

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

دوره های تعاملی رایگان

خواندن درباره نرم افزار و چارچوب ها می تواند مدل ها و قوانین اصلی استفاده را به شما نشان دهد ، اما برای اینکه احساس واقعی عملکرد چارچوب را بدست آورید ، باید آن را در عمل مشاهده کنید.

دوره های تعاملی رایگان آنلاین بهترین روش برای کسب احساس واقعی در مورد چگونگی عملکرد یک چارچوب و کارهایی است که می تواند انجام دهد.

این دوره ها دارای کامپایلر آنلاین هستند ، بنابراین می توانید نمونه ها را بلافاصله اجرا و مشاهده کنید:

  • اصول اولیه Bootstrap را در آموزش Codecademy بررسی کنید. این یک آموزش کوتاه مبتدی است که شما را از طریق HTML اساسی ، CSS و افزودن بوت استرپ به وب سایت شما راهنمایی می کند. این آموزش نحو اصلی Bootstrap را با کامپایلر آنلاین آن نشان می دهد.
  • W3Schools Bootstrap 3 Tutorial یک راهنمای گام به گام جامع و بسیار جامع با یک مرجع کامل Bootstrap در مورد کلیه کلاس ها ، مؤلفه ها و افزونه های JavaScript است..
  • Tutorialspoint Bootstrap آموزش بسیار مفصلی است ، تقریباً هر آنچه را که باید در مورد Bootstrap بدانید ، از Bootstrap CSS ، اجزای چیدمان ، پلاگین ها ، نسخه ی نمایشی و منابع مفید را پوشش می دهد. این آموزش Bootstrap همچنین دارای یک کامپایلر آنلاین است و به صورت بارگیری PDF نیز در دسترس است.

این دوره های تعاملی باید درک کافی از بوت استرپ به شما بدهد تا بدون دردسر زیاد شروع به استفاده از آن در پروژه های خود کنید..

نسخه های نمایشی و منابع اضافی

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

به همین دلیل است که ما آن انتخاب را به تیم اصلی Bootstrap واگذار خواهیم کرد و نمایشگاه رسمی Bootstrap Expo را با نمونه های زیبا و الهام بخش از Bootstrap برای شما آورده ایم..

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

اگر آماده استفاده از Bootstrap هستید و به منابع مفید دیگری برای پروژه های خود نیاز دارید ، برخی از موارد زیر را بررسی کنید:

  • مضامین رسمی Bootstrap از سازندگان Bootstrap
  • بازارهای دارای تم و قالب های بوت استرپ تجاری ، حق بیمه ، تجاری: creativemarket.com ، wrapbootstrap.com ، themeforest.net
  • قالب ها و مضامین بوت استرپ رایگان: startbootstrap.com ، shapebootstrap.net ، bootstrapzero.com.

البته بسیاری از منابع بوت استرپ بصورت آنلاین نیز موجود است و جامعه بطور منظم در موارد جدیدی مشارکت می کند ، بنابراین پیدا کردن آنچه شما نیاز دارید نباید مشکلی باشد.

کتابهای الکترونیکی و شومیز

منابع آنلاین زیادی برای بوت استرپ در دسترس است ، اما اگر کتاب یا کتاب الکترونیکی را ترجیح می دهید ، انتخاب محدود است.

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

اگر متون و کتابهای فیزیکی را ترجیح می دهید ، در اینجا برخی از متون Bootstrap موجود است:

  • قدم به قدم Bootstrap 3: یک راهنمای سریع برای توسعه وب پاسخگو با استفاده از Bootstrap 3 توسط Riwanto Megosinarso یک راهنمای گام به گام واقعی برای مبتدیان است. توصیه می شود اگر کاملاً تازه به Bootstrap باشید و به اندازه کافی برای شروع کار آن را پوشش دهید.
  • پرش شروع بوت استرپ توسط سید فاضل رحمان برای مبتدیان و توسعه دهندگان میانی مناسب است و همه چیز مورد نیاز را برای اجرای Bootstrap به صفحه وب خود پوشش می دهد.
  • Bootstrap Site Blueprints توسط دیوید کوکران و ایان ویتلی برای مبتدی برای توسعه دهندگان انتهایی جلویی نوشته شده است. پوشش مناسب از شخصی سازی قطعات و طرح بندی های Bootstrap.

هر سه مورد نیز به صورت کتاب الکترونیکی برای کیندل در دسترس هستند.

پیوندهای مهم

  • بوت استرپ
  • Bootstrap در GitHub.
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me