10 بهترین چارچوب CSS برای توسعه دهندگان Front-End

من یک بار یک شوخی توسعه دهنده جلویی را شنیدم ، “ناسا روبات هایی را در مریخ به زمین زده است ، و در اینجا ما هنوز در تلاش هستیم تا شکاف های خود را مرتب کنیم!” و باعث می شود احساس بدی کنم که این شوخی حقیقت زیادی در آن دارد. انجام کاری که به نظر می رسد آسان و عقل محور به نظر می رسد همانطور که می توانید جعبه ای را درون یک جعبه قرار دهید ، کار با CSS بسیار دشوار است. مگر اینکه قبلاً با آن روبرو شده باشید. و قطعه کد را در جایی ذخیره کرد. و حتی اگر شما می توانید آن را بکشید ، همیشه این نگرانی هولناک است که فقط ممکن است در بعضی از مرورگرهای احمقانه به طرز وحشتناکی شکسته شود! CSS برای اولین بار از “شرارت های لازم وب” به همراه JavaScript پیوند می خورد. این یک استاندارد است که به طرز حیرت انگیزی تکامل یافته است ، توسط تولید کنندگان مختلف مرورگر متفاوت تفسیر شده است ، و اکنون چنان پر از تناقضات است که هیچ کس جرات نمی کند خود را “CSS متخصص” بنامد..


پس جای تعجبی نیست که چارچوبهای CSS به مرور زمان ظهور کردند و بیشتر درد آنها را از بین بردند. امروز ما نمی توانیم رمزگذاری را بدون چارچوب CSS مورد علاقه خود تصور کنیم ، زیرا هدف قرار دادن اندازه های مختلف صفحه نمایش یک ضرورت است.

اما چگونه می دانید چارچوب شما برای کار مناسب بهترین است؟ همچنین ، اگر تازه به توسعه جلوی خود دسترسی پیدا کنید ، کدام یک از چارچوبها باید به شما کمک کند انتخاب کنید?

این پست نگاهی گسترده به چشم انداز توسعه جلویی می اندازد و دونده های جلو را در میان چارچوب های CSS مقایسه می کند. بنابراین اگر از قوانین CSS برای برنامه نویسی دست خسته شده اید ، برای تسکین سریع فرو بروید!

بوت استرپ

ابتکار عمل توسط توییتر, بوت استرپ اعتبار برای معرفی طراحی پاسخگو در مقیاس بزرگ اعتبار می گیرد. این اولین چارچوب برای ترویج فلسفه “همراه اول” بود. دیگر برای طراحی اندازه های صفحه نمایش کوچکتر یک پروژه جداگانه طراحی نمی شد. تنها کاری که شما باید انجام دهید این بود که شامل کلاس های مربوط به Bootstrap بود ، و طراحی به طور خودکار برای اندازه های مختلف صفحه نمایش تنظیم می شود (خوب ، تقریبا).

طراحی پاسخگو در Bootstrap (4.0 در مقابل 3.0)

Bootstrap با معرفی ایده شبکه ، به طراحی پاسخگوئی دست یافت. شبکه یک پارتیشن نامرئی صفحه نمایش به ستون ها (همراه با عرض) است. به عنوان مثال ، اگر سه “جعبه” دارید می خواهید کنار هم روی صفحه های بزرگ قرار بگیرید ، اما به صورت عمودی در صفحه های کوچکتر ، این کاری است که شما می کنید:

یکی از سه ستون

یکی از سه ستون

یکی از سه ستون

نسخه محبوب فعلی Bootstrap 4 است که یک تعمیرات اساسی در سری 3.3 بود. نحو بالا نحوه رمزگذاری شما در Bootstrap 4 است که به ظرافت زیادی مدیون قدرت خام است Flexbox و سایر ویژگی های طرح مدرن که مستقیماً توسط مرورگرها پشتیبانی می شوند. در نسخه های پایین تر Bootstrap ، شبکه به عنوان کل 12 ستون تعریف شده است ، که منجر به کد هایی مانند

