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”

  • sarjalim
    link
    fedilink
    arrow-up
    3
    ·
    edit-2
    1 year ago

    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.

    • marcos@lemmy.world
      link
      fedilink
      arrow-up
      4
      ·
      1 year ago

      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.

      • sarjalim
        link
        fedilink
        arrow-up
        1
        ·
        edit-2
        1 year ago

        Very little (and long ago). We usually use a frontend stack of Angular and PrimeNG for our projects.