آموزش دوره کرش توسعه قالب با بوت استرپ 4 بوت کمپ
Crash Course on Template Development with Bootstrap 4 Bootcamp
چرا باید از Bootstrap 4 استفاده کنید؟
بیایید صادق باشیم، ایجاد یک الگو واقعا سخت است، به خصوص اگر نیاز به ایجاد الگویی داشته باشید که با تمام اندازه های مختلف صفحه کار کند. از مرورگرهای دسکتاپ گرفته تا تبلت ها و دستگاه های تلفن همراه. می تواند وحشتناک باشد، اما استفاده از بوت استرپ زندگی را آسان تر می کند.
اشکالات بین مرورگر کمتری دارد
این یک چارچوب سازگار است که از تمام مرورگرها و اصلاحات سازگاری CSS پشتیبانی می‌کند
سبک و قابل تنظیم
ساختارها و سبک های پاسخگو
چند افزونه جاوا اسکریپت با استفاده از jQuery
اسناد خوب و پشتیبانی انجمن
انبوهی از الگوهای رایگان و حرفه ای
و مورد علاقه من، سیستم شبکه ای عالی دارد
از طریق این دوره، نحوه استفاده از Bootstrap 4 را به شما نشان خواهم داد و می‌توانید آن را سفارشی کنید.
________________________________________________________________________________
چرا سیستم شبکه بسیار مهم است؟
سیستم شبکه بوت استرپ برای چیدمان، به‌ویژه طرح‌بندی‌های پاسخگو استفاده می‌شود. درک نحوه کارکرد آن برای درک Bootstrap حیاتی است. Grid از گروه بندی ستون های ردیف در داخل 1 یا چند کانتینر تشکیل شده است.
در کلاس بعدی، یک نمای کلی از نحوه عملکرد سیستم شبکه ارائه خواهم کرد
_________________________________________________________________________________________________________________________________________________
معرفی SASS یا SCSS
در این بخش، من قصد دارم توضیح دهم که SASS چیست و چه مواردی در این بخش پوشش داده خواهد شد
________________________________________________________________________________________________________________________________________________
SASS یا SCSS چیست؟
SCSS اساساً فقط یک CSS عالی و پویاتر است
Sass مخفف عبارت Syntactically Awesome Stylesheet است
Sass یک برنامه افزودنی برای CSS است
Sass یک پیش پردازشگر CSS است، اساساً به این معنی است که فایل scss را می گیرد و آن را به یک فایل css معمولی تبدیل می کند.
Sass کاملاً با تمام نسخه‌های CSS سازگار است
Sass تکرار CSS را کاهش می دهد و در نتیجه در زمان صرفه جویی می کند
Sass برای دانلود و استفاده رایگان است
چرا از Sass استفاده کنیم؟
Stylesheets بزرگ‌تر، پیچیده‌تر و نگهداری آنها سخت‌تر می‌شود. اینجاست که یک پیش پردازنده CSS می تواند کمک کند.
Sass به شما امکان می‌دهد از ویژگی‌هایی استفاده کنید که در CSS وجود ندارند، مانند متغیرها، قوانین تودرتو، میکس‌ها، واردات، وراثت، توابع داخلی و موارد دیگر
چرا از این با بوت استرپ استفاده کنیم؟
اگر می خواهید طرح رنگ را در Bootstrap تغییر دهید، به عنوان مثال تغییر رنگ های اصلی و ثانویه، SASS راهی برای انجام این کار به راحتی خواهد بود.
قبل از شروع هر پروژه آنلاین، ابتدا باید یک الگو برای آن در HTML و CSS ایجاد کنید.
این بخش می تواند واقعاً دردناک باشد، به خصوص اگر شما بچه ها مجبور باشید آن را در هر دستگاهی پاسخگو کنید.
Bootstrap 4 زندگی را آسان‌تر و قدرتمندتر از همیشه می‌کند!
در این دوره، نحوه استفاده از بوت استرپ و نحوه استفاده از آن را به نفع خود به شما دوستان آموزش خواهم داد.
من به شما نشان خواهم داد که چگونه یک وب سایت اولیه در HTML بسازید، و چگونه قالب بندی در Bootstrap کار می کند.
همچنین با گذشت زمان، محتوای بیشتری را در این دوره بارگذاری خواهم کرد.
اسم من گریت ورمولن است
من از سال 2009 در توسعه آنلاین هستم و از سال 2016 از bootstrap 4 استفاده می کنم
امیدواریم از این دوره لذت ببرید.
بیایید صادق باشیم، ایجاد یک الگو واقعاً سخت است، به خصوص اگر نیاز به ایجاد الگویی داشته باشید که با تمام اندازه های مختلف صفحه کار کند. از مرورگرهای دسکتاپ گرفته تا تبلت ها و دستگاه های تلفن همراه. این می تواند وحشتناک باشد، اما استفاده از بوت استرپ زندگی را آسان تر می کند.
درس ها Lessons
-
مقداری محتوا به وب سایت اضافه کنید Add some content to the website
-
SASS چیست (scss) What is SASS (scss)
-
تمرین 1 - ساخت یک فرم سفارش محصول بوت استرپ ساده Exercise 1 - building a simple bootstrap product ordering form
-
سیستم شبکه و ظرف The Grid System & container
-
افست سیستم شبکه Grid system offset
-
مقدمه Introduction
-
راه حل - صفحه ثبت نام با بوت استرپ 4 Solution - Registration page with Bootstrap 4
-
راه حل - صفحه محصولات با بوت استرپ 4 Solution - Products page with Bootstrap 4
-
اضافه کردن پاورقی Adding a footer
-
Navbar - مهمترین بخش وب سایت Navbar - most important part of website
-
نقاط شکست Break points
-
مقدمه ای بر مستندات بوت استرپ 4 Introduction to bootstrap 4 documentation
-
چرا سیستم گرید مهم است؟ Why is the Grid system important
-
تشکیل می دهد Forms
-
تایپوگرافی Typography
-
کد ویژوال استودیو Visual Studio Code
-
چرا باید از Bootstrap 4 استفاده کنید؟ Why should you use Bootstrap 4?
-
اولین الگوی hello world خود را با بوت استرپ تنظیم کنید Set up your first hello world template with bootstrap
-
نوار لغزنده در صفحه اصلی Slider on Homepage
-
کامپایل CSS سفارشی Compiling the custom CSS
-
جامبوترون Jumbotron
-
چگونه بوت استرپ را به قالب html خود اضافه کنید - CDN How to include Bootstrap to your html template - CDN
-
NPM را نصب کنید Install NPM
-
طرح بندی سند پایه Basic document layout
-
راه حل - صفحه ورود با بوت استرپ 4 Solution - Login page with Bootstrap 4
-
بوت استرپ را از طریق NPM نصب کنید Install Bootstrap via NPM
-
اصولا خداحافظ Basically bye
-
امت Emmet
-
کوالا Koala
-
معین Modal
-
رنگ ها و دکمه ها Colors and buttons
-
تغییر رنگ های پیش فرض Changing the default colors
-
مقدمه ای بر تم بوت استرپ Introduction to bootstrap theming
-
راه حل - محصولات مدال با بوت استرپ 4 Solution - Products Modal with Bootstrap 4
Skillshare (اسکیل شیر)
اسکیل‌شر یک پلتفرم آموزشی آنلاین است که به میلیون‌ها افراد در سراسر جهان امکان یادگیری مهارت‌های جدید را فراهم می‌کند. این پلتفرم با ارائه دوره‌های متنوع در زمینه‌هایی از جمله هنر و طراحی، فناوری، کسب و کار، و زندگی موفق، به کاربران خود این امکان را می‌دهد تا به صورت آنلاین به یادگیری بپردازند.
یکی از ویژگی‌های منحصر به فرد سکیل‌شر، ارائه دوره‌های تدریس شده توسط صاحبان مهارت‌ها و افراد موفق در زمینه‌های مختلف است. این امر باعث می‌شود که کاربران از تجربیات و دانش عملی افرادی که در حوزه‌های مورد نظرشان موفق عمل کرده‌اند، بهره‌مند شوند و بهترین اطلاعات را برای بهبود مهارت‌های خود دریافت کنند. به این ترتیب، سکیل‌شر نه تنها یک پلتفرم آموزشی است، بلکه یک جامعه آموزشی است که افراد را به اشتراک گذاری دانش و تجربیات تشویق می‌کند و به آنها کمک می‌کند تا در مسیر پیشرفت و موفقیت خود ادامه دهند.
https://donyad.com/d/dfe9
Gerrit Vermeulen
توسعه دهنده نرم افزار
نمایش نظرات