برای ایجاد یک div یک سوم از صفحه نمایش را در دستگاه های با اندازه بزرگ و نیمی از عرض در دستگاه های با اندازه متوسط ​​به خود اختصاص دهید. نحو اکنون بسیار دلپذیرتر است ، اگرچه نیاز به آشنایی با Flexbox دارد.

جوانب راه انداز

در مورد Bootstrap ، خصوصاً برای توسعه دهندگان کامل پشته چیزهای زیادی برای دوست داشتن وجود دارد:

  • نمونه سازی سریع: با استفاده از Bootstrap ، تقریباً نیازی به صرف فکر کردن در موقعیت یابی CSS و ناسازگاری مرورگر نیست. تمام موارد لازم برای نوشتن HTML و سپس استفاده از کلاسهای مناسب CSS باعث زنده ماندن پاسخگویی می شود.
  • اکوسیستم بزرگ: از امروز ، بوت استرپ بزرگترین اکوسیستم را در بین چارچوب های جلویی دارد. تعداد طرح های وب سایت ، مضامین ، پنل های مدیریتی ، مؤلفه های UI و غیره که با استفاده از Bootstrap ساخته شده اند ، حیرت انگیز است و بهتر می شود. برای مشاوران و شرکتهای تولیدی به طور یکسان ، این بدان معناست که کالاهای از پیش ساخته و پشتیبانی جامعه همیشه فراوان خواهد بود.
  • پشتیبانی شده توسط توییتر: روند نوظهور در منبع آزاد افزایش پروژه هایی است که توسط یک نهاد تجاری حمایت می شود. این نهادها در بیشتر مواقع غیر از این ، مشاغل سودآور را در حول پیشنهاد خود ایجاد می کنند. کوتلین (JetBrains), وردپرس (Automattic ، Inc.) ، Angular (Google) ، React (Facebook) و غیره ، نمونه هایی از این موارد هستند. وقتی یک پروژه توسط یک نهاد تأسیس شده پشتیبانی می شود و یک نمایش یک نفره نیست ، به جامعه (خصوصاً مشتریان شرکت) ایمان می دهد که این پروژه دارای یک نقشه راه روشن و آینده بلند مدت است..
  • مجموعه بزرگ قطعات: بوت استرپ تقریباً تمام اجزای UI را که احتمالاً به آنها احتیاج دارید ، خارج از جعبه است. پیمایش ، فرم ها ، کارت ها ، ماژول ها ، دکمه ها ، نشان ها ، میله های پیشرفت ، هشدارها. . . شما آن را نامگذاری می کنید ، و Bootstrap آن را دارد. برای بسیاری از شرکت ها ، این امر عملاً نیاز به داشتن تیم اختصاصی جلوی خود را کاهش می دهد.
  • پشتیبانی LESS و SASS: در میان چارچوب های CSS که بسیار محبوب است ، Bootstrap تنها موردی است که از LESS و SASS پشتیبانی می کند. بله ، می دانم ، شما از LESS استفاده نمی کنید (همانطور که هیچ یک از توسعه دهندگان احترام نمی گذارند ، درست است؟) ، اما سلام ، پروژه های عظیمی وجود دارد که به LESS اعتماد می کنند. البته ، شما می توانید فایلهای CSS ساده خود را انتخاب نکنید و بنویسید.

Bootstrap Cons

