ابزارهای فلکس باکس

ابزارهای فلکس باکس

این روزها بازار کار با Flexbox داغ شده است و تا هنوز Grid در بین مرورگرها در جایگاه خوبی برای پشتیبانی قرار نگرفته است, فلکس باکس تازنده میدان است.

از آنجا که پربازدیدترین مطلب این وب سایت تا زمان نوشتن این مطلب flexbox بوده است, تصمیم گرفتم تا مطلبی برای معرفی ابزارهایی که به یادگیری آن کمک می کنند و همینطور ابزارهایی که سرعت کار با این ماژول را افزایش می دهند را معرفی کنم.

قبل از بررسی ابزارها اگر با این روش صفحه آرایی آشنایی ندارید بهتر است تا نگاهی به مطلب مربوط به آن داشته باشید.

 

تست و یادگیری

ابزارهای زیر برای یادگیری و تست ویژگی های فلکس باکس طراحی شده اند:

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

 

الگوها

در این آدرس شما به منبعی دسترسی دارید که الگوهایی مثل هدر سایت, منوی ساده, کارت ها و غیره با فلکس باکس طراحی شده اند و در آینده به آنها اضافه می شود و صد البته که شما هم می توانید در پروژه متن باز آن در گیتهاب به گسترش آنها کمک کنید:

در مطلب زیر نیز طراحی دو الگو قدم به قدم صورت گرفته است و کد نیز موجود است:

 

بازی با فلکسی

بازی با ریاضی یادتونه؟ 🙂

عاشق بازی های زیر خواهید شد که بسیار جالب برای به خاطر سپردن و درک بهتر ویژگی های فلکس باکس طراحی شده اند:

حتی بازی استراتژیک هم داریم 🙂

 

کد تقلب

اگر دنبال این هستید تا با ویژگی ها فلکس باکس در چند دقیقه به سرعت هر چه تمام تر آشنا شوید کافی است به مطلب فوق العاده زیر سر بزنید:

 

پلیفیل ها (polyfills)

برای اینکه بتوانید از فلکس باکس در مرورگرهایی مثل اینترنت اکسپلورر 8 و 9 هم استفاده کنید, پلیفیل هایی زیر در دسترس هستند:

 

کمک به توسعه فلکس باکس

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

همینطور راه حل مشکلات معرفی شده نیز در اینجا مطرح شده است:

 

فلکسی قول

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

 

  • Reza.M

    بسیار عالی بود و باتوجه به فلکسی قول قطعا خیلی بهترهم خواهد شد.
    امروز روز توست…
    …روزت مبارک استاد گرامی.

  • آمنه

    مرسی فلکسی قول :))