티스토리 뷰

Front-End/CSS

CSS Coding Convention에 대한 정리

제이나린 2021. 11. 13. 10:00
728x90
반응형

회사 프로젝트를 하면서 CSS에 대한 코드가 제각각인 것을 보았다.

그래서 이러한 원인보단 규칙이 정리가 되어 있는 것 같아 다시 기억을 상기시키기 위해 정리하게 되었다.

 

 

 

Coding Convention

해당 언어로 작성된 프로그램의 각 측면에 대한 프로그래밍 스타일, 관행 및 방법을 권장하는 특정 프로그래밍 언어에 대한 일련의 지침이다. 

규칙에 대한 예시로는 들여 쓰기, 주석, 선언, 공백 등 다양하게 사용될 수 있다. 즉, 코드상으로는 prettierrc를 정의하는 그것과 같다고 볼 수 있다. (prettierrc는 다른 운영체제라 하더라도 동일한 코드 규칙을 정리한 것이라 할 수 있다.)

 

회사마다 코딩 컨벤션은 다양하다.

1) 구글 코딩 컨벤션

알파벳 순으로 지정한다.

 

2) 네이버 코딩 컨벤션

순서 의미 대표되는 속성
1 레이아웃 display, visibility, overflow, float, clear, position, top, right, bottom, left, z-index
2 BOX width, height, margin, padding, border
3 배경 background
4 폰트 font, color, letter-spacing, text-align, text-decoration, text-indent, vertical-align, white-space
5 기타 위에 언급되지 않은 나머지 속성들로 폰트의 관련 속성 이후에 선언하여, 기타 속성 내의 선언 순서는 무관한다.

 

 

 

정해진 규칙이 회사마다 각각 다 다르기에

본인이 다니는 회사에 코드 가이드가 있다면 그 가이드를 토대로 혹은 이미 만들어진 코드를 토대로 만드면 된다.

 

물론 필자는 아직 코드가이드가 없어 아쉽다...

728x90
반응형
댓글
250x250
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함