هيچ چيزي بدون قيمت نيست؟ خوب ، بوت استرپ نیز از این قاعده مستثنی نیست. با گذشت زمان ، بوت استرپ توسط طراحان و کارشناسان UI مورد آتش سوزی شدید قرار گرفته است. به همین دلیل است:

  • یکنواخت UX: واقعیت این است که Bootstrap در وب سایتهایی دارای چنین مجموعه بزرگی از نتایج داخلی است که کاملاً آشنا و کاملاً صادقانه به نظر می رسد ، کسل کننده است. شما فقط باید به سمت بالا بروید نمونه های رسمی تا ببینیم پیش فرض ها چقدر از یک چشم هستند. فقط جستجو کنید “همه وب سایت های راه انداز یکسان هستند” ، و می دانید منظورم چیست. ��
  • مشکلات سبک: Bootstrap همان چیزی است که ممکن است یک چارچوب عقیده در نظر گرفته شود. به عبارت دیگر ، ایده هایی در مورد چیدمان ها دارد و باعث می شود اگر می خواهید به گونه ای متفاوت رفتار کنید ، سخت کار کنید. نقاط ضعف پیش فرض CSS را برای عرض صفحه نمایش در نظر بگیرید: یک صفحه نمایش متوسط ​​برای Bootstrap سایتی است که از عرض دستگاه 768px شروع می شود. و اگر می خواهید مثلاً حد 600 پیکسل را هدف بگیرید ، چه می کنید؟ بسیار خوب، برایت آرزوی خوش شانسی می کنم! تقریباً با هر مؤلفه دیگر در بوت استراپ یکسان است: ردیف ها و ظروف دارای بالشتک پیش فرض خود هستند ، دکمه ها دارای رنگ ها و حاشیه هایی هستند که بسیار دشوار است تا بدون کار زیاد ، آنرا نادیده بگیرید و غیره.

خواستن استاد Bootstrap? اینو ببین دوره آنلاین توسط Brad Traversy.

پایه

اگر فن آوری دین بود ، بنیاد و بوت استرپ بچه های خون یکدیگرند. هیچ بحثی درباره چارچوب های مدرن CSS بدون ذکر بنیاد کامل نیست ، بنابراین در اینجا می رویم.

رئیس بنیاد شوید سایت اینترنتی, و شما نمی توانید کمک کنید اما خط مشروح را توجه کنید: “پیشرفته ترین چارچوب جلویی در جهان”. در نگاه اول ، به نظر می رسد یک ادعای بلند برای رفتن به یک کمپین بازاریابی است.

با این حال ، پیروان چارچوب بنیاد می دانند حداقل حقیقت در این مورد وجود دارد. بنیاد برای مطابقت طبیعی با چارچوب Rails ساخته شده است ، و بسیاری از اصول راهنمایی “مانند ذن” مانند Rails را می توان در محل کار مشاهده کرد.

به عنوان مثال ، اگر شما می خواهید یک ردیف است که شامل دو عنصر در صفحه نمایش های کوچک ، سه در متوسط ​​، و چهار در بزرگتر ، کد معادل در بنیاد مانند این است:

در مقایسه با نسخه های قبلی Bootstrap ، من این را بسیار شهودی و آسان برای حفظ آن می دانم. دیگر هیچ دوازده شبکه ستونی وجود ندارد و نمی دانید 4/12 چیست؟!

اگرچه بنیاد بسیار کمتر از Bootstrap محبوب است ، اما این یک راز تجارت برای بسیاری از توسعه دهندگان متخصص مقدم است.

مزایای چارچوب بنیاد

