آموزش Master Bootstrap 5 با 6 پروژه و سفارشی سازی Sass

Master Bootstrap 5 with 6 projects and Sass customization

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: به تمام بخش های Bootstrap 5 و سفارشی سازی با Sass با استفاده از آموزش کیت، تمرین های کدنویسی، آزمون ها و موارد دیگر تسلط داشته باشید. با نحوه ایجاد و استفاده از تمام 24 مؤلفه، 10 کمک کننده و 16 ابزار کمکی آخرین نسخه Bootstrap 5 از 3 اکتبر 2021 (نسخه 5.2.2) آشنا شوید. تمرین هایی با بیش از 200 تست خودکار در برابر کد شما یاد بگیرید چگونه بوت استرپ 5 را سفارشی کنید و گسترش دهید با Sass: گزینه های جهانی را تغییر دهید و رنگ، طرح، محتوا، فرم ها، اجزا، کمک کننده ها و ابزارهای کاربردی را سفارشی کنید. 3 اکتبر 2022) نحوه ایجاد طرح‌بندی‌های روان و واکنش‌گرا نحوه استفاده از نقاط شکست و سیستم شبکه نحوه ساختاربندی انواع محتوا نحوه ایجاد 6 پروژه مختلف واکنش‌گرا بهترین شیوه‌های دسترسی پیش نیازها: درک اولیه HTML یک ویرایشگر کد و یک مرورگر

درباره

بوت استرپ - محبوب ترین فریم ورک های فرانت اند در جهان!

این دوره تمام بخش‌های مختلف آخرین نسخه محبوب‌ترین فریم ورک فرانت‌اند جهان، Bootstrap 5.2.2 از ۷ اکتبر ۲۰۲۲ را پوشش می‌دهد. بوت استرپ در میلیون ها وب سایت در سراسر جهان استفاده شده است و به دقت توسعه داده شده است تا طیف گسترده ای از رابط های کاربری معمولی را پوشش دهد.

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

این دوره برای مبتدیانی است که می خواهند Bootstrap 5 را از پایین به بالا یاد بگیرند. از تمام بخش‌های مختلف می‌گذرد، اما هر سخنرانی را می‌توان به‌طور مستقل تماشا کرد.

پس از آشنایی با تمام بخش‌های مختلف، نحوه سفارشی‌سازی و گسترش Bootstrap 5 با Sass را خواهید آموخت. اول از همه، نحوه کامپایل Sass را با برنامه Koala به شما نشان می دهم و فایل های Bootstrap 5 Sass را به شما معرفی می کنم. سپس نمونه‌های زیادی را به شما نشان می‌دهم که چگونه می‌توانید بوت استرپ 5 را با تغییر گزینه‌های کلی و همچنین تغییر تنظیمات و سبک‌های رنگ، طرح‌بندی، محتوا، فرم‌ها، مؤلفه‌ها، راهنماها و ابزارهای کمکی سفارشی‌سازی و گسترش دهید.

در نهایت، نحوه ایجاد 6 پروژه مختلف با استفاده از Bootstrap 5 را به شما آموزش خواهم داد.

پروژه ها

آموزش ساخت پروژه های زیر با استفاده از Bootstrap 5:

  • پروژه 1: نمونه کارها

  • پروژه 2: رزومه و صفحه رزومه

  • پروژه 3: پایگاه دانش

  • پروژه 4: نظرسنجی

  • پروژه 5: صفحه فرود

  • پروژه 6: وب سایت کسب و کار کوچک

سبک یادگیری

بیشتر از سخنرانی های ویدیویی

علاوه بر سخنرانی‌های ویدیویی، این دوره شامل انواع مواد آموزشی زیر است:

  • Bootstrap 5 Learning Kit:
    فایل ZIP قابل دانلود که به صورت آفلاین کار می کند. بیش از 200 فایل منبع گنجانده شده است.
    یک کیت آموزشی ساخته شده سفارشی با کد منبع برای همه بخش‌های Bootstrap 5. دارای یک بخش مرجع با مثال‌های فراوان، یک بخش تمرین است که می‌توانید هنگام یادگیری در مورد Bootstrap 5 از آن استفاده کنید، و یک صفحه نمایش بخش برای کدنویسی همراه با اسکرین‌کست‌های من. می توانید کد منبع را مستقیماً در مرورگر مشاهده کنید، آن را در کلیپ بورد کپی کنید و هر نمونه را مستقیماً به یک CodePen جدید صادر کنید.

  • 38 تمرین کدنویسی:
    بیش از 200 تست خودکار در برابر کد شما. این یکی از بهترین راه‌ها برای یادگیری نحوه کدنویسی است - بدون نیاز به دانلود یا نصب.

  • 5 آزمون
    دانش خود را در پایان هر بخش با شرکت در آزمون های چند گزینه ای آزمایش کنید

چرا این دوره؟

