آموزش بوت استرپ 5 از ابتدا - ساخت 5 وب سایت مدرن [ویدئو]

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

شروع شدن Getting Started

• به دوره خوش آمدید Welcome To The Course

• به دوره خوش آمدید Welcome To The Course

• بررسی اجمالی پروژه ها Projects Overview

• بررسی اجمالی پروژه ها Projects Overview

• بوت استرپ چیست؟ What Is Bootstrap?

• بوت استرپ چیست؟ What Is Bootstrap?

• نحوه استفاده از بوت استرپ How To Use Bootstrap

• نحوه استفاده از بوت استرپ How To Use Bootstrap

• تنظیم اولیه محیط Basic Environment Setup

• تنظیم اولیه محیط Basic Environment Setup

• راه اندازی Bootstrap Sandbox Bootstrap Sandbox Setup

• راه اندازی Bootstrap Sandbox Bootstrap Sandbox Setup

اصول بوت استرپ - قسمت 1 Bootstrap Fundamentals - Part 1

• ظروف Containers

• ظروف Containers

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

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

• نمایش و موقعیت Display & Position

• نمایش و موقعیت Display & Position

• رنگ های پس زمینه و متن Background & Text Colors

• رنگ های پس زمینه و متن Background & Text Colors

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

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

• اندازه، مرزها و سایه ها Sizing, Borders & Shadows

• اندازه، مرزها و سایه ها Sizing, Borders & Shadows

• نقاط شکست Breakpoints

• نقاط شکست Breakpoints

• دکمه ها Buttons

• دکمه ها Buttons

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

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

• حالت تاریک و متغیرها Dark Mode & Variables

• حالت تاریک و متغیرها Dark Mode & Variables

اصول بوت استرپ - قسمت 1 Bootstrap Fundamentals - Part 1

اصول بوت استرپ - قسمت 2 Bootstrap Fundamentals - Part 2

• Bootstrap Grid & Columns Bootstrap Grid & Columns

• Bootstrap Grid & Columns Bootstrap Grid & Columns

• کلاس های فلکس باکس Flexbox Classes

• کلاس های فلکس باکس Flexbox Classes

• کارت ها Cards

• کارت ها Cards

• لیست گروه ها و نشان ها List Groups & Badges

• لیست گروه ها و نشان ها List Groups & Badges

• فرم ها و ورودی Forms & Input

• فرم ها و ورودی Forms & Input

• اعتبار سنجی و نمایش فرم Form Validation & Display

• اعتبار سنجی و نمایش فرم Form Validation & Display

• هشدارها و نوارهای پیشرفت Alerts & Progress Bars

• هشدارها و نوارهای پیشرفت Alerts & Progress Bars

• جداول Tables

• جداول Tables

• خرده نان و صفحه بندی Breadcrumbs & Pagination

• خرده نان و صفحه بندی Breadcrumbs & Pagination

• سایر ابزارهای CSS Other CSS Utilities

• سایر ابزارهای CSS Other CSS Utilities

اصول بوت استرپ - قسمت 2 Bootstrap Fundamentals - Part 2

اجزای پویا جاوا اسکریپت Dynamic JavaScript Components

• کشویی Dropdowns

• کشویی Dropdowns

• آکاردئون و فروپاشی Accordions & Collapse

• آکاردئون و فروپاشی Accordions & Collapse

• چرخ فلک Carousel

• چرخ فلک Carousel

• اعلان نان تست Toast Notification

• اعلان نان تست Toast Notification

• اسپینرها Spinners

• اسپینرها Spinners

• مدال ها Modals

• مدال ها Modals

• پاپاورها و نکات ابزار Popovers & Tooltips

• پاپاورها و نکات ابزار Popovers & Tooltips

• حالت تاریک را تغییر دهید Dark mode Toggle

• حالت تاریک را تغییر دهید Dark mode Toggle

اجزای پویا جاوا اسکریپت Dynamic JavaScript Components

