تسلط به فریمورک فلکس‌باکس - یک راهنمای جامع

معرفی
سرفصل

✅ سرفصل و جزئیات آموزش

آنچه یاد خواهید گرفت:

ساخت یک فریمورک فلکس‌باکس از ابتدا
ویژگی‌های کانتینر فلکس: ‏flex-direction ،flex-wrap ،justify-content و align-items
ویژگی‌های آیتم‌های فلکس: ‏order ،flex-grow ،flex-shrink، flex-basis و align-self
بررسی عمیق گزینه‌های justify-content: ‏flex-start ،flex-end ،center، space-between و space-around
استفاده از مدیا کوئری‌ها در کنار ویژگی‌های فلکس‌باکس برای طرح بندی های پویا
استفاده از کانتینرهای فلکس تودرتو برای طرح بندی های پیشرفته
استفاده از فلکس‌باکس برای وسط‌چینی عمودی و افقی

پیش‌نیازهای دوره

شما باید درک اولیه‌ای از HTML و CSS داشته باشید.
یک ویرایشگر کد مانند Sublime Text یا VS Code - مدرس از VS Code استفاده خواهد کرد.
اشتیاق برای یادگیری گام به گام یک موضوع جدید

توضیحات دوره

به دوره «تسلط به فریمورک فلکس‌باکس - یک راهنمای جامع» خوش آمدید! این دوره برای توسعه‌دهندگان و طراحان وب طراحی شده است که می‌خواهند به فلکس‌باکس در CSS مسلط شوند؛ یک مدل طرح بندی قدرتمند که امکان طراحی وب واکنش‌گرا و انعطاف‌پذیر را فراهم می‌کند. در پایان این دوره، شما درک کاملی از فلکس‌باکس خواهید داشت که به شما امکان می‌دهد به راحتی طرح بندی های پیشرفته بسازید و فریمورک فلکس‌باکس خود را ایجاد کنید.

پس از اتمام این دوره، دانشجویان قادر خواهند بود:

درک مفاهیم اصلی فلکس‌باکس: به درک کاملی از مفاهیم بنیادی فلکس‌باکس، از جمله محورهای اصلی و متقاطع، کانتینرهای فلکس و آیتم‌های فلکس دست یابید.
پیاده‌سازی طرح بندی های فلکس‌باکس: با استفاده از ویژگی‌های فلکس‌باکس، طرح بندی های انعطاف‌پذیر و واکنش گرا برای وب اپلیکیشن‌ها و وب‌سایت‌ها ایجاد کنید.
اعمال ویژگی‌های فلکس‌باکس: به ویژگی‌های مختلف فلکس‌باکس، از جمله flex-direction ،justify-content ،align-items و غیره مسلط شوید.
توسعه پروژه‌های عملی: مفاهیم آموخته‌شده را از طریق پروژه‌های عملی که سناریوهای دنیای واقعی را شبیه‌سازی می‌کنند، اعمال کنید.
بهبود واکنش‌گرایی: با استفاده از فلکس‌باکس، تکنیک‌های طراحی واکنشگرا را برای اطمینان از نمایش عالی وب‌سایت‌ها در همه دستگاه‌ها پیاده‌سازی کنید.
ادغام با سایر تکنیک‌های CSS: درک کنید که فلکس‌باکس چگونه در کنار سایر متدولوژی‌های CSS کار می‌کند.

در این دوره، شما به موارد زیر مسلط خواهید شد:

درک کانتینر فلکس

تعریف یک کانتینر فلکس با استفاده از display مانند flex
ویژگی‌های کانتینر فلکس: flex-direction ،flex-wrap ،justify-content و align-items

درک آیتم‌های فلکس

آشنایی با آیتم‌های فلکس و ویژگی‌های آن‌ها
ویژگی‌های آیتم‌های فلکس: flex-grow ،flex-shrink ،flex-basis و align-self

تراز کردن و توزیع فضا

بررسی عمیق گزینه‌های justify-content: ‏flex-start ،flex-end ،center، space-between و space-around
نگاهی دقیق به align-items و align-content

ایجاد طرح بندی های پیچیده

استفاده از کانتینرهای فلکس تودرتو برای طرح بندی های پیشرفته
استفاده از فلکس‌باکس برای وسط‌چینی عمودی و افقی

طراحی واکنشگرا با فلکس‌باکس

تکنیک‌هایی برای ساخت طرح بندی های های واکنشگرا که با اندازه‌های مختلف صفحه نمایش سازگار هستند.
استفاده از مدیا کوئری‌ها در کنار ویژگی‌های فلکس‌باکس برای طرح بندی های های پویا و واکنشگرا

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

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