Мы продолжаем серию интенсивов для новичков на целый день!

В прошлый раз участники жаловались, что сложно выбраться в рабочий день. Мы вас услышали и теперь проводим мероприятие в воскресение, 8 апреля.

Очень просим вас максимально оперативно зарегистрироваться.

Как и на прошлом митапе начнем с самых азов и познакомим начинающих верстальщиков с идеями, которые стоят за БЭМ, а затем перейдем к практике на БЭМ-платформе (bem-express) и React с использованием bem-react-core.

Вас ждет детальный рассказ про основы БЭМ на реальных примерах, включая CSS и хорошие практики в написании HTML-разметки. Кроме того, мы обсудим, как организовать станок верстальщика, рассмотрим такую мощную концепцию, как уровни переопределения, а также сборку.

Дальше мы обсудим разработку проекта на React.js и научимся описывать React-компоненты в декларативном стиле. Для вас подготовлено плавное погружение в bem-react-core. Мы на практических примерах рассмотрим, какие преимущества получит ваш React-проект с использованием этой библиотеки.

В этот раз у нас будет гораздо больше времени, так вы сможете сделать передышку, задать вопросы и перекусить в перерыве.

План мероприятия:
12:00 — 12:30 — Знакомство и ваши вопросы
12:30 — 14:00 — Основы БЭМ
14:00 — 15:00 — Перерыв
15:00 — 18:00 — Знакомство с React.js и плавное погружение в bem-react-core
18:00 — 19:00 — Заключительная секция вопросов и ответов

Ноутбук приносить не обязательно. После встречи мы опубликуем все материалы, ссылки и видео.

Митапы по БЭМ, как всегда, бесплатны, но нужно зарегистрироваться заранее: количество мест ограничено.

По всем вопросам пишите по адресу: info@bem.info

Stay BEMed!

Мы продолжаем серию БЭМапов!

Сергей Бережной проведёт секцию живого программирования и познакомит вас с библиотекой bem-react-core. Вы узнаете, как и зачем в одном проекте совмещать React и bem-react-core, как создавать блоки и элементы, работать с модификаторами и использовать уровни переопределения.

Мы приглашаем всех, кто уже знаком с React и хочет привлечь БЭМ к своему проекту! Регистрация открыта!

Stay BEMed!

Мы продолжаем серию митапов для новичков. На этот раз проводим интенсив на целый день!

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

Как и на прошлом митапе начнем с самых азов и познакомим начинающих верстальщиков с идеями, которые стоят за БЭМ, а затем на практическом примере рассмотрим разработку проекта на React.js и bem-react-core.

Вас ждет детальный рассказ про основы БЭМ на реальных примерах, включая CSS и хорошие практики в написании HTML-разметки. Кроме того, мы обсудим, как организовать станок верстальщика, рассмотрим такую мощную концепцию, как уровни переопределения, а также сборку.

Дальше мы обсудим разработку проекта на React.js и научимся описывать React-компоненты в декларативном стиле. Для вас подготовлено плавное погружение в bem-react-core. Мы на практических примерах рассмотрим, какие преимущества получит ваш React-проект с использованием этой библиотеки.

В этот раз у нас будет гораздо больше времени, так вы сможете сделать передышку, задать вопросы и перекусить в перерыве.

План мероприятия:
12:00 — 12:30 — Знакомство и ваши вопросы
12:30 — 14:00 — Основы БЭМ
14:00 — 15:00 — Перерыв
15:00 — 18:00 — Знакомство с React.js и плавное погружение в bem-react-core
18:00 — 19:00 — Заключительная секция вопросов и ответов

Ноутбук приносить не обязательно. После встречи мы опубликуем все материалы, ссылки и видео.

Митапы по БЭМ, как всегда, бесплатны, но нужно зарегистрироваться заранее: количество мест ограничено.

По всем вопросам пишите по адресу: info@bem.info

Stay BEMed!