چالش های مینی پروژه Mini-Project Challenges

• مقدمه و مینی پروژه شروع کننده Intro & Mini-Project Starter

• مقدمه و مینی پروژه شروع کننده Intro & Mini-Project Starter

• کارت های قیمت گذاری Pricing Cards

• کارت های قیمت گذاری Pricing Cards

• جزء رتبه بندی Ratings Component

• جزء رتبه بندی Ratings Component

• فهرست کاربران User List

• فهرست کاربران User List

چالش های مینی پروژه Mini-Project Challenges

قالب سفارشی Sass Workflow & Starter Custom Sass Workflow & Starter Template

• ساس چیست؟ What Is Sass?

• ساس چیست؟ What Is Sass?

• Sass را نصب و راه اندازی کنید Install & Setup Sass

• Sass را نصب و راه اندازی کنید Install & Setup Sass

• نصب، راه اندازی و سفارشی کردن بوت استرپ Install, Setup & Customize Bootstrap

• نصب، راه اندازی و سفارشی کردن بوت استرپ Install, Setup & Customize Bootstrap

• نصب و راه اندازی فونت عالی Install & Setup Font Awesome

• نصب و راه اندازی فونت عالی Install & Setup Font Awesome

قالب سفارشی Sass Workflow & Starter Custom Sass Workflow & Starter Template

وب سایت 1 - وب سایت کتاب الکترونیکی Website 1 - eBook Website

• معرفی پروژه Project Intro

• معرفی پروژه Project Intro

• راه اندازی پروژه Project Setup

• راه اندازی پروژه Project Setup

• متغیرهای ناوبری و Sass Navigation & Sass Variables

• متغیرهای ناوبری و Sass Navigation & Sass Variables

• بخش هدر/قهرمان Header/Hero Section

• بخش هدر/قهرمان Header/Hero Section

• بخش آیکون Icon Section

• بخش آیکون Icon Section

• جلوه پیمایش نوار نوار Navbar Scroll Effect

• جلوه پیمایش نوار نوار Navbar Scroll Effect

• جزئیات بخش با مدال Details Sections With Modals

• جزئیات بخش با مدال Details Sections With Modals

• توصیفات، بخش دانلود و پاورقی Testimonials, Download Section & Footer

• توصیفات، بخش دانلود و پاورقی Testimonials, Download Section & Footer

• صفحه تماس Contact Page

• صفحه تماس Contact Page

• استقرار در Vercel Deploy To Vercel

• استقرار در Vercel Deploy To Vercel

• Formspree برای فرم های تماس Formspree For Contact Forms

• Formspree برای فرم های تماس Formspree For Contact Forms

وب سایت 1 - وب سایت کتاب الکترونیکی Website 1 - eBook Website

وب سایت 2 - وب سایت آموزش کورسو Website 2 - Corso Training Website

• معرفی پروژه Project Intro

• معرفی پروژه Project Intro

• راه اندازی پروژه Project Setup

• راه اندازی پروژه Project Setup

• Nav & Header Nav & Header

• Nav & Header Nav & Header

• چرخ فلک تصویر Image Carousel

• چرخ فلک تصویر Image Carousel

• منطقه ثبت نام، پیمایش پیمایش و جزئیات Register Area, Nav Scroll & Details

• منطقه ثبت نام، پیمایش پیمایش و جزئیات Register Area, Nav Scroll & Details

• نکات و بخش های خلاصه Points & Summary Sections

• نکات و بخش های خلاصه Points & Summary Sections

• دعوتنامه و غذای آماده Invitation & Takeaways

• دعوتنامه و غذای آماده Invitation & Takeaways

• اشتراک و پاورقی Subscribe & Footer

• اشتراک و پاورقی Subscribe & Footer

وب سایت 2 - وب سایت آموزش کورسو Website 2 - Corso Training Website

وب سایت 3 - وب سایت نمونه کارها Website 3 - Portfolio Website

