A small guide for naming stuff in front-end code

Re:A small guide for naming stuff in front-end code by AltruisticGapHN on Thursday January 13, 2022 @10:56AM (#29922096)

Yeah, SuitCSS's main distinction with OP's (excellent) guidelines is that it specifically mentions components, and using the "PascalCase" format of the component's name, as the root classname for the component's root and child elements (eg. `.ProductDetails` `.ProductDetails-footer` `.ProductDetails is-selected` etc, optionally with an app wide prefix like `.cg-ProductDetails`). It's very convenient when you search in editor like VSCode and you find all the matching CSS/JS files together (when they are not "single file components").

[ Parent | on HN ]

Re:A small guide for naming stuff in front-end code by paceaux on Thursday January 13, 2022 @12:13PM (#29923411)

When I wrote the guidelines, it really was all about, "be consistent". camelCase is my preference, but really, go with what makes sense and is least disruptive.

I actually REALLY like SuitCSS' recommendation and I definitely wouldn't object to it.

I intentionally didn't address project architecture (folder names, file names) because ... to be honest... I still haven't quite figured that out.

But I'm going to think on it and maybe add something to the guidelines that echos your suggestion.

[ Parent | on HN ]