티스토리 뷰
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
반응형
'Front-End > CSS' 카테고리의 다른 글
폰트 그라데이션을 CSS로 적용하는 방법 (0) | 2021.12.18 |
---|---|
내용이 많을 때 생략하는 CSS (0) | 2021.12.04 |
SCSS에서 변수 사용하는 방법 (0) | 2021.10.30 |
CSS 변수를 사용하는 방법 (0) | 2021.10.23 |
table에 대한 HTML / CSS 정리 (0) | 2021.10.09 |
댓글
250x250
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 배열
- mongodb
- 프로그래머스
- react
- 재공부
- 리덕스
- github
- node
- 노드
- 리액트 썸네일
- 리액트
- node.js
- 리액트 유튜브
- Visual Studio Code
- 코딩테스트
- programmers
- 함수
- 뷰
- 파이썬
- CSS
- java
- redux
- javascript
- Switch
- 자바스크립트
- node-sass
- Git
- array
- 자바
- Coding Test
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함