Pull to refresh

Comments 82

Чем больше читаю о БЭМ, тем больше вопросов.
Я не пользователь Windows, но я попросила кого надо, чтобы вам ответили. Только подождите немного :-)
Расскажите пожалуйста, как удобно работать с бэм в проектах на php
На YaC2011 был мастер-класс «Тема для Wordpress на БЭМ» clubs.ya.ru/bem/replies.xml?item_no=1151 Там как раз про PHP. Только это контент годовой давности, сейчас уже не нужно 100500 комманд для сборки в консоли писать, потому что есть bem server. Но по видео можно принцип понять.
UFO just landed and posted this here
У меня один: нафига это все нужно? О_О Поясните, кто может сказать о преимуществах?
Можете почитать ответы на комменты в Smashing Magazine coding.smashingmagazine.com/2012/04/16/a-new-front-end-methodology-bem/ Тема больно новая, поэтому там много вопросов. Но ответы все есть.
Также, видео, на которое я вначале давала ссылку, мне кажется, хорошо всё объясняет ( vimeo.com/53219242 ). Там по-английски, но зато это самый свежий контент.
А ещё есть доклад Виталия Харисова «История создания БЭМ» ( events.yandex.ru/talks/137/ ), на русском. Там как раз шаг ша загом про то, какие были проблемы в разработке, как их решали, добавляя в систему «правила», и как в итоге получился БЭМ.
Не надо меня засылать в гугл или еще куда-то. Своими словами объясните зачем это ?!
В «Истории создания БЭМ» Виталя Харисов и объясняет своими словами. Коротко о главном: работа по БЭМ, это не верстка и прикручивание js, а разработка интерфейса, то есть вы начинаете мыслить другими порядками, блоками-элементами-модификаторами и их взаимодействиями, а не «класс у divа поменялся, отвалися мой js». Блок тут получается на более высоком уровне, чем верстка.
По мне БЭМ хорош именно в верстке. Я конечно не использую такой механизм при создании сайтов. Но все чаще и чаще обращаюсь к методологии написания классов. Сразу снимается ряд проблем, особенно при наследовании. Порою даже код CSS короче.
Почему «конечно не использую»? Почему только в верстке?
БЭМ хорош только для проектов которые вы будете долго поддерживать. Год и дольше. Причем именно работать над ним, а не раз в месяц, что-то подправить. Для производства стайтов на продажу, это не очень подходит. Представьте что вам прислали на отладку главную страницу яндекса.

И раскрывает он себя именно при строительстве страницы именно таким образом как написано в статье. То есть не руками.
Правда меня терзают сомнения. Мне все же, кажется, что правильнее было бы сначала просто сверстать, а потом уже переводить это уже в json вид для дальнейшей поддержке. Потому как с нуля, делать json-блоками можно мозги вывихнуть.
Золотые слова!

