こんにちは!basara669です。 勉強会で使った「イマドキCSS設計」の資料の解説の第2回目で、BEMについて書きました。 他の記事はこちら 「イマドキCSS設計」の解説 – 前編:css設計の必要性 BEMとは BEMとはロシアのYandexという会社が作った設計のための指針というか、方法論です。 Main / BEM フロントエンド全般の内容になっていて、CSS以外のこともかいてありますが、今回はCSSだけにフォーカスします。 BEMの基本概念 BEMとは、Block、Element、Modifierの頭文字をとったもの BEMの基本概念としては下記のような基本概念のもと作られています。 メンテナンス性の向上 共同作業 コードの再利用性 先ほど説明したとおり、ただ、CSSを書いていってしまうと非常にメンテナンス性が悪いです。結局追記を繰り返し破綻をします。 また、コーディング規約な
![「イマドキCSS設計」の解説 - 中編:BEMについて - basara669.com](https://cdn-ak-scissors.b.st-hatena.com/image/square/b55c29722adbb9c418c23731a76b570aea6b05b4/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fbasara669.com%2Fwp-content%2Fuploads%2F2014%2F07%2Fdesigning-css011.png%3Ffit%3D500%252C272%26ssl%3D1)