One of my favorite things, as well as one of the more frustrating things about being a self-taught developer, is that you are constantly learning. This quality is great because I love learning and gaining new knowledge. It is frustrating, because when there is always something missed and when it’s brought up then comes the imposter syndrome (well at least for me it is).

I tend to work in Frontend development when it comes to my software engineering teams, not to say that I’m not able to work full-stack I just understand visuals and designers better than others. In my past, I achieved a Masters in Fine Art, so the Frontend development work really does just make sense to me. So in a recent project when my naming conventions for classes were brought up for not following BEM Standards…

I was like what is that️!? So now that I know, let me tell you about it!

BEM is Block, Element, Modifier

It is a standard naming convention when creating your Class names for CSS styling practices.

A Block is a page component, of which can be nested in other blocks or placed independently. The block holds within it a full scale of power, including but not limited to behavior, templates, styles. Blocks can often be reused throughout the code.

An Element is a part of the Block. It shouldn’t be used outside of the block. In class names, there can be a generalized form of an element to use in a global instance.

A Modifier is a descriptor entity. Its job is to define the appearance and behavior of a block or element.

Having this in my tool belt is something that is going to make me a better programmer and a produce cleaner code.

Happy Coding!