دوره آموزش بوت استرپ (Bootstrap) مقدماتی تا پیشرفته - کد دوره: 123834

سرفصل‌ها
رایگان 00:14:48

بررسی فریم ورک بوت استرپ (Bootstrap)، ویژگی های بوت استرپ، چرا باید از بوت استرپ استفاده کنیم؟، مسیر یادگیری بوت استرپ (Bootstrap) چیست؟

نحوه نصب بوت استرپ فارسی (نسخه RTL) به همراه وابستگی popper.js و فایل‌های جاوا اسکریپت آن در این بخش ارائه می شود.

کار با Grid ها در بوت استرپ

3
00:12:16

معرفی Grid های ۱۲ تایی بوت استرپ به همراه کلاس های container و row و col به همراه ارائه مثال

معرفی breakpoint ها در بوت استرپ

4
00:10:51

بررسی ابعاد تجهیزات هوشمند مثل موبایل، تبلت، دسکتاپ و تلویزیون، معرفی کلاس‌های sm و md و lg و xl و xxl در بوت استرپ

کار با Gutters و Spacing

5
00:07:51

Gutters به عنوان یک معیار برای سنجش فاصله‌های بین دو ردیف می باشد. با استفاده از Spacing می توان دستورهای p و m که بیانگر padding و margin هستند را تعریف کرد.

مباحث تکمیلی و پیشرفته کار با ستون ها (Columns)

6
00:29:52

معرفی و کار با دستورهای col-* و clearfix، کار با ابزار ordering جهت ترتیب‌بندی ستون‌های یک ردیف، معرفی دستورهای align-items-start و align-items-center و align-items-end در بوت استرپ

تایپوگرافی یا Typography

7
00:23:56

معرفی تایپوگرافی متون و کار با تگ‌های h1 تا h6، کلاس های text-muted و text-truncate، ارائه کلاس lead و display جهت نمایش بهتر عبارت ها، بررسی لیست ها و کلاس های مرتبط با آن، کار با چپ چین و راست چین کردن جمله ها و پاراگراف ها در بوت استرپ

توضیحات دوره

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

چرا بوت استرپ (Bootstrap)؟

قبل از انتخاب هر فریم ورکی باید به سرعت توسعه و Community یا همان انجمن گفت و گوی آن بپردازید. اگر یک فریم ورک با سرعت بالایی توسعه پیدا کند قطعا امکانات و ویژگی های بهتری را در اختیار کاربر می گذارد. Community یا انجمن گفت و گو شرایطی را ایجاد می کند تا کاربر به پاسخ تمام سوالات خود برسد. بدون شک بوت استرپ یکی از برترین فریم‌ورک های CSS در دنیا بوده که در حال حاضر سهم بزرگی از بازار را به خود اختصاص داده است.

ما بوت استرپ (Boostrap) را یاد می گیریم که بتوانیم پروژه های خود را سریع تر از قبل کدنویسی و طراحی کنیم. بوت استرپ ابزارهای قدرتمند و رایگانی را در اختیار مخاطبانش قرار می دهد که پیاده سازی یک ساختار را که قبلا ساعت ها زمان می برد در کمتر از چند ثانیه انجام دهد. در ادامه برخی از ویژگی های کلیدی این فریم ورک را بررسی خواهیم کرد:

ویژگی های بوت استرپ (Bootstrap)

یادگیری بسیار راحت: از برترین ویژگی های این فریم ورک می توان به یادگیری سریع و بدون دردسر آن اشاره کرد. البته لازم به ذکر است که برای کار با این فریم ورک باید به زبان های HTML‌ و CSS مسلط باشید.

ساختار گرید منظم: Grid یا گرید به عنوان یکی از چارچوب های پروژه شناخته می شود که در بوت استرپ به یک صفحه با ۱۲ قسمت مساوی تقسیم شده و متناسب با سایز صفحه این گریدها تغییر می کند.

ابعاد و اندازه های استاندارد برای المان ها: در بوت استرپ (Bootstrap) تمام المان ها اعم از دکمه ها، متون، کدها، فرم ها، جداول، تصاویر و آیکن ها ساختار و ابعاد از پیش تعریف شده ای دارند که به شما کمک می کند در حین طراحی قالب یک سایت، به جزئیات دقت کمتری داشته باشید.

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

واکنش گرا: فریم ورک بوت استرپ از قابلیت واکنش گرا (Responsive) بهتره می برد و این ویژگی باعث می شود تا صفحات شما بدون هیچ مشکلی در تجهیزات دیگر مانند موبایل، تبلت و ... نمایش داده شود.

