Bootstrap 4 вышел в alpha версии

    image

    Те кто так или иначе связан с веб разработкой скорее всего знает что такое Bootstrap.
    Лично я познакомился с фреймворком Bootstrap версии 2.x и он на меня произвел неизгладимое впечатление. Можно было без участия дизайнера получить вполне сносный интерфейс. Встроенный перфекционист ликовал. Можно ругаться, что интернет стал очень уж бутстраповым, но нужно отдать должное, парни, работающие над ним в целом молодцы и делают нужное, а то, что народ ленивый – проблема другая.

    Сегодня день рождения этого замечательного фреймворка. В свой день рождения был объявлен Bootstrap 4.



    Bootstrap 4 – что нового?


    Как пишут сами разработчики нового много и сложно описать все изменения в не большом обзоре. И я не буду. Основные моменты:

    Переезд с Less на Sass


    Bootstrap теперь компилируется быстрее обычного за счет использования Libsass.

    Улучшения системы сеточной верстки


    Больший упор на мобильных пользователей. Были полностью переработаны миксины.
    Теперь, судя по документации, можно из коробки получить нужные примеси в любом месте. Например вы хотите, чтоб в вашем проекте был класс .line вместо прежного .row:

    .line {
      @include make-row();
    }
    


    Поддержка Flexbox


    Как пишут сами разработчики: «Будущее наступило...». Легким движением переменной и перекомпилированием можно получить Bootstrap основанный на Flexbox

    Карточки (Cards)


    На смену некоторым компонентам (well, thumbnail, panel) пришли карточки. Они делают тоже самое только еще лучше.

    Reboot


    Все, что в Bootstrap 3 выполняло роль сброса HTML для кросс-браузерной верстки получилось в виде модуля Reboot. С настройками в одном sass файле.

    Новые опции настройки


    В новой версии проект получил множество настроек через переменные Sass. Подробности в исходниках, без ковыряния в них сложно сказать чем именно это отличается от того, что было раньше в Less или Sass версиях фреймворка.

    IE8 не поддерживается. Перешли на rem и em вместо px


    Если нужна поддержка IE8 оставайтесь на Bootstrap 3. Обновились для того, чтобы поддерживать всё лучшее из CSS без необходимости использовать костыли. Отказ от пикселей обусловлен необходимостью лучшей поддержки отзывчивой типографики и более простого изменения размеров компонентов.

    Переписаны все JavaScript плагины


    Все плагины были переписаны в ES6 чтобы воспользоваться всем преимуществами новейшего JavaScript.

    Улучшена работа подсказок и popover элементов


    Спасибо, как я понимаю, нужно говорить проекту Tether. Поправьте если ошибаюсь.

    Улучшена документация


    Переписано на Markdown и добавлено пара удобных плагинов для более удобной работы с документацией. Скоро появится улучшенный поиск.

    Много нового


    Удобный контроль над формами, классы для отступов, новые классы-утилиты и много чего еще.

    Версия 4 содержит около 1100 коммитов и 120000 строк изменений, а работа всё еще не завершена.
    План разработки следущий:
    — Выпустить пару alpha релизов;
    — 2 beta релиза после того как определятся с возможностями и функционалом и хорошего тестирования;
    — Парочка RC, чтоб вообще всё оттестировать;
    — Релиз.

    Bootstrap 3


    Разработчики жалеют, что после релиза Bootstrap 3 они свернули поддержку второй версии. Ошибку эту они повторять не хотят, поэтому в обозримом будущем поддержка Bootstrap 3 продолжится. Будут критические баг фиксы и улучшения документации. Документация по тройке также будет доступна после финального релиза Bootstrap 4.

    Но и это еще не всё! Сегодня был запущен еще один проект – Official Bootstrap Themes.

    image

    Пока там 3 внушительные темы по $99 (dashboard, application, marketing). В каждой можно найти всё из Bootstrap + примеры из реального мира, компоненты, плагины, документация и удобные утилиты. Все темы можно использовать сколько угодно раз, для любых проектов, но не продавать саму тему или производные от нее.

    Скорее смотреть чего они там напридумывали!

    Only registered users can participate in poll. Log in, please.

    Ура?

    • 82.5%Ура!2429
    • 4.0%Не ура :(119
    • 13.4%Долой Bootstrap!395
    Share post
    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More
    Ads

    Comments 46

      +1
      Поддержка Flexbox

      А не известно ли вдруг, есть у них в планах добавление вертикальных лэйаутов в каком-то виде, типа как в Foundation for Apps?
        0
        Я так понимаю проект пока не окончательно оформлен в плане функциональности, кто знает :)
        +4
        Отличные новости, ждем стабильного релиза и можно внедрять :)
          –20
          Неплохо

            +1
            Жаль, что SASS, а не Stylus… Надеюсь, форк обновят под альфу.
              +1
              И у меня часто был такой вопрос. 3-4 года со Stylus, но большинство крупных open-source проектов на SASS. В чем прикол, то?
                +7
                Жаль, что Stylus не получил достаточной популярности… А потом, похоже, популярным станет PostCSS…
                  0
                  В Post CSS будет поддержка синтаксиса Stylus, так что не все потеряно =)
                    0
                    Он уже стал
                    0
                    У вас много опыта, не подскажите пару моментов насчет stylusa

                    1) Использование прозрачных миксинов неочевидно из кода, то есть если кто-то куда-то допишет такой миксин, то узнаешь об этом по факту из chrome developer tools.
                    2) Так как нет фигурных скобочек, то редактор не понимает где нужны отступы, и приходится добивать их, чтобы свойства были внутри селектора, а потом обратно удалять пробелы, чтобы вернуться на уровень селектора, чтобы написать следующий селектор, что я делаю не так? ( в scss все просто, открыл скобки, значит пишешь свойства, после закрытой скобки идет селектор)
                    3) zen coding от phpstorm не понимает этот stylus и уверенно расcтавляет двоеточие между свойство и значением, победить не смог, пример display: none
                    4) в styluse для БЭМ нотации есть клевая фишка с &__name, но после таких объявлений фиг чего по проекту по селектору найдешь.

                    и еще много таких неприятных мелочей, но подскажите, пожалуйста, хотя бы по этим, что не так делаю.
                      0
                      1) То что неочевидно, очень даже плюс. Особенно когда не было автопрефиксера, я просто писал border-radius, а он раскрывал мне все как надо. Из акутальных text-overflow требует трех строчек, вместо одной. К тому-же можно писать непрозрачные — stripe()
                      2) Это проблема редактора и/или плагинов. Subime Text и Atom отлично работают со Stylus. Нужно поставить плагин.
                      3) Это тоже проблема редактора, я решал такую проблему с Sublime и с Atom, если пользуетесь чем-то из этого, напишите мне, я помогу.
                      4) Я разбиваю на множество маленьких модулей, и ищу по первой БЭМ класса по всем файлам .styl, пока что проблем не возникает. К тому-же можно настроить поддержку SourceMap, и прямо из дебагера посмотреть что и где поправить. Хотя такая проблема присуща и LESS/SASS.
                        0
                        Насчёт 2 и 3 — фигурные скобки и двоеточия спокойно распознаются Stylus'ом, я фигурные скобки вообще всегда использую для удобства.
                        0
                        Есть автоматическая конвертация less2stylus и sass2stylus же.
                        0
                        А чем Stylus хорош?
                          0
                          Он умеет всё то, что умеет и SASS, но к тому же позволяет различный синтаксис и Globbing. Ну и гемора с установкой под Виндой меньше, что тоже приятная фича.
                            +4
                            Стилус безусловно имеет свои очень крутые плюшки (вроде переопределения свойств), но зависимость от переносов строк и пробелов — перечёркивает вообще все его плюсы, имхо.

                            Пользуясь случаем, как на стилусе написать код с таким форматированием?
                            box-shadow:
                                0 3px 2px rgba(#000, .2),
                                0 0 0 1px rgba(#000, .3),
                                0 -1px 0 1px rgba(#fff, .9);
                            
                              +3
                              зависимость от переносов строк и пробелов

                              Но ведь можно использовать скобки, с ними и код понятнее, и с форматированием проблем нет.

                              Пользуясь случаем, как на стилусе написать код с таким форматированием?

                              Так и написать, оно компилируется без проблем.
                                0
                                Хмхм, это в последних версиях? Пробовал год назад — не работало. Пробовал и так, и с экранированием слешами, и гуглил, в итоге плюнул и забил.
                                  0
                                  Не знаю, не вижу в чейнджлогах…
                              0
                              Ну и гемора с установкой под Виндой меньше, что тоже приятная фича.
                              Сейчас пилят официальный libsass на C++. Когда закончат — Ruby будет не нужен для его работы.
                                0
                                Я про него и говорил, у меня он не хочет компилиться. Разобраться можно, но проще SASS-код в Stylus преобразовать для старых проектов…
                                  0
                                  Тогда установить Ruby и затем gem install sass :) Этот вариант по крайней мере у меня всегда заводится.
                                    0
                                    gem install sass

                                    Для любителей ноды уже давно есть node-sass — с ним руби не требуется вообще. Я давно его использую и доволен как слон.
                                  0
                                  Ну, вряд ли его вот прям «закончат» — он уже давно в ходу и прекрасно работает.
                                    0
                                    Я имел в виду, когда он станет 100% совместимым с оригинальным Sass. Сейчас пишут, что последняя версия libsass совместима с версией на Ruby на 98.53%. Полагаю, что когда доберутся до 100%, на sass-lang.com появятся официальные билды sassc для Windows.
                                      0
                                      Ну она, скажем так, совместима настолько, что это не доставляет проблем. Все базовые (и не только) фичи там есть.
                                      0
                                      Это компилятор, который работает в виндовой комстроке?
                                      Я тоже мучался с sass под виндой, заработал только Prepros — но он дико неудобный, да ещё к тому же и платный.
                                        0
                                        Про Win ничего сказать не могу, к сожалению, давно ничего на нем не настраивал :) Но судя по докам libsass — Windows там тоже поддерживается, как для самого libsass, так и для программы sassc для запуска из командной строки.
                                          0
                                          Попробуйте node-sass — работает хорошо. Там выше писали про не 100% совместимость с оригинальной реализацией, но я пока не сталкивался с этой проблемой (возможно она действительно есть).
                                –4
                                Вот че бы не сделать кнопочку up↑?
                                  +11
                                  Переезд с Less на Sass

                                  Пичалька. Мне лично Less как-то больше нравится
                                    +1
                                    Да, меня тоже немного это опечалило. Переход скорее всего связан с большими возможностями sass + скорость компиляции выше.
                                    Значит нужно просто менять свои принципы и переходить на sass :)
                                      +4
                                      Не спешите, известный tweet от создателя Bootstrap, Марка Отто:
                                      Oh, btw—Bootstrap 4 will be in SCSS. And if you care, v5 will likely be in PostCSS because holy crap that sounds cool.
                                        0
                                        Переходите, не пожалеете. Сам раньше пользовался только Less, знаю о чем пишу)
                                      +6
                                      >> Пока там 3 внушительные темы по $99 (dashboard, application, marketing).
                                      С ценой они, конечно, переборщили. Шаблоны простенькие и намного менее функциональные, чем представленные в сети.
                                        0
                                        Сегодня был запущен еще один проект – Official Bootstrap Themes

                                        Есть такой небезызвестный сайт wrapbootstrap, я так понимаю Official Bootstrap Themes тоже самое, только пока на низком старте
                                          +1
                                          Трижды ура!
                                          Только из-за того, что включили поддержку flexbox, я безумно благодарен разработчикам.
                                            +4
                                            Тема за 99$, конечно, такая тема… *кашляет в кулачок*
                                              0
                                              мне adminlte нравится
                                              +1
                                              Немного странным показалось решение использовать Grunt в качестве билд-системы. Есть, конечно, стабильность и прочее, но всё же, многие давно пересели на Gulp. А так, новость очень даже хорошая.
                                              • UFO just landed and posted this here
                                                  0
                                                  Привык народ к халяве, поддержки разработчиков! (:
                                                  • UFO just landed and posted this here
                                                  –1
                                                  А кто-нибудь из вас может предположить дату выхода в релиз Bootstrap 4?

                                                  К 1 июня 2016 это реально? Или это пару лет пилиться будет, никто не в курсе?
                                                  Требуется готовый шаблон к лету с админкой, который можно было бы купить.
                                                    0
                                                    Судя по тому, что 8 декабря 2015 вышла только вторая альфа релиз можно ожидать к концу 2016. Следовательно хорошие коммерческие шаблоны Bootstrap 4 следует ожидать к весне 2017. То есть если вы начинаете проект в 2016 году придётся делать это на Bootstrap 3. Хотя 4 версия конечно круче, но нужно время.
                                                    0
                                                    Для веба 1.5 года в статусе Alpha — это, ребята, жесть.

                                                    Only users with full accounts can post comments. Log in, please.