• معرفی پروژه Project Intro

• معرفی پروژه Project Intro

• راه اندازی پروژه Project Setup

• راه اندازی پروژه Project Setup

• هدر با پوشش Header With Overlay

• هدر با پوشش Header With Overlay

• تایپ افکت جاوا اسکریپت Typing Effect JavaScript

• تایپ افکت جاوا اسکریپت Typing Effect JavaScript

• بخش‌های درباره و مهارت‌ها About & Skills Sections

• بخش‌های درباره و مهارت‌ها About & Skills Sections

• پروژه ها و لایت باکس Projects & Lightbox

• پروژه ها و لایت باکس Projects & Lightbox

• StyleShout و خدمات StyleShout & Services

• StyleShout و خدمات StyleShout & Services

• آمار و فرم ها Stats & Forms

• آمار و فرم ها Stats & Forms

• مستقر در Netlify Deploy To Netlify

• مستقر در Netlify Deploy To Netlify

وب سایت 3 - وب سایت نمونه کارها Website 3 - Portfolio Website

وب سایت 4 - طراحی دفتر یاوین Website 4 - Yavin Office Design

• معرفی پروژه Project Intro

• معرفی پروژه Project Intro

• راه اندازی پروژه Project Setup

• راه اندازی پروژه Project Setup

• ناوبری و سربرگ Navigation & Header

• ناوبری و سربرگ Navigation & Header

• آمار و افزایش جاوا اسکریپت Stats & JavaScript Increment

• آمار و افزایش جاوا اسکریپت Stats & JavaScript Increment

• مقدمه، جزئیات و خدمات Intro, Details & Services

• مقدمه، جزئیات و خدمات Intro, Details & Services

• 3 بخش میانی 3 Middle Sections

• 3 بخش میانی 3 Middle Sections

• پروژه ها و گواهینامه ها Projects & Testimonials

• پروژه ها و گواهینامه ها Projects & Testimonials

• فرم تماس و پاورقی Contact Form & Footer

• فرم تماس و پاورقی Contact Form & Footer

• دکمه بازگشت به بالا Back To Top Button

• دکمه بازگشت به بالا Back To Top Button

• صفحه مقاله داخلی Inner Article Page

• صفحه مقاله داخلی Inner Article Page

وب سایت 4 - طراحی دفتر یاوین Website 4 - Yavin Office Design

وب سایت 5 - راه حل های نرم افزاری ورا Website 5 - Vera Software Solutions

• معرفی پروژه Project Intro

• معرفی پروژه Project Intro

• راه اندازی پروژه Project Setup

• راه اندازی پروژه Project Setup

• سرصفحه و متن چرخشی اسکریپت Header & Rotating Text Script

• سرصفحه و متن چرخشی اسکریپت Header & Rotating Text Script

• شرکا و فرم Partners & Form

• شرکا و فرم Partners & Form

• پیمایش و راه حل ها Nav Scroll & Solutions

• پیمایش و راه حل ها Nav Scroll & Solutions

• جزئیات و تخصص Details & Expertise

• جزئیات و تخصص Details & Expertise

• بخش ویدیو و دکمه متحرک Video Section & Animated Button

• بخش ویدیو و دکمه متحرک Video Section & Animated Button

• حالت ویدیویی Video Modal

• حالت ویدیویی Video Modal

• قیمت گذاری و بخش های پروژه Pricing & Project Sections

• قیمت گذاری و بخش های پروژه Pricing & Project Sections

• مدال های پروژه Project Modals

• مدال های پروژه Project Modals

• بخش و پاورقی خبرنامه Newsletter Section & Footer

• بخش و پاورقی خبرنامه Newsletter Section & Footer

• صفحه حریم خصوصی Privacy Page

• صفحه حریم خصوصی Privacy Page

وب سایت 5 - راهکارهای نرم افزاری ورا Website 5 - Vera Software Solutions