Большинству разработчиков следует понять, что основа БЭМ — независимые блоки, а не префикс b_.
Тогда, если на проекте используется XSLT, то стоит сначала просто сверстать, а потом переводить в XSLT? Я вас не понимаю.
«Сперва верстать» — это лишь вопрос привычки. Я бы даже такую страницу верстала, а потом переносила в шаблоны оооочень долго. А на bemjson+bemhtml бац-бац и всё готово. И сразу можно блоки реиспользовать и проект делить, как угодно. Например, блок «box» сначала в проекте был, и только при подготовке статьи я его в отдельную библиотеку выделила простым копированием.
UFO just landed and posted this here
«У нас» нет цели разработать миллион библиотек. Мы даём другим инструмент, при помощи которого они могут разработать свои библиотеки и делиться друг с другом.
UFO just landed and posted this here
Почему вы сравниваете БЭМ и бутстрап?
UFO just landed and posted this here
Как насчет легкости поддержки и внесения изменений? Реализации удивительных идей удивительных менеджеров? Организации командной работы?
UFO just landed and posted this here
Я вас понял. Возможно, я просто давно не делал таких проектов.
Как раз сегодня решил разобраться в этом БЭМ, статья очень кстати. Спасибо!
Вы работаете на retina-экране? Что-то уж шрифты в скриншотах слишком большие.
Нет, я просто увеличила шрифт, чтобы картинки красивые были.
HTML код переделаю на текст, размещать его картинками было не лучшим решением.
На сколько мне известно, за рубежом БЭМ особо не пользуются. В чем же дело? Западные разработчики используют какие-то свои решения? Или они еще не распробовали БЭМ? Или с БЭМ что-то не так?
Я смотрю на все это и искренне не могу понять как это может упрощать разработку и делать ее более эффективной, но я еще новичок и опыта работы над серьезными проектами нет, поэтому могу ошибаться.
Про БЭМ на английском языке была одна статья и один доклад. Причём доклад был месяц назад.
Но несмотря на на такое откровенное мизерное количество информации, есть проекты, использующие БЭМ.
Навскидку — SoundCloud soundcloud.com, intuit.css inuitcss.com. Про последний есть даже статья с объяснениями webdesign.tutsplus.com/tutorials/htmlcss-tutorials/rubbing-noses-with-inuit-css/
UFO just landed and posted this here
Побольше таких статей step-by-step, чтобы было понятно что и откуда берётся.
UFO just landed and posted this here
Как парадигма БЭМ конечно интересен. Независимые блоки и все такое… Но тонна инструментов, которые для этого нужны отпугивает. Надо что-то мутить с сервером, обязательно нужен линукс и т.п. и т.д. Мне как простому верстальщику это кажется слишком уж извратным.
UFO just landed and posted this here
А можешь написать инструкцию с картинками?
UFO just landed and posted this here
Ребята, а в чём суть библиотеки bemhtml?
в статье нет особенных подробностей
Тем не менее стало намного понятнее.
К сожалению так и не смог установить bemtools, при инсталле ругается на всякие encodegen, coverjs и т.д.
node -v v0.6.19
npm -v 1.1.4
Последние из репозиториев.
Можете код установки в gist положить и ссылку дать?
Нравится БЭМ как философия. Но, по сути примерно то же самое стараются применять и другие фреймворки.
Только не совсем понятно, зачем для разметки использовать json? Ведь html для этих целей не просто так зародился.
Ну или yaml — от скобочек глаза резать не будет.

Если идти дальше, то на мой взгляд, dojo предостовляет не сколько не худший вариант блочно-модульной архиетктуры. Только там шаблоны сверстаны на html, на не на json, и ничего не надо компилировать, чтобы отобразить страницу.

Серверные фреймворки так же предлагают сборку страниц из блоков, а также удовлетворяют для этих блоков зависимости для js, css и image (возьмем хоть тот же symfony2 для php, или yii).

Подход БЭМ удобен, без сомнения. Но, пока не стал бы его использовать у себя в проектах. Есть другие, более простые заменители с меньшим количеством зависимостей.

На конец остался вопрос: «Как, например, из базы данных, выводить контент на собранные БЭМом страницы?». Нигде пока этого так и не увидел (может плохо смотрел).
> Только не совсем понятно, зачем для разметки использовать json? Ведь html для этих целей не просто так зародился.

в данном случае, html является не исходником, а результатом компиляции. поэтому, использовать html было бы не логично (на эти грабли постоянно наступают — см. ru.wikipedia.org/wiki/Самореференция) — для описания исходной структуры нужно использовать мета-язык. мне кажется, что json это какой-то панк, но принципиальной разницы в альтернативах нет.
bemjson содержит струкртуру страницы (более высокую абстракцию), которая путем работы шаблонизатора превращается в разметку html/css/js. Можно сравнить с электрической схемой — тут блок резистор, тут блок транзистор, а тут — микросхема ввода. Детали реализации (готовую плату) уже монтажник создает (в случае веб-страниц bemhtml)
Попробовать на вкус? Простите, но запаха вполне достаточно.
Объясните пожалуйста, в чём фишка такого подхода:
content: [
    {
        block: '...',
        content: {
            block: '...',
            content: [
                {
                    elem: '...',
                    content: '...'
                },
                {
                    elem: '...',
                    content: '...'
                }
            ]
        }
    }
]