چرا این دوره به جای سایر دوره های بوت استرپ؟

نمی‌دانید چرا باید این دوره را به جای سایر دوره‌های Bootstrap انتخاب کنید؟ این دوره دارای ویژگی های زیر است که آن را در بین بقیه برجسته می کند:

  • به روز با آخرین نسخه بوت استرپ 5 از 3 اکتبر 2022 : نسخه 5.2.2

  • ویژگی‌های بیشتر و مواد آموزشی اضافی از جمله تمرین‌های کدنویسی، آزمون‌ها و یک کیت یادگیری سفارشی

  • 2 ساعت و 40 سخنرانی آموزش سفارشی کردن و گسترش Bootstrap 5 با Sass

  • بیشتر سخنرانی ها را می توان مستقل از یکدیگر تماشا کرد

  • با بیش از 300 ساعت کار اختصاصی با دقت ساخته شده است

به روز رسانی های آتی

در به‌روزرسانی بعدی در اوایل سال 2023، نحوه ایجاد پروژه‌های مختلف مختلف با استفاده از Bootstrap 5 را به شما آموزش می‌دهم. شما یاد خواهید گرفت که چگونه پروژه های زیر را بسازید:

  • وبلاگ

  • تالار گفتمان آنلاین

  • وب سایت تجارت الکترونیک

  • ... و موارد دیگر در آینده

من همچنین فعالیت‌های تمرینی بیشتری مانند تمرین‌های کدنویسی، آزمون‌ها و موارد دیگر را اضافه خواهم کرد.

گواهینامه ها

حرف من را قبول نکنید - آنچه دانش آموزان دیگر در مورد این دوره می گویند را بخوانید:

او واقعا کارآمد است و مطالب واقعاً به خوبی ارائه شده است. من نسبت به این دوره احساس خوبی دارم.
Mica M.

دوره عالی!
کن مک کلین

یک مرور عالی از همه ویژگی‌های راه‌انداز همچنان به عنوان مرجع استفاده می‌شود.
الیوت اریکسون

دوره بسیار خوبی است. Bootstrap UI Kit و پروژه ها ارزش زیادی دارند. با تشکر!
ساندرو ماسارانی

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

من دوست دارم که در سند همراه کار کنید و در طول درس ها تست های کوچک داشته باشید. درک محتوا آسان تر است.
– جورج سیزینسکی

این دوره عالی و درست است
– اسلام مصطفی ابوهاشم

کیت یادگیری این دوره را شگفت انگیز می کند. این قطعا به درک شما از چارچوب بوت استرپ کمک خواهد کرد.
– Damien Alleyne

ژپه تلاش زیادی کرد تا مطمئن شود دانش‌آموزانش همه چیزهایی را که برای این دوره نیاز دارند دارند. کیت یادگیری و کیت سفارشی سازی ابزارهای نهایی برای یادگیری Bootstrap 5 هستند. من همیشه از آنها برای مرجع در آینده استفاده خواهم کرد. با تشکر آقای Schaumburg Jensen. من از دوره شما بسیار لذت بردم.
– Michael G. Haight

تا کنون، یکی از بهترین دوره های آموزشی Udemy. از تک تک آن لذت بردم. با جزئیات، واضح، و پر از ابزارهای قدرتمند و کد منبع، این بهترین دوره برنامه نویسی در Bootstrap - دست پایین است.
– عبدالرحمن شاتو

این یک دوره عالی است که همه چیزهایی را که باید در مورد بوت استرپ 5 بدانید به شما می آموزد.
– Erik Tangvik

توضیح بسیار واضح.
– هندریک یان جاگر

دوره نگاهی عمیق به Bootstrap CSS است. مواد مرجع عالی است (به خودی خود ارزش دوره را دارد).
– Almeida Carlos Ferreira Unipessoal, Lda

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

من این دوره را به دلیل جریان طبیعی مطالب بسیار دوست داشتم
– دکتر ندیم حسین سونت

به خوبی ارائه شده و نسبت به قیمت آن واقعاً خوب است.
– جان جیمز برک

من تحت تأثیر قرار گرفتم. اطلاعات مفیدی که در دوره رقیب ارائه نشده است، باعث درک بهتر می شود.
– پاملا پیرس

یک منبع عالی برای Bootstrap 5. من به Jeppe نامه نوشتم و خیلی سریع پاسخ دریافت کردم. من واقعاً آن را توصیه می کنم.
– Ayşe Keloğlu

خوب است. دانش عمیقی کسب کردم.
– Sanu K

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

من یک معلم و متخصص سابق هستم و می توانم با قدردانی بگویم که این دوره بسیار خوبی است، با آموزش های واضح، جامع و عملی، به علاوه تمرین ها و مراجع بسیار مفید. معیار کلیدی: آیا در حال یادگیری هستم؟ پاسخ بله و با سرعت خوب!! با تشکر از شما برای کلاس به روز و عالی. ارزش بیش از پنج ستاره را دارد.
– دیوید استراکر

