[skrebbel]

A bit meta, but I need this off my chest: I love how this document starts off saying "this is for react apps". IMO every discussion about CSS coding standards needs to start with context.

A lot of old CSS lore came from people who build websites. I mean those fairly uninteractive things, focus on content. Blogs, restaurants, newspapers.

Building an application that happens to use the DOM as their UI toolkit is totally different. The whole "reuse the same classes but with different content" thing that CSS classes were designed for becomes less important, and "reuse pieces of behavior" makes a lot more sense.

There's probably more domains or subdomains that warrant their own CSS best practices. But I'm totally tired of a blog designer and a react app coder fighting on HN about how the other one is doing it wrong, when really they're just solving different problems.

[Wintamute]

I build large static websites, and sometimes apps, and can confirm that the CSS techniques listed in the article work very well for both use cases.

UI components don't need to map to richly interactive parts of an app, they can just as appropriately map to repeated design elements in a well planned static site.

To me its the same problem.

[sanderjd]

Well said. This goes (probably double) for the similar conversations about javascript, where lots of people question whether it should be used at all, which is a reasonable question for sites but not for applications.

[threesixandnine]

Those people probably have static content sites with lots of js on their mind when they say that, no? Ads, tracking code, etc....

[sanderjd]

I think they probably do, which is why I really liked the parent comment about how people should be clear about what they're talking about so that we stop talking around each other all the time.

[talmand]

"reuse the same classes but with different content"

What difference does the content make if the styling is meant to be the same?

"reuse pieces of behavior"

Now, that made me curious. Can you expand on that because I'm not sure I quite understand what you mean.

edit: I've read through the naming convention they describe and I don't see much anything that different than how I would create CSS for a website. It's just a clean naming convention that would work for a website as well as an application.

[bobbytherobot]

I think "content" should be "context". It is when you create a class based on appearance instead of context. To make it worse, is when the class has a semantic name like Hero but it is being used in clearly non-Hero usages. It makes refactoring hard.

[talmand]

Ok, sure, I see what you mean. But I put that under "not using tool correctly so blame tool" category.

[ooqr]

I would love to read a long-form article about this if you're ever inclined.

[skrebbel]

I'm flattered, but I'm not sure I have much more to add! What would you expect to be explored more deeply in such an article?

[ooqr]

I just haven't encountered this problem yet as a junior dev and would like to learn more. Perhaps it will just come with more experience.