Опубликовали скринкаст! https://www.youtube.com/watch?v=BuKeVrQmVKI&t Ведущий: Владимир Гриненко

• Верстка макета с нуля по методологии БЭМ.
• Основы методологии, главные принципы.
• Перевод сверстанного макета на React.js.
• Знакомство с bem-react-core.

Репозиторий проекта с материалами для БЭМапа.

UPD: Опубликовали видео: https://www.youtube.com/watch?v=BuKeVrQmVKI&t Мы продолжаем серию встреч для новичков!

На этот раз Владимир Гриненко проведет мастер-класс, на котором:

• Сверстает макет с нуля по БЭМ-методологии, попутно объясняя ее принципы.
• Покажет на примере сверстанного макета, как перевести любой БЭМ-проект на React.

Вас ждет максимум практики и примеров!

Регистрация уже открыта: https://events.yandex.ru/events/bemup/02-february-2018/.

Stay BEMed!

хочу покрутить с целью принять решение, внедрять или не внедрять. По сборке я правильно понимаю что: Уровни переопределения - это всегда энтрипоинты вебпака? Модификаторы - возможно сделать как чанки вебпака и подгружать асинхронно (будет ли выделено как чанки если сложить там только css вроде темизации)? Переводы - куда упадут собранные по всем сорцам переводы, в энтри или в чанк? Как не пересобирая выебпак перевести на все языки да еще и в разных уровнях переопределения? Где взять пример накрученных переводов (обычные ключи, параметризированные, множественные)?

15 сентября в Екатеринбурге состоится очередная встреча БЭМ-сообщества — BEMup!

Мы ждем вас в уютном офисе Яндекса, где Сергей Бережной проведет мастер-класс по использованию bem-react-core — библиотеки, расширяющей возможности React.

Если вам близка идея БЭМ, приходите! Будем говорить про БЭМ, React и фронтенд в целом.

Участие, как всегда, бесплатно, но нужно зарегистрироваться! Мы просматриваем все заявки вручную, поэтому ответ с приглашением может прийти с задержкой.

Регистрация открыта!

Stay BEMed!

PS: По традиции вы можете задать вопросы заранее в комментариях к этому посту, а мы постараемся подробно ответить на них во время митапа.

UPD: Опубликовали видео с митапа https://www.youtube.com/watch?v=o1MeyEvpDTg

11 августа в 19:00 в питерском офисе Яндекса пройдет еще один митап по БЭМ!

Сергей Бережной проведет мастер-класс по использованию bem-react-core — библиотеки, расширяющей возможности React. Вы получите возможность изменять любые аспекты поведения компонентов без добавления лапши из if-ов в коде. В точности так, как это делается в CSS.

Вы сможете:

• Создать компонент с разным набором признаков (в том числе и с разной разметкой!).
• Дешево проводить AB-тестирование и эксперименты.
• Настраивать компонент под окружение/платформу, переиспользуя общий код.

Кроме того, мы ответим на любые ваши вопросы, связанные с БЭМ и работой фронтендера в Яндексе.

По традиции вы можете задать вопросы заранее в комментариях к этому посту, а мы постараемся подробно ответить на них во время митапа.

Участие, как всегда, бесплатно, но количество мест в зале ограничено, так что успейте зарегистрироваться! Мы просматриваем все заявки вручную, поэтому ответ с приглашением может прийти с задержкой.

Регистрация открыта!

Stay BEMed!

Существует ли (рассматривается ли) способ организации блоков в рамках одного уровня переопреледния?

Как пример можно рассматривать ситуацию, когда имеется некоторая (предположим) сущность "Report" и все имеющие к ней отношение блоки удобно было бы хранить в одной папке. Поначалу пытался для таких ситуаций использовать отдельные уровни (создаём уровень blocks/Report, в котором храним всё, имеющее отношение к "Report"), но это получается как-то вне концепции и вообще дичь.

Т.е.: возможна ли не плоская, а древовидная структура папок для блоков внутри уровня?