مقدمه ای عالی برای بوت استرپ! همه چیز به خوبی توضیح داده شده است
– Borgar Stensrud

یک دوره کاربردی و بسیار واضح، منابعی که مربی در آن قرار داده است، ارزش افزوده واقعی را ارائه می دهد و به شما امکان می دهد بوت استرپ را به روشی بسیار حرفه ای یاد بگیرید. اگر می خواهید نحوه استفاده از این چارچوب را بیاموزید، خرید کنید
– Loucas

من اولین وب سایت حرفه ای خود را بعد از این دوره فقط با بوت استرپ انجام دادم.
– Robert Ouimet

دقیقاً همان چیزی است که من برای شروع استفاده از چارچوب Bootstrap برای توسعه صفحات وب خود نیاز دارم.
– Ed Schultz

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

منبع شگفت انگیز برای یادگیری بوت استرپ
- Gustav Frisholm

بسیار عالی است که می بینم چگونه می توان از بوت استرپ استفاده کرد!
– استفان هوکسما

دوره عالی!
– هکتور سانچز

بسیار عالی است که می بینم چگونه می توان از بوت استرپ استفاده کرد!
– رولی کولبی

جزئیات بسیار خوب و بسیار خوب توضیح داده شده است!
– Querino Anschau Junior

بله، خیلی خوب است. (...) در کل این دوره بسیار خوب و بسیار آموزنده بوده است!
– بنجامین هریسون

دوره عالی. خیلی یاد گرفت. متشکرم.
– تیم مارکل

Très bon cours, pour l'instant tout est est :)
– Eric Dekams


سرفصل ها و درس ها

معرفی Introduction

  • در مورد دوره About the course

  • آشنایی با بوت استرپ 5 Understanding Bootstrap 5

  • قالب های شروع کننده Starter templates

  • کیت آموزشی بوت استرپ 5 Bootstrap 5 Learning Kit

معرفی Introduction

  • در مورد دوره About the course

  • آشنایی با بوت استرپ 5 Understanding Bootstrap 5

  • دانلود و نصب بوت استرپ 5 Downloading and installing Bootstrap 5

  • دانلود و نصب بوت استرپ 5 Downloading and installing Bootstrap 5

  • قالب های شروع کننده Starter templates

  • راهنمای شرکت در این دوره Guide to taking this course

  • راهنمای شرکت در این دوره Guide to taking this course

  • کیت آموزشی بوت استرپ 5 Bootstrap 5 Learning Kit

  • درباره بوت استرپ About Bootstrap

  • درباره بوت استرپ About Bootstrap

چیدمان Layout

  • ظرف Container

  • توری Grid

  • ستون ها Columns

  • ناودان Gutters

  • درباره چیدمان About layout

چیدمان Layout

  • در مورد این بخش About this section

  • درک چیدمان Understanding layout

  • درک چیدمان Understanding layout

  • ظرف Container

  • ظرف Container

  • ظرف Container

  • ظرف مایع Fluid container

  • ظرف مایع Fluid container

  • توری Grid

  • ستون ها Columns

  • ناودان Gutters

  • درباره چیدمان About layout

محتوا Content

  • در مورد این بخش About this section

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

  • عناصر متن درون خطی Inline text elements

  • تصاویر Images

  • تصاویر Images

  • ارقام Figures

  • ارقام Figures

  • درباره محتوا About content

محتوا Content

  • در مورد این بخش About this section

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

  • سرفصل های معمولی Normal headings

  • سرفصل های معمولی Normal headings

  • عناصر متن درون خطی Inline text elements

  • لیست ها Lists

  • لیست ها Lists

  • تصاویر Images

  • تصاویر Images

  • جداول Tables

  • جداول Tables

  • ارقام Figures

  • ارقام Figures

  • درباره محتوا About content

تشکیل می دهد Forms

  • در مورد این بخش About this section

  • کنترل فرم Form control

  • انتخاب کنید Select

  • چک و رادیو Checks and radios

  • گروه ورودی Input group

  • چیدمان Layout

  • اعتبار سنجی Validation

تشکیل می دهد Forms

  • در مورد این بخش About this section

  • بررسی اجمالی Overview

  • کنترل فرم Form control

  • انتخاب کنید Select

  • چک و رادیو Checks and radios

  • دامنه Range

  • دامنه Range

  • گروه ورودی Input group

  • برچسب های شناور Floating labels

  • برچسب های شناور Floating labels

  • چیدمان Layout

  • اعتبار سنجی Validation