مستندات واضح: وب سایت بوت استرپ (Bootstrap) یکی از بهترین مستندات را درباره فریم ورک خود ارائه داده است که شما با مطالعه آن می توانید به تمام مشکلات خود پاسخ دهید.

مخاطب این دوره چه کسانی هستند؟

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

سرفصل های دوره بوت استرپ (Bootstrap)

مقدمه و معرفی

  • بررسی مقدماتی بوت استرپ (Bootstrap)
  • بررسی دلایل انتخاب یک فریم ورک CSS
  • معرفی مسیر یادگیری طراحی UI و UX یک وب سایت

نصب و راه اندازی اولیه

  • پیاده سازی یک پروژه بوت استرپ از صفر
  • راه اندازی فایل های جانبی CSS و JS
  • دانلود بوت استرپ فارسی از وب سایت مرجع
  • نوشتن اولین کد با استفاده از HTML‌ و CSS در قالب بوت استرپ

گریدها (Bootstrap Grid Systems)

  • معرفی Grid ها در بوت استرپ
  • کار با کلاس های container و row و col
  • معرفی breakpoint های یک grid

مباحث پیشرفته ستون‌ها (Columns)

  • کار با ستون‌های ترکیبی (col-sm و col-md و ...)
  • ترتیب‌بندی ستون‌های یک ردیف با کلاس order
  • آفست دادن به ستون های یک ردیف با کلاس offset
  • جهت دادن به ستون های یک ردیف با کلاس های align-items-start و align-items-center و align-item-end
  • قرار دادن ستون ها در یک ردیف مجزا بدون استفاده از کلاس row
  • معرفی عبارت clearfix در CSS و کار با کلاس clearfix

Gutters و Spacing

  • معرفی Gutters در بوت استرپ
  • معرفی Spacing در بوت استرپ به همراه اعداد و spacer ها
  • معرفی Notation ها یا نمادهای p و m و x و y و استفاده ترکیبی آنها با spacer ها

تایپوگرافی (Typography)

  • معرفی تایپوگرافی در بوت استرپ
  • بررسی تگ های h1 و h2 و h3 و h4 و h5 و h6
  • استفاده از کلاس text-muted
  • کار با کلاس‌های display-1 و display-2 و display-3 و display-4 و display-5 و display-6
  • بررسی کلاس lead
  • معرفی کلاس های مرتب با متون توکار مثل هایلایت، زیر خط دار، خط زدن متن، بولد کردن و ...
  • کار با نقل قول ها یا Blockquotes
  • معرفی Alignment یا جهت گیری در بوت استرپ به همراه بررسی کلاس های text-center و text-left و text-right و text-end
  • کار با لیست ها (Lists) و کلاس list-unstyled و list-inline و list-inline-item
  • کار با کلاس text-truncate جهت برش متون
افزودن به سبد خرید
24% 130000
99000 تومان
کارما دریافت 25 کارما با شرکت در این دوره
استفاده بیش از یک نفر از این محصول غیرقانونی و از لحاظ شرعی حرام می‌باشد.
میزان پیشرفت دوره:
٪9
0 نفر
شرکت کرده‌اند
2 نظر
ثبت شده است
امتیاز (1 رای)
تاریخ انتشار:
1399-12-5
وضعیت دوره:
در حال برگزاری
تعداد جلسات:
7
مدت زمان:
01:52:30
حجم کل:
گیگابایت
سطح:
تمام سطوح
مسعود صالحی
مدرس: مسعود صالحی
1218 کارما
بیش از ۲ سال عضویت در روکسو بیش از ۲ سال عضویت در روکسو
دارای 1000 کارما دارای 1000 کارما
دارای 10 پاسخ صحیح دارای 10 پاسخ صحیح
ارسال کننده پاسخ با 25 رای ارسال کننده پاسخ با 25 رای

دیدگاه‌های شما (2 دیدگاه)

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

mohammadcom761@gmail.com
محمد شهریارپناه
09 اسفند 1399
سلام ، جناب صالحی برای ساخت یه پنل ادمین در بک اند با بوت استرپ این دوره کفایت می کنه ؟

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

مسعود صالحی
مسعود صالحی
10 اسفند 1399
سلام، بله این دوره صفر تا صد بوت استرپ را شامل می شود و پس از گذراندن آن نیاز به دوره یا منبع دیگری نیست.

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

omidrayaneh@gmail.com
omid sadeghi
08 اسفند 1399
ممنون از دوره جدیدتون D:

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

پیگیری مطالب جذاب و تخفیف‌ها

اینستاگرام روکسو تلگرام روکسو ایمیل و خبرنامه روکسو