Для двух блоков я написал четыре раза elem и пять раз content. Если это действительно так надо делать, то как это как это обойти/автоматизировать?
Да и вообще, если посмотреть, то всё как-то избыточно. Объясните, в чём подвох?
Там всё одинаковое? Можно цикл написать, это обычный JavaScript.
А, если вы про глубокую вложенность, то такой уж JSON. В XML что-то выглядит лучше, но там свои недостатки.
Надо попробовать YAML или что-то подобное, должно быть лучше.
Понятно.
Однако, нужно признать, что с наслоением технологий повышается порог входа, что отнюдь не придает товарного вида БЭМу.
Вообще, я так понял, что сейчас каждый во что горазд выкручивается и придумывает свои велосипеды, пока не найден оптимальный вариант реализации этой пресловутой технологии БЭМ.
БЭМ, хорош. Идея нравится, но полностью перейти на него так и не получилось. Нехватает примеров проектов более приближенных к реальным и примеров интеграции с серверными технологиями.
На этапе создания контейнера b-page__body-i я что-то завис. Будто бы не видит сервер мой b-page.bemhtml, при этом css в этой же директории подцепляется. Есть идеи, что не так?
Не думаю, что b-page.bemhtml не подцепляется, ведь до этого b-page__body у вас выводился? Могу подебажить, если на гитхаб куда-нибудь свои результаты зальёте.
О, спасибо! Заливать всю директорию проекта?
Да, с b-page__body все ок, но он приходит из bem-bl/blocks-desktop. Я подумал, может дело в каких-то зависимостях, которых я не вижу
Сразу разобраться не получилось, но дело не в зависимостях — всё подключается. Похоже, что недавно переписали блок b-page и возможен баг. Я когда разберусь, напишу комментарий.
У вас файл с расширением «bemthml», а не «bemhtml». Переименуйте, и всё заработает.
Делаю всё по инструкции.

При запуске bem server и последующем запросе страницы localhost:8080/desktop.bundles/index/index.html получаю:

HTTP error 500

Error: Command failed: fatal: unable to connect to github.com:
github.com[0: 192.30.252.128]: errno=No error


    at ChildProcess.exithandler (child_process.js:637:15)
    at ChildProcess.EventEmitter.emit (events.js:98:17)
    at maybeClose (child_process.js:735:16)
    at Process.ChildProcess._handle.onexit (child_process.js:802:5)

Как быть в данной ситуации?

P.S.: я нахожусь за прокси. Хотя мне всё равно не понятно, откуда берутся попытки залезть на github.com.
Хотя мне всё равно не понятно, откуда берутся попытки залезть на github.com.

Судя по статье, используется bem-bl, а репозиторий этой библиотеки — на github.com.
Библиотеки подтягиваются после старта сервера?
да, библиотеки выкачиваются по необходимости уже во время работы сервера
А как Вы тогда профилируете?
не понял вопроса… если речь о профилировании работы сервера, то мы замеряем время сборки без учёта сетевых расходов
Если у вас по необходимости библиотека не подтянулась, вы об этом вообще узнаете?
конечно — будет ошибка сборки, например как в исходном коментарии, когда из-за отсутствия соединения с github.com не скачалось что-то
Т.е. у нас сервер работает-работает, и внизапно, бац: ошибка сборки?
А можете прямо написать, к чему вы пытаетесь подвести? С наводящими вопросами, боюсъ, будет очень долго. Например не понятно «внезапно». Почему «внезапно»? Вы думаете, что этот сервер в продакшене работает?
Я думаю нельзя пускать такой сервер в production если он может не собраться только потому, что github лег.
Он не предназначен для работы в продакшене. Это сервер для разработки. Он умеет отслеживать изменения в файлах и пересобирать разные части проекта, чтобы разработчик не тратил на это время. В продакшене это не нужно, там пользуются сборкой.
На вашем компьютере запустился bem server — инструмент для разработки, который будет автоматически пересобирать ваш проект, если вы внесете в него изменения.
Это dev-сервер, который нужен только разработчику. В случае ошибки сборки он даже не начнет работу.
Решил данный вопрос следующим образом:

Оказалось, что проблема возникает, когда происходит попытка загрузить библиотеку с адреса:

git://необходимая_библиотека

Разбираться, почему так происходит абсолютно не было никакого желания — хотелось непосредственно БЭМом заниматься. Поэтому я просто заменил во всех файлах проекта ссылки вида:

git://необходимая_библиотека

на ссылки вида:

http://необходимая_библиотека

После этого всё заработало.

P.S.: Вероятно, прокси не понимает, что это за экзотический такой транспорт — git://.
Шикарно! Спасибо за решение, сидел тоже за прокси, не мог понять почему не качает либы :-)
Only those users with full accounts are able to leave comments. Log in, please.