اجزاء Components

  • در مورد این بخش About this section

  • هشدار موفقیت Success alert

  • هشدار با پیوند منطبق Alert with matching link

  • هشدار با محتوای اضافی Alert with additional content

  • نشان پیش فرض Default badge

  • نشان قرص Pill badge

  • خرده نان Breadcrumb

  • خرده نان Breadcrumb

  • دکمه ها Buttons

  • دکمه ها Buttons

  • گروه دکمه Button group

  • چرخ فلک Carousel

  • دکمه بستن Close button

  • سقوط - فروپاشی Collapse

  • کشویی Dropdowns

  • گروه لیست List group

  • آف بوم Offcanvas

  • متغیرهای Placeholders

  • پاپاورها Popovers

  • پیش رفتن Progress

  • Scrollspy Scrollspy

  • اسپینرها Spinners

  • نان تست Toasts

  • راهنمای ابزار استاندارد Standard tooltip

اجزاء Components

  • در مورد این بخش About this section

  • آکاردئون Accordion

  • آکاردئون Accordion

  • هشدارها Alerts

  • هشدارها Alerts

  • هشدار موفقیت Success alert

  • هشدار با پیوند منطبق Alert with matching link

  • هشدار با محتوای اضافی Alert with additional content

  • هشدار قابل رد Dismissible alert

  • هشدار قابل رد Dismissible alert

  • نشان Badge

  • نشان Badge

  • نشان پیش فرض Default badge

  • نشان قرص Pill badge

  • خرده نان Breadcrumb

  • خرده نان Breadcrumb

  • خرده نان Breadcrumb

  • خرده نان Breadcrumb

  • دکمه ها Buttons

  • دکمه ها Buttons

  • دکمه ها Buttons

  • دکمه ها Buttons

  • گروه دکمه Button group

  • کارت Card

  • کارت Card

  • چرخ فلک Carousel

  • دکمه بستن Close button

  • دکمه بستن Close button

  • دکمه بستن Close button

  • سقوط - فروپاشی Collapse

  • کشویی Dropdowns

  • گروه لیست List group

  • مدال Modal

  • مدال Modal

  • Navs و Tab Navs and tabs

  • Navs و Tab Navs and tabs

  • نوار ناوبری Navbar

  • نوار ناوبری Navbar

  • آف بوم Offcanvas

  • صفحه بندی Pagination

  • صفحه بندی Pagination

  • متغیرهای Placeholders

  • پاپاورها Popovers

  • پاپاور استاندارد Standard popover

  • پاپاور استاندارد Standard popover

  • تغییرات Popover Popover variations

  • تغییرات Popover Popover variations

  • پیش رفتن Progress

  • پیش رفتن Progress

  • پیش رفتن Progress

  • Scrollspy Scrollspy

  • اسپینرها Spinners

  • نان تست Toasts

  • نکات ابزار Tooltips

  • نکات ابزار Tooltips

  • راهنمای ابزار استاندارد Standard tooltip

  • تغییرات راهنمای ابزار Tooltip variations

  • تغییرات راهنمای ابزار Tooltip variations

  • در مورد اجزاء About components

  • در مورد اجزاء About components

یاوران Helpers

  • در مورد این بخش About this section

  • روشن کنید Clearfix

  • روشن کنید Clearfix

  • رنگ و پس زمینه Color and background

  • لینک های رنگی Colored links

  • لینک های رنگی Colored links

  • نسبت Ratio

  • نسبت Ratio

  • پشته ها Stacks

  • بصری پنهان است Visually hidden

  • بصری پنهان قابل تمرکز Visually hidden focusable

  • کوتاه کردن متن Text truncation

یاوران Helpers

  • در مورد این بخش About this section

  • روشن کنید Clearfix

  • روشن کنید Clearfix

  • رنگ و پس زمینه Color and background

  • لینک های رنگی Colored links

  • لینک های رنگی Colored links

  • نسبت Ratio

  • نسبت Ratio

  • نسبت Ratio

  • نسبت Ratio

  • موقعیت Position

  • موقعیت یاری دهندگان Position helpers

  • موقعیت یاری دهندگان Position helpers

  • پشته ها Stacks

  • بصری پنهان است Visually hidden

  • بصری پنهان است Visually hidden

  • بصری پنهان است Visually hidden

  • بصری پنهان قابل تمرکز Visually hidden focusable

  • پیوند کشیده Stretched link

  • پیوند کشیده Stretched link

  • کوتاه کردن متن Text truncation

  • قاعده عمودی Vertical rule

  • قاعده عمودی Vertical rule

خدمات رفاهی Utilities

  • در مورد این بخش About this section

  • مرز ها Borders

  • مرز ها Borders

  • رنگ متن Text color

  • نمایش دادن Display

  • نمایش دادن Display

  • شناور Float

  • فعل و انفعالات Interactions

  • موقعیت Position

  • فاصله گذاری Spacing

  • تراز عمودی Vertical align

  • دید Visibility

  • دید Visibility

  • در مورد آب و برق About utilities