بنیاد از کلیه چارچوبهای CSS که می خواهیم در این مقاله مورد بررسی قرار دهیم ، ویژگیهای غیر معمول دارد:

  • ابزار کامل: از نظر فنی اشتباه است که بگوییم بنیاد یک چارچوب CSS است. منظور من این است ، اما این مجموعه به عنوان یک مجموعه بزرگ و مدولار ابزار ساخته شده است که هدف آن حل تقریباً انواع مشکلات جلویی است. پیشنهادات چارچوبی جداگانه ای برای وب سایت ها و ایمیل ها وجود دارد که به شدت برای حوزه های مربوطه بهینه شده اند. بنیاد همچنین با یک رابط خط فرمان (CLI) ارائه شده است ، که مانند موسیقی به گوش برنامه نویسان می رسد که برای کار با Webpack یا سایر بسته های ماژول استفاده می کنند..
  • انعطاف پذیری شدید: بر خلاف Bootstrap ، بنیاد ساخته شده است تا به توسعه دهنده جلویی کاملی روی UI های خود کنترل کند. در نتیجه ، بنیاد با تازه وارد احساس پیچیده و بسیار پیچیده ای خواهد کرد. با این حال ، دلیل این است که بنیاد هیچ زبانی را به شما مجبور نمی کند ، بلکه هدف این است که دقیقاً همان چیزی باشد که هست: یک چارچوب عالی CSS.
  • بیش از مؤلفه های UI: در حالی که بنیاد مجموعه معمول عناصر UI را دارد ، بسیار فراتر از خواست وظیفه است. توسعه دهندگان شامل یک سیستم تصویربرداری پیشرفته پیشرفته ، یک جزء جدول قیمت گذاری (بله ، مورد استفاده برای نشان دادن برنامه های مختلف قیمت گذاری) ، اعتبار سنجی فرم ، پشتیبانی از راست به چپ ، جاسازی های پاسخگو و موارد دیگر هستند. من می خواهم دوباره تأکید کنم که این کار بیش از حد برای اکثر وب سایت های ساده است ، اما برای سایت های بزرگ ، این یک پیشرفت است که توسعه دهندگان باتجربه تشخیص خواهند داد.
  • آموزش و مشاوره: اکنون ، در حالی که Bootstrap توسط توییتر ایجاد شده است ، یک پروژه جانبی و بخش بسیار کمی از تصویر کلی است. با این وجود ، شركت پشت بنیاد (ZURB) متعهد به استفاده ، توسعه و ترویج آن است. دوره های آموزشی و مشاوره حرفه ای برای مشتریان بزرگ ارائه می شود ، که برای شرکت هایی که هدف قرار دادن پروژه های عظیم هستند و حاضر به پرداخت آن هستند بسیار عالی است.

منفی چارچوب بنیاد

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

  • انجمن کوچک (er): جامعه بنیاد بسیار کوچکتر از Bootstrap است ، و اگر شما چیزی عجیب و غریب را امتحان می کنید و گیر می کنید ، شانس یافتن کمک های مربوطه کمتر است. با این حال ، من این را برای همه اهداف عملی اضافه می کنم. جامعه آنجا به اندازه کافی وجود دارد این فقط این است که چندین دستور بزرگتر از Bootstrap است ، بنابراین شما ممکن است فوراً راه حل هایی پیدا نکنید.
  • پیچیدگی: اگر شما به Bootstrap یا چیز ساده یا بدتر از آن به وانیل CSS عادت دارید ، بنیاد مانند یک انفجار بی نهایت پیچیدگی احساس خواهد کرد. لایه های درون لایه ها ، مؤلفه هایی با اجزاء ، گزینه های سفارشی سازی بی پایان. . . خیلی زود ، شما شروع به زیر سوال بردن مفید بودن زندگی خواهید کرد! اما بعد دوباره ، بنیاد هدف بسیار متفاوتی دارد و نمی توان مقصر آن بود.
  • گزینه های بسیار زیادی: بعضی اوقات شما فقط می خواهید گول بزنید و بعدا نگران کمال باشید. در چنین مواقعی ، ناامیدکننده است که گزینه های بسیار زیادی با تغییرات جزئی ارائه شود. به عنوان مثال ، به این فکر کنید که وقتی خیلی گرسنه هستید می توانید یک ساندویچ مترو را سفارش دهید ، اما بخواهید گل بخورید. به طور طبیعی ، بنیاد برای مواقعی چنین نیست.
  • در دسترس بودن استعداد: از آنجا که بنیاد نسبت به Bootstrap محبوب تر است ، استعداد موجود بسیار کمتر است. به عنوان یک قاعده کلی ، هر استخدام جدید تقریباً احتمالاً Bootstrap را می شناسد اما سرنخی در مورد بنیاد نخواهد داشت. یادگیری زمان می برد ، و لوکس بودن همه تیم ها نیست.

بولما

