бэм методология

47 %
53 %
Information about бэм методология
Education

Published on February 4, 2014

Author: racoons

Source: slideshare.net

Description

Презентация Марата Абдулина раскрывает тему БЭМ (Блок-Элемент-Модификатор) методологии. А конкретнее для чего она необходима и в чем ее плюсы.

БЭМ методология

БЭМ Блок-Элемент-Модификатор

Для чего? • Типовые проекты должны разрабатываться быстро, но жить долго • Над проектом работает много людей • Масштабируемость команд • Повторное использование кода

БЛОК

ЭЛЕМЕНТ

МОДИФИКАТОР

Независимость кода Независимость блоков Независимость CSS

Предметная абстракция С точки зрения процесса разработки: • Все участники процесса оперируют одними терминами С точки зрения CSS: • CSS блоков и элементов можно описывать на псевдоязыке, который затем компилируется в чистый CSS согласно принятой схеме именования. С точки зрения JavaScript: • Не нужно обращаться к DOM-узлам блоков и элементов по имени класса

Консистентность блока

Организация файловой системы

Инструменты bem-tools это инструмент для работы с файлами, написанными по БЭМ-методу. CSSO (CSS Optimizer) является минимизатором CSS, выполняющим как минимизацию без изменения структуры, так и структурную минимизацию с целью получить как можно меньший текст. SVGO (SVGO Optimizer) — это инструмент для оптимизации векторной графики в формате SVG, написанный на Node.js. Расширяемый сборщик файлов borschik может использоваться для сборки текстовых файлов из кусочков. Например, для сборки статических файлов веб-страниц (CSS, JS, etc).

А как же рельсы?! BEM on Rails github.com/verybigman/bem-on-rails

Как пользоваться? thor bem:create -b test -m color -v red thor bem:create -b test -e icon -m size -v small = b "test", mods: [{color: "red"}], content: [{ elem: "icon", elemMods: [{size: "small"}] }]

На этом всё. Вопросы? ru.bem.info github.com/verybigman/bem-on-rails

Add a comment

Related presentations

Related pages

Методология / БЭМ

БЭМ методология Документация. Методология БЭМ создана в Яндексе для разработки ...
Read more

Методология БЭМ: маленькие сайты - interface · code · order

Напомню, что БЭМ (блок, элемент, модификатор) — это способ организации фронтенда ...
Read more

БЭМ

Методология. Быстрый ... БЭМ с гордостью сделан в ...
Read more

BEM

BEM. Methodology Idea and architecture Toolbox Tools and SDK Platform Implementation Quick start Community People and events. Telegram; Facebook; Twitter;
Read more

БЭМ-методология: с чего всё начиналось и зачем это всё ...

На Хабре уже много писали о методологии БЭМ, выросшей в Яндексе. И мы решили, что пора ...
Read more

Методология БЭМ by Alexey Kalyuzhnyi

БЭМ - аббревиатура от слов Блок, Элемент, Модификатор - методология именования ...
Read more

БЭМ — Википедия

БЭМ (Блок-Элемент-Модификатор) — методология web-разработки, а также набор ...
Read more

Верстка для самых маленьких. Верстаем страницу по БЭМу ...

БЭМ — это методология не более, а сокращение кода решается с помощью препроцессоров.
Read more