خدمات رفاهی Utilities

  • در مورد این بخش About this section

  • زمینه Background

  • زمینه Background

  • رنگ پس زمینه Background color

  • رنگ پس زمینه Background color

  • مرز ها Borders

  • مرز ها Borders

  • شعاع مرزی Border-radius

  • شعاع مرزی Border-radius

  • رنگ ها Colors

  • رنگ ها Colors

  • رنگ متن Text color

  • نمایش دادن Display

  • نمایش دادن Display

  • فلکس Flex

  • فلکس Flex

  • شناور Float

  • شناور Float

  • شناور Float

  • فعل و انفعالات Interactions

  • کدورت Opacity

  • کدورت Opacity

  • سرریز Overflow

  • سرریز Overflow

  • موقعیت Position

  • موقعیت Position

  • سایه ها Shadows

  • سایه ها Shadows

  • سایز بندی Sizing

  • سایز بندی Sizing

  • اندازه - عرض Sizing - width

  • اندازه - عرض Sizing - width

  • اندازه - ارتفاع Sizing - height

  • اندازه - ارتفاع Sizing - height

  • فاصله گذاری Spacing

  • فاصله گذاری Spacing

  • فاصله گذاری Spacing

  • متن Text

  • متن Text

  • تراز عمودی Vertical align

  • تراز عمودی Vertical align

  • تراز عمودی Vertical align

  • دید Visibility

  • دید Visibility

  • در مورد آب و برق About utilities

سفارشی کردن بوت استرپ 5 Customizing Bootstrap 5

  • در مورد این بخش About this section

  • برنامه Scout به عنوان جایگزین برنامه Koala Scout App as alternative to Koala App

  • مقدمه ای بر فایل های Bootstrap Sass Introduction to the Bootstrap Sass files

  • واردات و کامپایل پیش فرض Default import and compilation

  • گزینه های جهانی: سایه جعبه Global options: Box shadow

  • گزینه های جهانی: ابزارهای مهم Global options: Important utilities

  • رنگ ها: رنگ های تم را حذف کنید Colors: Remove from theme colors

  • چیدمان: ظرف Layout: Container

  • محتوا: ارقام Content: Figures

  • اجزاء: چرخ فلک Components: Carousel

  • اجزاء: مدال Components: Modal

  • اجزاء: پیشرفت Components: Progress

  • اجزاء: اسپینرها Components: Spinners

  • امکانات: موقعیت Utilities: Position

  • امکانات: فاصله Utilities: Spacing

  • Utility API Utility API

سفارشی کردن بوت استرپ 5 Customizing Bootstrap 5

  • در مورد این بخش About this section

  • در مورد این بخش About this section

  • کامپایل Sass با اپلیکیشن کوالا Compiling Sass with Koala App

  • کامپایل Sass با اپلیکیشن کوالا Compiling Sass with Koala App

  • برنامه Scout به عنوان جایگزین برنامه Koala Scout App as alternative to Koala App

  • مقدمه ای بر فایل های Bootstrap Sass Introduction to the Bootstrap Sass files

  • واردات و کامپایل پیش فرض Default import and compilation

  • گزینه های جهانی: Spacer Global options: Spacer

  • گزینه های جهانی: Spacer Global options: Spacer

  • گزینه های جهانی: شعاع مرزی Global options: Border radius

  • گزینه های جهانی: شعاع مرزی Global options: Border radius

  • گزینه های جهانی: سایه جعبه Global options: Box shadow

  • گزینه های جهانی: گرادیان ها Global options: Gradients

  • گزینه های جهانی: گرادیان ها Global options: Gradients

  • گزینه های جهانی: انتقال Global options: Transitions

  • گزینه های جهانی: انتقال Global options: Transitions

  • گزینه های جهانی: Caret Global options: Caret

  • گزینه های جهانی: Caret Global options: Caret

  • گزینه های جهانی: نشانگرهای دکمه Global options: Button pointers

  • گزینه های جهانی: نشانگرهای دکمه Global options: Button pointers

  • گزینه های جهانی: نمادهای اعتبارسنجی Global options: Validation icons

  • گزینه های جهانی: نمادهای اعتبارسنجی Global options: Validation icons

  • گزینه های جهانی: حاشیه های منفی Global options: Negative margins

  • گزینه های جهانی: حاشیه های منفی Global options: Negative margins

  • گزینه های جهانی: ابزارهای مهم Global options: Important utilities

  • رنگ ها: نمای کلی رنگ ها Colors: Colors overview

  • رنگ ها: نمای کلی رنگ ها Colors: Colors overview

  • رنگ ها: رنگ ها را به تم اضافه کنید Colors: Add to theme colors

  • رنگ ها: رنگ ها را به تم اضافه کنید Colors: Add to theme colors

  • رنگ ها: رنگ های تم را حذف کنید Colors: Remove from theme colors

  • رنگ ها: تعریف پالت رنگ Colors: Defining color palette

  • رنگ ها: تعریف پالت رنگ Colors: Defining color palette

  • چیدمان: نقاط شکست Layout: Breakpoints

  • چیدمان: نقاط شکست Layout: Breakpoints

  • چیدمان: ظرف Layout: Container

  • چیدمان: شبکه Layout: Grid

  • چیدمان: شبکه Layout: Grid

  • محتوا: ارقام Content: Figures

  • محتوا: تصاویر Content: Images

  • محتوا: تصاویر Content: Images

  • محتوا: جداول Content: Tables

  • محتوا: جداول Content: Tables

  • مطلب: تایپوگرافی Content: Typograhy

  • مطلب: تایپوگرافی Content: Typograhy

  • فرم ها: محدوده Forms: Range

  • فرم ها: محدوده Forms: Range

  • اجزای تشکیل دهنده: آرد سوخاری Components: Breadcrumb

  • اجزای تشکیل دهنده: آرد سوخاری Components: Breadcrumb

  • اجزاء: کارت Components: Card

  • اجزاء: کارت Components: Card

  • اجزاء: چرخ فلک Components: Carousel

  • اجزاء: مدال Components: Modal

  • اجزاء: پیشرفت Components: Progress

  • اجزاء: اسپینرها Components: Spinners

  • یاوران: نسبت Helpers: Ratio

  • یاوران: نسبت Helpers: Ratio

  • امکانات: مرزها Utilities: Borders

  • امکانات: مرزها Utilities: Borders

  • امکانات: موقعیت Utilities: Position

  • امکانات: اندازه Utilities: Sizing

  • امکانات: اندازه Utilities: Sizing

  • امکانات: فاصله Utilities: Spacing

  • Utility API Utility API