UPD: Опубликовали скринкаст митапа!

30 июня в московском офисе Яндекса пройдет очередная встреча БЭМ-сообщества.

В этот раз мы решили последовать общему реактовому тренду и ответить на ваши вопросы про разработку на БЭМ и React. Мы расскажем про нашу библиотеку bem-react-core и про всё, что успели сделать в этом направлении, ответим на ваши вопросы про React/БЭМ и не только.

По традиции на БЭМапе мы ответим на все вопросы, которые вы зададите в комментариях к этому анонсу.

Участие, как всегда, бесплатно, но количество мест в зале ограничено, так что успейте зарегистрироваться! Мы просматриваем все заявки вручную, поэтому могут быть некоторые задержки в получении.

https://www.youtube.com/watch?v=ztDWggzH8W4

Stay BEMed!

Новости БЭМ из мира React

О том как развивается библиотека bem-react-core, которая позволяет декларативно работать с React-компонентами в рамках БЭМ-методологии. Спикер Антон Виноградов.

Часть 1 https://www.youtube.com/watch?v=4QblH4SKeIg

Часть 2 https://www.youtube.com/watch?v=MFlqi5maFX8

Роль сборки в БЭМ-проектах, сборка БЭМ-проектов с помощью Gulp

Спикер Дима Андриянов. https://www.youtube.com/watch?v=n0iF2zxa3DY

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

Видео с предыдущих встреч можно найти на нашем форуме.

В рамках мастер-класса:

• Напишем БЭМ-проект на основе project-stub.
• На примерах покажем, для чего нужны технологии BEMJSON, BEMTREE, BEMHTML, DEPS, и как использовать их вместе.
• По традиции ответим на все вопросы, которые вы зададите в комментариях к этому анонсу.
• Вопросы, которые возникнут во время мастер-класса, конечно, тоже не оставим без ответов :)

Митап пройдет в пятницу, 21 апреля в московском офисе Яндекса с 19:00 до 22:00.

Участие, как всегда, бесплатно, но количество мест в зале ограничено, так что успейте зарегистрироваться!

Stay BEMed!

13 апреля в екатеринбургском офисе Яндекса мы проведем очередной митап по БЭМ. Приглашаем тех, кто уже умеет верстать, знаком с JavaScript и теперь хочет узнать больше про БЭМ. В рамках митапа:

• Рассмотрим основные аспекты БЭМ-методологии и расскажем, как можно начать применять БЭМ в своем проекте, следуя только методологическим рекомендациям.
• Сделаем обзор основных технологий, входящих в БЭМ-платформу и расскажем, что для чего и как использовать.
• Ответим на все ваши вопросы, которые возникнут во время встречи.

Вы можете задавать вопросы заранее в комментариях к этому посту. Тогда мы сможем включить подробные ответы в наш рассказ.

BEMup пройдет в четверг, 13 апреля в екатеринбургском офисе Яндекса с 19:00 до 22:00. Участие, как всегда, бесплатно, но количество мест в зале ограничено, так что успейте зарегистрироваться!

Stay BEMed!

Как то снова не пришло ни какого оповещения о событии, помогло только периодическое просматривание календаря событий яндекса. На самом форуме(этом) кнопка события ни чего не выдает адекватного. Давайте как нибудь это поправим, готов посодействовать чем смогу))

UPD: Опубликовали видео.

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

Мы расскажем:

• О новостях БЭМ из мира React. О том как развивается библиотека bem-react-core, которая позволяет декларативно работать с React-компонентами в рамках БЭМ-методологии. Спикер Антон Виноградов.
• О сборке веб-приложений из блоков в общем и о сборке БЭМ-проектов с помощью Gulp (а, возможно, и ENB) в частности. Спикер Дима Андриянов.

BEMup пройдет в пятницу, 24 марта в московском офисе Яндекса с 19:00 до 22:00.

