Форум

Методология

Инструментарий

Платформа

Сообщество

i-bem.js: руководство пользователя

i-bem.js: JavaScript-фреймворк для БЭМ

i-bem.js — специализированный JavaScript-фреймворк для веб-разработки в рамках БЭМ-методологии.

i-bem.js позволяет:

  • разрабатывать веб-интерфейс в терминах блоков, элементов, модификаторов;
  • описывать логику работы блока в декларативном стиле — как набор состояний;
  • легко интегрировать JavaScript-код с BEMHTML- или BH-шаблонами и CSS в стиле БЭМ;
  • гибко переопределять поведение библиотечных блоков.

i-bem.js не предназначен для замены фреймворка общего назначения, подобного jQuery.

Краткий обзор содержания документа:

  • Общие сведения о фреймворке: связь с предметной областью БЭМ, краткое описание модульной структуры фреймворка, шаблонного проекта и инструментов для сборки кода, написанного с использованием i-bem.js.
  • Привязка JS-экземпляров к HTML — разметка JS-блоков в HTML-коде страницы, варианты соотношения HTML-элементов и JS-экземпляров.
  • Декларация — синтаксис описания класса блока и элемента.
  • Передача параметров — передача параметров экземпляру блока и элемента, получение доступа к параметрам из экземпляра.
  • Работа с DOM-деревом — API для работы с DOM-узлами блоков и элементов.
  • Состояния — модификаторы, триггеры на изменение модификаторов.
  • Коллекции — работа с несколькими экземплярами блоков или элементов.
  • События — событийная модель i-bem.js: DOM- и БЭМ-события.
  • Инициализация — инициализация экземпляров блоков и элементов.
  • Взаимодействие блоков — обращение из экземпляра блока или элемента к другим экземплярам и классам.
  • Контекст — собственные и статические свойства блока и элемента. Статические свойства i-bem-dom.
  • Что дальше? — ссылки на документацию и дополнительные материалы.
Если вы заметили ошибку или хотите чем-то дополнить статью, вы всегда можете или написать нам об этом на Гитхабе, или поправить статью с помощью prose.io.