سایر موضوعات و ویژگی ها Other topics and features

سایر موضوعات و ویژگی ها Other topics and features

  • آیکون های بوت استرپ Bootstrap Icons

  • آیکون های بوت استرپ Bootstrap Icons

مقدمه ای بر پروژه ها Introduction to Projects

  • پروژه 1: نمونه کارها Project 1: Portfolio

  • پروژه 3: پایگاه دانش Project 3: Knowledge Base

  • نحوه استفاده از منابع پروژه How to use the project resources

  • به روز نگه داشتن پروژه ها Keeping projects up to date

  • پلاگین های مورد استفاده در پروژه ها Plugins used in the projects

  • دانلود و نصب Font Awesome Downloading and installing Font Awesome

مقدمه ای بر پروژه ها Introduction to Projects

  • پروژه 1: نمونه کارها Project 1: Portfolio

  • پروژه 2: رزومه و صفحه رزومه Project 2: Resume and CV Page

  • پروژه 2: رزومه و صفحه رزومه Project 2: Resume and CV Page

  • پروژه 3: پایگاه دانش Project 3: Knowledge Base

  • پروژه 4: نظرسنجی Project 4: Survey

  • پروژه 4: نظرسنجی Project 4: Survey

  • پروژه 5: صفحه فرود Project 5: Landing Page

  • پروژه 5: صفحه فرود Project 5: Landing Page

  • پروژه 6: وب سایت مشاغل کوچک Project 6: Small Business Website

  • پروژه 6: وب سایت مشاغل کوچک Project 6: Small Business Website

  • نحوه استفاده از منابع پروژه How to use the project resources

  • به روز نگه داشتن پروژه ها Keeping projects up to date

  • پلاگین های مورد استفاده در پروژه ها Plugins used in the projects

  • دانلود و نصب Font Awesome Downloading and installing Font Awesome

پروژه 1: نمونه کارها Project 1: Portfolio

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • فهرست - گواهینامه ها Index - Testimonials

  • فهرست - تماس Index - Contact

  • فهرست - پاورقی Index - Footer

  • بررسی اجمالی Overview

  • مورد - پروژه های مرتبط Item - Related Projects

پروژه 1: نمونه کارها Project 1: Portfolio

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه پورفولیو About the Porfolio Project

  • درباره پروژه پورفولیو About the Porfolio Project

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • کد به روز شده برای این پروژه Updated code for this project

  • فهرست - نوار ناوبری Index - Navbar

  • فهرست - نوار ناوبری Index - Navbar

  • فهرست - درباره Index - About

  • فهرست - درباره Index - About

  • فهرست - پروژه های ویژه Index - Featured Projects

  • فهرست - پروژه های ویژه Index - Featured Projects

  • فهرست - گواهینامه ها Index - Testimonials

  • فهرست - تماس Index - Contact

  • فهرست - پاورقی Index - Footer

  • بررسی اجمالی Overview

  • بررسی اجمالی Overview

  • مورد - سرفصل پروژه Item - Project Heading

  • مورد - سرفصل پروژه Item - Project Heading

  • مورد - پروژه چرخ فلک Item - Project Carousel

  • مورد - پروژه چرخ فلک Item - Project Carousel

  • مورد - شرح پروژه Item - Project Description

  • مورد - شرح پروژه Item - Project Description

  • مورد - پروژه های مرتبط Item - Related Projects

