Some developers are sure that BEM is just a way to make class names in CSS are unique and, since a modern tools allow to make names unique automatically they have no reasons to use BEM. This is a mistake with a bad consequences, BEM is are methodology about atomic code design, it gives you a standards and guides how to simplify code maintaining.
Some frontend developers know the BEM methodology as a naming convention for CSS and they create a disgusting #webcomponents. I’ve explain the essence of BEM and shown the benefits for your frontend projects.
Feel free to share it with a people who tells you “i use CSS-modules, so i no needs a BEM”
I’m honestly not necessarily a BEM fan as class names become literally huge if you don’t rely a bit on nested elements (targeting nested classes is not very BEMmy - but SASS makes it so convenient). But haven’t found a naming convention or “framework” that does the job better. BEM also doesn’t address how you should organize the style library for maintainability. I just use my own simplified structure based on ITCSS now.
I just wish that someone could make a methodology or an architecture of building style libraries that felt obvious and was more plug-and-play, I hate that I feel like have to revisit the style library organization and naming convention for each new project to reevaluate if it makes sense for the scope of the project.
Then again, I work as a fullstack dev in a small team of more backend-focused fullstack devs, so I don’t do frontend as often as I’d like and don’t really have anyone to discuss these issues with.
Given that naming the element only and selecting for the hierarchy gives you completely equivalent functionality, with completely equivalent selectors, I do prefer the option that keeps the names more generic.
BEM always looked like a hack to increase the CSS selection performance, and not something that adds architectural value. And well, we don’t need hacks of that level anymore, browsers are well optimized nowadays.
My approach for variants is to use attribute selectors. You don’t get massive class names and it becomes more obvious what things are doing. Discover ability gets hurt a bit, but that was never BEMs strength either
You are not logged in. However you can subscribe from another Fediverse account, for example Lemmy or Mastodon. To do this, paste the following into the search field of your instance: !programming@programming.dev
Welcome to the main community in programming.dev! Feel free to post anything relating to programming here!
Cross posting is strongly encouraged in the instance. If you feel your post or another person’s post makes sense in another community cross post into it.
Hope you enjoy the instance!
Rules
Rules
Follow the programming.dev instance rules
Keep content related to programming in some way
If you’re posting long videos try to add in some form of tldr for those who don’t want to watch videos
Downvoted for using an acronym in the title.
deleted by creator
I’m honestly not necessarily a BEM fan as class names become literally huge if you don’t rely a bit on nested elements (targeting nested classes is not very BEMmy - but SASS makes it so convenient). But haven’t found a naming convention or “framework” that does the job better. BEM also doesn’t address how you should organize the style library for maintainability. I just use my own simplified structure based on ITCSS now.
I just wish that someone could make a methodology or an architecture of building style libraries that felt obvious and was more plug-and-play, I hate that I feel like have to revisit the style library organization and naming convention for each new project to reevaluate if it makes sense for the scope of the project.
Then again, I work as a fullstack dev in a small team of more backend-focused fullstack devs, so I don’t do frontend as often as I’d like and don’t really have anyone to discuss these issues with.
I do agree.
Given that naming the element only and selecting for the hierarchy gives you completely equivalent functionality, with completely equivalent selectors, I do prefer the option that keeps the names more generic.
BEM always looked like a hack to increase the CSS selection performance, and not something that adds architectural value. And well, we don’t need hacks of that level anymore, browsers are well optimized nowadays.
Nesting is now in native CSS, so it’s even easier
My approach for variants is to use attribute selectors. You don’t get massive class names and it becomes more obvious what things are doing. Discover ability gets hurt a bit, but that was never BEMs strength either
https://pdx.su/blog/2023-07-27-use-css-attributes
Have you worked with Bootstrap at all?
Very little (and long ago). We usually use a frontend stack of Angular and PrimeNG for our projects.
Interesting choice of thumbnail; Mads Mikkelsen and Kim Bodnia from the movie Pusher (1996).