현재 쓰고 있는 방식은
OOCSS와 SMACSS방식이 섞인 방법을 자연스레 사용하고 있었다. 협업할 일 없이 css는 혼자 작업하기때문에 bem방식까지는 쓸 필요를 느끼지 못했다.
그럼에도 부족함을 느껴서 찾아봤더니 CSS방법론이 있었고,
그 중 모듈화할 수 있는 방법을 알게 됐다.
이를 참고하여 현재 내가 사용하는 CSS방식을 업데이트 하기로 했다.
해당 방법론들을 참고하여 현재 작업환경에 맞게 사용하면 될 듯하다.
css-in-js 방법론
class명을 고려하지 않아도 된다.
개발친화적이다(dx)
이것은 리액트 프로젝트 진행시 사용해보기로...
JSX(ja+html), jss(js+css)-> CSS-in-JS 라이브러리(Styled Components) 사용
js에서 변수와 class(css)명은 스네이크방식 (변수와 클래스명을 스네이크로 동일하게 맞춰야 빠르고 편한 코딩 가능함)
변수 선언시 const로 항상 선언.
함수 선언시 카멜케이스
클래스는 파스칼케이스
제이쿼리 선언 변수는 변수앞에 $표시 추가.
+ 코드 네이밍 컨벤션
카멜or스네이크방식 사용
배열을 나타낼 때 가독성이 떨어질 수 있는 s보단 array, listof, arr 사용.
약어는 보편적으로 익숙한 것들을 사용. temp, param, arg, arr 등 모두 대문자, 모두 소문자로 표현
상수는 대문자로
중요한 단어를 앞에.
단일문자는 반복문에서 카운팅할 때만 사용
+ git 커밋 컨벤션
[형식]
태그: 제목 - (태그: feat, fix, docs, style, refactor, test, chore, comment, remove, rename, design)
본문 - (생략가능, 자유롭게 서술)
꼬리말 - (생략가능, 이슈에 대한 내용과 이슈번호, 해결여부)
- 커밋 종류에 따라 이모지로 사용하는 경우도 있으나, 아직 협업에 있어 익숙치 않기 때문에 보류하고
text로 사용하기로...- but, 개발자 본인은 본인 이름 대신 이모지 하나를 맨앞에 배치하여 표기하고 있다.
이름 적는 것보다 빠르기 때문.