پروژه 2: رزومه و صفحه رزومه Project 2: Resume and CV Page

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه رزومه و صفحه رزومه About the Resume and CV Page Project

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • معرفی Introduction

  • تحصیلات Education

  • گواهینامه ها Testimonials

  • نمونه کارها Portfolio

پروژه 2: رزومه و صفحه رزومه Project 2: Resume and CV Page

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه رزومه و صفحه رزومه About the Resume and CV Page Project

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • معرفی Introduction

  • تجربه کاری Work Experience

  • تجربه کاری Work Experience

  • تحصیلات Education

  • گواهینامه ها Testimonials

  • اطلاعات تماس Contact Info

  • اطلاعات تماس Contact Info

  • نمونه کارها Portfolio

  • مهارت ها Skills

  • مهارت ها Skills

پروژه 3: پایگاه دانش Project 3: Knowledge Base

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه دانش بنیان About the Knowledge Base Project

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • فهرست - ناوبری Index - Navigation

  • فهرست - جستجو Index - Search

  • فهرست - مقالات Index - Articles

  • فهرست - دسته ها Index - Categories

  • فهرست - پاورقی Index - Footer

  • دسته - جستجو و خرده نان Category - Search and Breadcrumb

  • دسته - پیمایش صفحه Category - Page Navigation

  • دسته - اصلی Category - Main

  • مقاله - برجسته JS Article - Highlight JS

  • مقاله - بازخورد Article - Feedback

پروژه 3: پایگاه دانش Project 3: Knowledge Base

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه دانش بنیان About the Knowledge Base Project

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • فهرست - ناوبری Index - Navigation

  • فهرست - جستجو Index - Search

  • فهرست - مقالات Index - Articles

  • فهرست - دسته ها Index - Categories

  • فهرست - پاورقی Index - Footer

  • فهرست - پاورقی Index - Footer

  • دسته - جستجو و خرده نان Category - Search and Breadcrumb

  • دسته - پیمایش صفحه Category - Page Navigation

  • دسته - اصلی Category - Main

  • دسته - به کنار Category - Aside

  • دسته - به کنار Category - Aside

  • دسته - اسکرول صاف Category - Smooth Scroll

  • دسته - اسکرول صاف Category - Smooth Scroll

  • مقاله - جستجو و خرده نان Article - Search and Breadcrumb

  • مقاله - جستجو و خرده نان Article - Search and Breadcrumb

  • مقاله - پیمایش صفحه Article - Page Navigation

  • مقاله - پیمایش صفحه Article - Page Navigation

  • مقاله - محتوا Article - Content

  • مقاله - محتوا Article - Content

  • مقاله - برجسته JS Article - Highlight JS

  • مقاله - بازخورد Article - Feedback

  • مقاله - به کنار Article - Aside

  • مقاله - به کنار Article - Aside

پروژه 4: نظرسنجی Project 4: Survey

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه نظرسنجی About the Survey Project

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • فهرست - اطلاعات شخصی Index - Personal Info

  • فهرست - چک باکس پاسخ Index - Answer Checkbox

  • فهرست - جاوا اسکریپت سفارشی Index - Custom JavaScript

  • نتایج - درصد Results - Percentages

  • نتایج - توزیع پاسخ Results - Answer Distribution

پروژه 4: نظرسنجی Project 4: Survey

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه نظرسنجی About the Survey Project

  • منابع پروژه Project Resources

  • منابع پروژه Project Resources

  • کد به روز شده برای این پروژه Updated code for this project

  • کد به روز شده برای این پروژه Updated code for this project

  • فهرست - پیمایش برگه Index - Tab Navigation

  • فهرست - پیمایش برگه Index - Tab Navigation

  • فهرست - اطلاعات شخصی Index - Personal Info

  • فهرست - پاسخ رادیو Index - Answer Radio

  • فهرست - پاسخ رادیو Index - Answer Radio

  • فهرست - چک باکس پاسخ Index - Answer Checkbox

  • فهرست - رادیو رتبه بندی Index - Rating Radio

  • فهرست - رادیو رتبه بندی Index - Rating Radio

  • فهرست - تغییر رتبه Index - Rating Toggle

  • فهرست - تغییر رتبه Index - Rating Toggle

  • شاخص - محدوده رتبه بندی Index - Rating Range

  • شاخص - محدوده رتبه بندی Index - Rating Range

  • فهرست - جاوا اسکریپت سفارشی Index - Custom JavaScript

  • نتایج - درصد Results - Percentages

  • نتایج - توزیع پاسخ Results - Answer Distribution

  • نتایج - رتبه بندی Results - Ratings

  • نتایج - رتبه بندی Results - Ratings