بولما یک شرکت کننده نسبتاً جدید در زمینه نبرد چارچوبهای CSS است و در مدت زمان کوتاهی نامی را برای خودش رقم زده است. جذابیت آن در یک رویکرد دقیق و CSS قرار دارد (اجزای جاوا اسکریپت وجود ندارد) و پیش فرض های ظریف ، این چیزی است که بسیاری از توسعه دهندگان با چشم مناسب برای طراحی هنگام کار با Bootstrap مشکلی ندارند..

بخش عمده ای از حرکت Bulma از نرخ پذیرش زیاد با جامعه Laravel (یک چارچوب وب PHP ، در صورتی که نمی دانید) ناشی می شود ، که من مطمئن هستم تقریباً چیزی است که به Vue.js کمک کرده تا به ارتفاعات محبوبیت برسد. در میان چارچوب های JavaScript.

چرا Bulma CSS Framework را انتخاب می کنید

دلایل زیادی برای دوست داشتن Bulma و استفاده از آن برای پروژه بعدی شما وجود دارد:

  • کاملاً محبوب: خوب ، این محبوب تر از Bootstrap نیست ، اما محبوب تر از بنیاد است. از زمان نوشتن ، Bulma دارای 30k + ستاره در Github ، حدود 3k + بیشتر از Foundations است. البته ، تعدادی از ستاره های گیتوب هیچ معیار شایستگی ندارند ، اما می گوید جامعه تأیید Bulma را انجام می دهد.
  • کلاسهای بسیار قابل خواندن: برای من Bulma ، قابل خواندن ترین کلاسهای CSS از تمام چارچوبهایی که من سعی کردم. همچنین یک سیستم مسخره و قدرتمند و ساده برای ایجاد شبکه های به سبک مترو وجود دارد که به آن کاشی گفته می شود (فقط کافی است در نیمه دوم تصویر به کد نگاه کنید و به من بگویید که شما تحت تأثیر قرار نمی گیرید!).

  • منحنی یادگیری مسطح: Bulma بسیار مدولار است و برای حل مشکلات عملی و روزمره ای که تیم های کوچکتر و توسعه دهندگان انفرادی با آن روبرو هستند ایجاد شده است. متوجه می شوید که Bulma بسیار آسان برای یادگیری است ، اگرچه من فکر می کنم یک زمینه مناسب و مناسب در CSS همیشه خوب است تا ایده ای راجع به آنچه ممکن است در زیر هود اتفاق بیفتد داشته باشد. این کار به شما کمک می کند وقتی می خواهید رفتار پیش فرض را نادیده بگیرید.
  • زیبا: خوب ، به بخش پیش فرض Hero برای Bulma در زیر نگاه کنید. گفت کافی است!

Bulma یک جامعه کوچک ، اما بسیار پرشور و پرشور دارد ، بنابراین اگر می خواهید با تمام کرک ها کنار بیایید و در عین حال می خواهید با زمان استفاده از UI های زیبا و ظریف در زمان ضبط ، Bulma راهی برای انجام این کار باشد. برای توسعه دهندگان Bootstrap ، Bulma یک بخش جداگانه برای ترغیب و کمک به مهاجرت به آنها دارد.

UIkit

چیزی که هنگام فکر کردن به ذهن شما خطور می کند UIkit مینیمالیسم است. مینیمالیسم نه در ویژگی ها (در واقع ، آن را ممکن است بیشترین ویژگی های همه چارچوب ها) ، بلکه در طراحی را ارائه دهد. اگر طرح های بسیار تمیز ، ظریف و بدون فضای خجالتی چیز شما هستند ، UIkit را پوشش داده است.

به عنوان مثال ، به مؤلفه نوار پیشرفت نگاهی بیندازید:

یا مؤلفه نشانگر تصویر (یک نشانگر تعاملی با هدایت JS برای تصاویر):

یا حتی فرم فروتنانه HTML:

اگر این ظرافت در بالای ریه های آن فریاد نمی زند ، نمی دانم چه می کند. کافی است به وب سایت UIkit سر بزنید و تمام مؤلفه های باورنکردنی ارائه شده را بررسی کنید. مگر اینکه مدیر پروژه یا مشتری شما یک زبان سبک خاص را وادار به شما کند ، من فکر می کنم Uikit تاج طراحی UI را می گیرد و چند مایل جلوتر از طراحی متریال Google است.

اما تعجب می کنید؟ بله ، وجود دارد UIkit مانند Bootstrap با JavaScript کار می کند و در حالی که می توانید از jQuery برای دستکاری DOM استفاده کنید ، استفاده از یک چارچوب DOM مجازی مانند React غیرممکن است..

همچنین ، Uikit یک سیستم خود مختار است و شما نمی توانید بدون اینکه تلاش زیادی انجام دهید آن را اصلاح یا گسترش دهید.

UI معنایی

یکی دیگر از مدعیان مسابقه است UI معنایی, که سعی می کند خود را با بسیاری از مضامین و سفارشی سازی متمایز کند. بیش از 3000 متغیر مضمون وجود دارد ، که منجر به وسعت گسترده ای می شود. یا به همین ترتیب اسناد می گویند.

Bootstrap 4 همه نوع این موارد را پوشش می دهد و کاملاً قابل تنظیم است ، اما یکی از مزیت های UI معنایی این است که به طور پیش فرض منجر به طرح بندی زیبا می شود. با این حال ، این بهترین ظاهری نیست ، به همین دلیل من آن را بعداً در لیست خود قرار می دهم.

همچنین یکی از شدیدترین منحنی های یادگیری را دارد و کنوانسیون های کد نویسی بسیار دقیق تر هستند. امتحان کنید من می گویم ، و ببینید آیا به نظر می رسد مانند چیزی است که شما ترجیح می دهید.

سوزی

سوزی یک چارچوب کمی شناخته شده در این مرحله است ، اما یک ایده جذاب و طراوت آور است. یک چارچوب خالص دیگر ، Susy تمام ایده های از پیش تعریف شده float ، grid ، Flexbox ، جداول یا هر چیز دیگری را از بین می برد و به شما امکان می دهد نوع طرح مورد نظر خود را بسازید. “آهنگسازی” کلمه کلیدی در اینجا است ، به عنوان Susy به منظور ایجاد طرح های بسیار مدولار و متناوب با نیازهای بسیار پیچیده ، غیرمعمول و دقیق طراحی شده است..

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

برای اطلاع از قدرت Susy ، از این تنظیمات پیش فرض (SASS) نمونه بگیرید:

// 4 ستون متقارن ، سیال
// روده ها 1/4 اندازه یک ستون است
// عناصر دهانه کمتر از ستون ها فاصله دارد
// ظروف نیز دارای یک روده کمتر است
$ susy: (
‘ستون ها’: تکرار سوسنی (4),
‘ناودان’: 0.25,
‘spread’: ‘باریک’,
“ظرف گسترش”: “باریک”,

من فکر می کنم که کد کاملاً کاملاً توضیحی است ، اگرچه برای کسانی که عجله ندارند ، نیست. �� اگر شما از تمام نفخ و چنگال هایی که چارچوب های مدرن به شما تحمیل می کند ، سویی حس کامل می کند و نیازهای چیدانه ای دارید که می دانید هیچ چارچوبی معمولی نمی تواند در خدمت شما باشد.

تحقق

اگر عاشق طراحی Material Google هستید ، Materialize یک است چارچوب شما لذت خواهید برد بهترین چیز این است که فقط تعداد معدودی از مؤلفه ها و کلاس ها را برای یادگیری داشته باشید و بر این است که شما را در سریع ترین زمان ممکن تولید کند. گزینه های سفارشی سازی کمی وجود دارد ، و Materialize از قالب محبوب شبکه 12 ستونی که توسط Bootstrap ایجاد شده است ، پیروی می کند.

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

خالص

آیا یاهو مرده است?

نه ، این سؤال انحرافی نیست ، اما یک مشاهد important مهم را برجسته می کند: یاهو ساخت چارچوب خالص و تحت مجوز BSD منتشر شد.

یک نگاه سریع مرا تحت تأثیر قرار می دهد و تعجب می کنم که چرا این پیشنهاد برای بیشتر افراد شناخته نشده است. به هر حال ، آنچه خالص ، خوب ، خالص است ، اینست که یک چارچوب خالص CSS است. �� در واقع ، توسعه دهندگان مایل اضافی را طی کرده و آن را در ماژول های مختلف CSS خراب کرده اند که می توانید در صورت نیاز آنها را وارد کنید. بنابراین ، اگر فقط به سیستم شبکه نیاز دارید ، دیگر نیازی به وارد کردن کل CSS و اضافه کردن به زمان بارگذاری سایت نیست.

شبکه Pure در چندین نوع طعم وجود دارد: 5 نقطه ، 2 نقطه ، 24 نقطه و غیره ، بنابراین وقتی صحبت از ایجاد ستون می شود ، انعطاف پذیری بسیار بیشتری خواهید داشت. خالص به طور پیش فرض بهترین چارچوب CSS نیست ، اما من می توانم ببینم که چگونه می تواند ارزش افزوده را برای کسانی که می خواهند یک مشکل کوچک CSS را در UI خود حل کنند و در پیش فرض های “مفید” چارچوب های دیگر بیابند ، اضافه کند..

اسکلت

همانطور که در شات صفحه نمایش مشاهده می کنید, اسکلت آنقدر کم است که حتی خود را یک چارچوب CSS ، کتابخانه یا حتی ماژول نمی نامد. این صفحه دیگ است و فقط 400 خط کد منبع دارد! باور نکردنی؟ من فکر می کنم که چنین است ، اما برای چشم انداز همه چیز ، Skeleton برای پروژه های کوچک یا کوچک ساخته شده است که به چیزی بیش از چیدمان و موقعیت یابی نیاز دارند.

ارزش نگاه دارد؛ از این گذشته ، چه کسی می داند ، اسکلت همان چیزی است که شما به دنبال آن بودید!

میلیگرام

آخرین مورد در لیست است میلیگرام, یک چارچوب CSS که برای سرعت و بهره وری طراحی شده است. توسعه دهندگان آن را تحت اندازه 2 KB نگه داشته اند ، که مطابق با استانداردهای امروزی ، به معنای زیادی است.

یک میلی گرم چارچوبهای کوچک CSS است که از همکاری با آنها قدردانی خواهید کرد. تمدید آن آسان است و با چند خط CSS سفارشی ، می توانید ظاهر آن را به روشی که می خواهید تغییر دهید.

بنابراین ، کدام فریم ورک CSS بهترین است?

بپذیرید ، شما قبلاً سؤالاتی مشابه پرسیده اید و جواب ناامید کننده زیر را دریافت کرده اید: هیچ. �� انتخاب یک چارچوب (یا یک ابزار ، یا حتی یک شخص در زندگی شما ، برای آن موضوع) به عوامل زیادی بستگی دارد. اگر توصیه من را می خواهید ، اینجا این است: سر و صداها را قطع کنید. فقط به این دلیل که مردم نسبت به چیز جدید و براق دیوانه می شوند ، به این معنی نیست که شما باید آن را بیاموزید و یا پشت سر خواهید ماند. امتحان کردن چیزهای جدید بسیار عالی است ، اما در جستجوی ابزار مناسب ، دور زدن در حلقه ها خوب است.

بنابراین ، کدام یک از این چهارچوب ها را امتحان کرده اید؟ یا شاید چیزی در آنجا حیرت انگیز باشد که من فقط از دست داده ام؟ لطفا در نظرات به من اطلاع دهید ، لطفاً عشق ، نفرت ، سلام تصادفی ، همه خوش آمدید!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map