Регистрация уже открыта: https://events.yandex.ru/events/bemup/24-march-2017/ Присоединяйся!

Stay BEMed!

Как мы уже писали, в конце месяца мы проведем очередной BEMup.

Все, кому интересны новости БЭМ и мира React, — welcome! Некоторое время назад мы анонсировали библиотеку bem-react-core, которая позволяет декларативно работать с React-компонентам в рамках БЭМ-методологии. С того момента прошло достаточно времени, и многое изменилось. Антон Виноградов расскажет, что появилось нового, и как боролись со старым:

• поддержка HOC;
• сокращенный синтаксис модификаторов;
• тесты;
• create-bem-react-app;
• поставка дистрибуционного пакета;
• • целая пачка мелких улучшений и фиксов.

Задавай свои вопросы в комментариях к посту, и спикер постарается ответить на них в своём выступлении.

Уже в конце месяца мы проведём очередной BEMup. В этот раз мы решили рассказать про спикеров и доклады ещё до официального анонса и открытия регистрации.

Дима Андриянов расскажет всё про сборку веб-приложений из БЭМ-блоков с помощью Gulp и, возможно, ENB.

Если у тебя есть вопросы по этой теме, можешь писать их в комментариях к этому посту. Тогда докладчик ответит на них во время своего выступления.

https://youtu.be/cDLhO3Psygc

Привет!

Уже в эту пятницу, 27 января в московском офисе Яндекса пройдет очередной митап по БЭМ для новичков.

Мы продолжим обсуждать темы, которые затронули на предыдущей встрече. Кстати, если вы ее не посетили и еще не успели посмотреть записать — сейчас самое время!

https://www.youtube.com/watch?v=Ai-yt0b8iKE

Кроме того, в программе:

• архитектура проекта, основанного на компонентном подходе;
• инструменты, упрощающие жизнь фронтенд-разработчика; и, конечно, ответы на все ваши вопросы.

Участие бесплатное, но не забудьте зарегистрироваться!

До встрече на BEMup-е :)

https://youtu.be/Ai-yt0b8iKE

Привет, дорогой друг. Я хочу поделиться историей развития сборки в БЭМ.

Если ты из тех, кто совсем не любит читать большие тексты, то знай «Собирать проекты на БЭМ проще, чем скушать пирожок».

Заинтригован? Приходи на BEMup.

А теперь суровые подробности.

Первый кусочек пирога

В первом подходе мы решили проверить, возможно ли собрать самый простой БЭМ проект на чём-то, кроме ENB.

Под роль самого простого проекта лучше всего подходит project-stub: один бандл, минимум зависимостей, минимум кода.

В качестве чего-то, кроме ENB, мы выбрали Gulp. Как минимум это один из самых популярных инструментов для сборки с богатой «экосистемой» плагинов. Кроме того, Gulp не является готовым инструментом в отличии от большинства конкуретнов, это фреймворк для написания своих систем сборок. Такие его особенности дают определённую гибкость.

Так появился пакет gulp-bem. Что он умеет делать? Правильно, собирать project-stub и ничего больше.

Мы тогда даже не ленились и написали постик об этом.

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

Второй кусочек пирога и бутылка рома

Во втором подходе мы решили, что важно проверить ещё одну гипотезу. Состоит она из двух частей:

1. Можно ли собирать реальный проект? Посложнее, чем project-stub.
2. Можно ли собирать примеры, тесты и документаци?

Стандартные двухдневные посиделки привели нас к ряду идей.

Идея атомарного модуля для получения исходников

Модуль: gulp-bem-src.

Почти как gulp.src(), только bem.src().

Ну вы же знаете, что слово БЭМ делает любой модуль как минимум в 2 раза лучше, а тут даже в 3 раза получилось.

Идея о создании бандлов из чего угодно

Модули: gulp-bem-bundler-fs, gulp-bem-bundler-examples.

Бандлы, они как алкоголь, их можно добыть из чего угодно, даже из других бандлов.