پروژه 5: صفحه فرود Project 5: Landing Page

  • اسکرین شات از پروژه Screenshot of Project

  • منابع پروژه Project Resources

  • جهت یابی Navigation

  • قهرمان Hero

  • شرح Description

  • بررسی ها Reviews

  • خبرنامه Newsletter

  • پاورقی Footer

  • اسکرول صاف Smooth Scroll

پروژه 5: صفحه فرود Project 5: Landing Page

  • اسکرین شات از پروژه Screenshot of Project

  • اسکرین شات از پروژه Screenshot of Project

  • درباره پروژه صفحه فرود About the Landing Page Project

  • درباره پروژه صفحه فرود About the Landing Page Project

  • منابع پروژه Project Resources

  • جهت یابی Navigation

  • قهرمان Hero

  • شرح Description

  • تریلر Trailer

  • تریلر Trailer

  • ویترین Showcase

  • ویترین Showcase

  • امکانات Features

  • امکانات Features

  • قیمت گذاری Pricing

  • قیمت گذاری Pricing

  • بررسی ها Reviews

  • خبرنامه Newsletter

  • پاورقی Footer

  • اسکرول صاف Smooth Scroll

پروژه 6: وب سایت مشاغل کوچک Project 6: Small Business Website

  • منابع پروژه Project Resources

  • صفحه اصلی - قهرمان Home - Hero

  • صفحه اصلی - اخبار Home - News

  • صفحه اصلی - پاورقی Home - Footer

  • خدمات Services

  • درباره - داستان About - Story

  • درباره - مشتریان About - Clients

  • تماس - آدرس Contact - Address

  • تماس - ساعت Contact - Hours

  • تماس - پیام Contact - Message

  • تماس - نقشه Contact - Map

پروژه 6: وب سایت مشاغل کوچک Project 6: Small Business Website

  • اسکرین شات از پروژه Screenshot of the Project

  • اسکرین شات از پروژه Screenshot of the Project

  • درباره پروژه وب سایت مشاغل کوچک About the Small Business Website Project

  • درباره پروژه وب سایت مشاغل کوچک About the Small Business Website Project

  • منابع پروژه Project Resources

  • منابع پروژه Project Resources

  • صفحه اصلی - ناوبری Home - Navigation

  • صفحه اصلی - ناوبری Home - Navigation

  • صفحه اصلی - قهرمان Home - Hero

  • صفحه اصلی - هشدار Home - Alert

  • صفحه اصلی - هشدار Home - Alert

  • صفحه اصلی - چی Home - What

  • صفحه اصلی - چی Home - What

  • صفحه اصلی - اخبار Home - News

  • صفحه اصلی - پاورقی Home - Footer

  • خدمات Services

  • درباره - داستان About - Story

  • درباره - دفتر About - Office

  • درباره - دفتر About - Office

  • درباره - مشتریان About - Clients

  • تیم Team

  • تیم Team

  • تماس - آدرس Contact - Address

  • تماس - ساعت Contact - Hours

  • تماس - پیام Contact - Message

  • تماس - نقشه Contact - Map

پروژه 7: انجمن Project 7: Forum

  • درباره پروژه انجمن About the Forum Project

  • فهرست - فهرست تابلو Index - Board index

  • شاخص - به کنار Index - Aside

  • فهرست - پاورقی Index - Footer

  • دسته بندی انجمن - ناوبری Forum category - Navigation

  • نام انجمن - هیئت مدیره Forum name - Board

  • نام انجمن - فیلتر و مرتب کنید Forum name - Filter and sort

  • نام انجمن - موضوع جدید Forum name - New topic

پروژه 7: انجمن Project 7: Forum

  • درباره پروژه انجمن About the Forum Project

  • فهرست - ناوبری Index - Navigation

  • فهرست - ناوبری Index - Navigation

  • فهرست - فهرست تابلو Index - Board index

  • شاخص - به کنار Index - Aside

  • فهرست - پاورقی Index - Footer

  • فهرست - پاورقی Index - Footer

  • دسته بندی انجمن - ناوبری Forum category - Navigation

  • دسته انجمن - هیئت مدیره Forum category - Board

  • دسته انجمن - هیئت مدیره Forum category - Board

  • نام انجمن - ناوبری Forum name - Navigation

  • نام انجمن - ناوبری Forum name - Navigation

  • نام انجمن - هیئت مدیره Forum name - Board

  • نام انجمن - صفحه بندی Forum name - Pagination

  • نام انجمن - صفحه بندی Forum name - Pagination

  • نام انجمن - فیلتر و مرتب کنید Forum name - Filter and sort

  • نام انجمن - موضوع جدید Forum name - New topic

نمایش نظرات

آموزش Master Bootstrap 5 با 6 پروژه و سفارشی سازی Sass
جزییات دوره
22 hours
235
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
5,514
4.4 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Jeppe Schaumburg Jensen Jeppe Schaumburg Jensen

مهندس ارشد نرم افزار و نویسنده منتشر شده