Bulma css фреймворк будущего для умных.
Многие, возможно скажут, что очень громкое заявление о том что bulma рвет шаблоны, и меняет жизнь рядового фронтендера. Но иначе не могу поделиться всей радостью от недавнего знакомства с этим чудом. Но начнем с начала.
Предисловие
За свою жизнь я использовал кучу css фреймворков, и всего несколько из них я использовал добровольно. Вообще я к ним редко прибегаю, мне они только усложняют работу. Будем честны, когда работаешь на фрилансе, чаще всего ты за кем-то доделываешь работу или делаешь кучу маленьких проектов. В таком огромном количестве смен дизайнерских идей ты начинаешь работать на фраймворк, а не он на тебя. В те времена, когда я работал на кого-то в команде мы использовали фраймворки лишь читабельности. Куда ведь легче разобраться в документации библиотеки, что там имелось в виду под лаконичным .container, нежели узнавать у абстрактного Васи, что же значит него .container-a1-for_Zaglushka, что легко встретить среди вольных авторов) Собственно легче подстраивать под себя стиль наследуя идея фраймворка. Конечно существует БЭМ, который до сих пор во мне вызывает дрожь, но убивать глаза об кучу .menu—list-item-active тоже не благородное занятие. И В таких случаях лично меня всегда спасал bootstrap, конечно это не просто css фреймворк, но использую я его лишь в таком ключе. Причин использовать его куча, в нем удобно практически все, он сверх популярен что делает его полезным в доработке проектов, он легко подключается обычным CDN в отличие от каких-то гипотетических SemanticUI, которых мало установить, но нужно и скомпилить gulp'ом.
Я бы так и пользовался bootstrap и не тарохтел только вот бы он был на flex. Так как я уже давно привык к этой технологии и другую верстку и представить себе не могу, это настолько быстро и логично в боевых условиях что и смотреть на что-то другое совершенно не хочется.
Собственно, для меня это главный минус так как разобраться что куда уползло, по вине кривых рук, сложно лично для меня, и каждый раз хочется сказать, а вот был бы flex было бы иначе.
И тут к моему удивлению я встречаю это чудо.
Начнем с мелких плюсов.
Семантика
Я к удивлению, обнаружил что кое-как хотя бы в главной документации начали использовать человеческую семантику html5 и уже есть сам по себе готовый класс section. Правда мне что напоминает этот:” Конечно ее могло быть и больше чем всякие section, article, footer, но уже прогресс. По сути плюсом является только потому что принуждает наконец писать читаемый и семантически верный код.
Кстати, как маленький плюс подчеркну название контейнера для колонок, columns. Что скажем честнее чем row который на деле не совсем и row)
Flex
Для меня это главный аргумент. Конечно можно посчитать это и минусом, из-за того, что флекс работает через грабли в доисторических браузерах (реально доисторических). Но вы всегда легко сможете в пару строк изменить работу фраймворка если вам не хватит гибкости. Мне лично не хватает терпения разбираться в дебрях реализации адаптивности bootstrap. Кому-то может показаться смешным такой аргумент, но за моё недолгое знакомство с bulma не случалось того, что я бы не понял, как что-то работает.
Scss
Стоит пояснить так как одного слова не хватает. Сам фреймворк не совсем на css, и его использование может сводиться не только к подключению cdn. Я лично редко прибегаю к препроцессорам и для меня было в новинку увидеть, что можно подключить фраймворк по кускам и лишь то что необходимо вам. Но каково было моё удивление как легко вообще работать и подстраивать все под себя, начиная с того что все функции на которых и строиться вся библиотека отрыты и доступны, и имеют вполне понятный вид.
Вот, например, таблица с разрешениями.
Вот так легко мы изменяем цвета и шрифты и при этом продолжают работать все уже заложенные плюшки.
Адаптивность
Здесь как по мне это зашло прям слишком далеко в хорошем смысле.
По сути вы не должны говорить более ни слова и фреймворк сам понимает, как будет лучше смотреться ваш сайт на мобильном устройстве. И это в прямом смысле как будет лучше, а не как будет просто читабельно.
Да что там говорить сам элемент nav без уточнений становиться выпадающем меню на маленьком разрешении.
Вы просто взгляните на табличку.
Вместо заключения.
Здесь хочется отметить что сам фреймворк довольно молод и делался под нужды современного frontenda, много здесь что нужно на передовой уже есть и не нужно лепить.
Вы только посмотрите, как легко лепить метрошные плашки)