className 변수를 single dash를 사용하는 듯 하다..
=> 어떤 기준에서 ???
https://ko.reactjs.org/docs/components-and-props.html
공식 문서에서도 single dash를 사용하긴 했는데 근거는 찾을 수 없었다.
공식 문서랑 내가 고민하는 className의 기능이 css에서 class 역할을 한다고 생각하게 됨.
- css에서 class를 single dash로 많이 사용함.
css에서 속성명도 명명이 single dash로 되어있음
(ex, bg-color, justify-center 등)
- className에 bootstrap 등등의 범용적인 class 명들이 들어가게 됨
그러면 여기에 규칙을 맞춰주는게 좋고
일부의 style에서 dash를 -로 인식하는 부분에만 별개로 고려해주는 듯.
추가로 css naming에 대한 방법은
여러 방법이 논의가 되고 있고 딱 결정이 난건 없음...
결국 여기저기서 나오는 개념은 BEM.
특히, 외국 유튜브 영상은 BEM을 추천하는듯
그러나 이게 기준이 되는 standard는 아닌듯
내 생각 결론 : - single dash가 scss를 사용하지 않은 css에서 구조적인 효과도 제공할 수 있는듯
http://bdavidxyz.com/blog/how-to-name-css-classes/
몇몇 의견에는 BEM이라는 개념을 적용해서
https://stackoverflow.com/questions/57221878/react-classname-naming-convention
https://stackoverflow.com/questions/57221878/react-classname-naming-convention
block이라는 큰 개념에서는
To form a CSS class, add a short prefix for namespacing: .block
단어로 ex, .app 처럼 ...
그 다음의 Element의 개념에서는
CSS class is formed as block name plus two underscores plus element name: .block__element
마지막으로 Modifier
CSS class is formed as block’s or element’s name plus two dashes: .block--mod or .block__elem--mod and .block--color-black with .block--color-red