Идея об универсальной сборке бандлов

Модуль: gulp-bem-bundle-builder.

Один раз придумали, как собирать ваш CSS и собирайте его так хоть для документации, хоть для вашей бабушки.

Хелперы

Заодно появились хелперы для сборки шаблонов: gulp-bem-xjst, gulp-bh.

В этот раз постик мы не написали. Но пирожок всё равно заслужили, правда-правда!

Пирожок SDK

Между делом появился замечательный BEM SDK — набор атомарных модулей. Каждый модуль решает одну задачу.

В третьем подходе мы делали всё, чтобы наш малыш (BEM SDK) совсем повзрослел. И кажется, ещё совсем чуть-чуть и он отправится в мир похоти и разврата (ENB в живых сервисах).

Вот только некоторые крепыши: bem-naming, bem-walk, bem-decl, bem-graph, bem-deps, bem-bundle.

Пока пирожок не заветрил

Чтобы всё произошло, осталось не так уж и много:

1. Начать использовать BEM SDK в сервисах.
2. Дописать недостающие хелперы для i18n, borschik, и т.д.
3. Написать генераторы бандлов для тестов, примеров и документации.

1-2 октября мы соберёмся, чтобы совершить ещё один подход к снаряду под номером четыре.

О том, что получилось обязательно расскажем.

Возобновляем традицию BEMup'ов — встреч для тех, кто использует БЭМ и смежные технологии в своих проектах.

Очередной BEMup пройдет в пятницу 30 сентября в московском офисе Яндекса c 19:00 до 22:00. В теплой и дружеской атмосфере команда БЭМ поделится планами и идеями на ближайшее будущее.

Предварительная программа:

• новости из мира БЭМ — последние релизы, планы и идеи (включая пару премьер);
• подробный рассказ про модульную сборку на gulp;
• рассказы участников сообщества о решениях, библиотеках и инструментах, которые могут облегчить жизнь разработчика и работу в предметной области БЭМ;
• ответы на животрепещущие вопросы и общение с командой.

Если у вас есть непреодолимое желание выступить на BEMup со своим докладом — пишите нам на info@bem.info.

Форма регистрации: https://events.yandex.ru/events/bemup/30-september-2016/. Присоединяйтесь!

Привет!

18 августа в 19:00 мы с нашими друзьями из Front-end Science проведем очередной БЭМап в Киеве!

В программе:

• Последние наработки и новости из мира БЭМ, а также ближайшие планы.
• bem-sdk: сборка без bem-tools или ENB.
• БЭМ в динамике: express-приложение с BEMTREE + BEMHTML.
• Свободное общение: ваш опыт разработки с БЭМ.
• Ответы на вопросы.

Подробности и форма регистрации здесь.

Эти выходные с BEMup'ом в Питере были просто чудесны! Не говоря про погоду, которая просто была сказочной, программа митапа была насыщенной, а многие приехали в Питер аж из Москвы посмотреть и пообщаться с нами. Спасибо, мы тронуты!! А еще нас много просили показать мастер-класс не самим, а сделать так, чтобы пришедшие участники могли писать код. А это ой как не просто! Почти 2 месяца подготовки заданий и написания тестов, сто раз проигранные в мозгу планы, трансляция, видео, зал, как все это соединить воедино, плюс тестирование на --котиках-- коллегах, и вот он долгожданный день! Это был урок, проверка, и круто, что все получилось! Даже коллеги не из службы БЭМ подходили и говорили: «Круто! Я сделал что-то сам на bem-core!» И да, нам есть, что теперь оттачивать дальше, к ноябрю А вы это, не расслабляйтесь! https://tech.yandex.ru/events/bemup/ :) Видео как всегда через 2 недели в разделе «Выступления», фото уже тут https://www.facebook.com/media/set/?set=a.825215090831947.1073741904.122612334425563&type=1, вопросы к нам можно писать в форум и помечать 2-мя метками — продукт и asktheteam