프로 디지털 아카데미 4기 - 프론트엔드 Coworking 실습입니다. 강사님께서 제시해주신 디자인 템플릿을 따라 CoWorking 사이트를 구현하였습니다.
저희 프로젝트의 목표는 페어 프로그래밍과 컨벤션을 지켜 실 프로젝트 때 적용할 수 있도록 익숙해지는 것이 목표입니다.
페어프로그래밍이란?
 |
 |
| 김득호 | 신희을 |
| FE | |
<컨벤션> : <변경 파일 명> - <설명>
| 컨벤션 | 설명 |
|---|---|
| feat | 새로운 기능과 관련된 것을 의미한다. |
| fix | 오류와 같은 것을 수정했을 때 사용한다. |
| docs | 문서와 관련하여 수정한 부분이 있을 때 사용한다. |
| style | 코드의 변화와 관련없는 포맷이나 세미콜론을 놓친 것과 같은 부분들을 의미한다. |
| refactor | 코드의 리팩토링을 의미한다. |
| test | test를 추가하거나 수정했을 때를 의미한다. |
| chore | build와 관련된 부분, 패키지 매니저 설정 등 여러가지 production code와 무관한 부분 들을 의미한다. 말 그대로 자질구레한 일들이다. |
| add | 이미지 등의 정적 자원 추가를 의미한다. |
| init | 초기 설정 세팅을 의미한다. |
| rename | 파일 혹은 폴더 명을 수정하거나 옮기는 작업을 의미한다. |
| 컨벤션 | 설명 |
|---|---|
| 들여쓰기 | 공백(space) 2문자를 사용한다. |
| 속성값 | 반드시 큰따옴표("")를 사용한다. |
| 태그명, 속성명, 속성값 | 모두 소문자만 사용한다. |
| Boolean 속성 | 값을 따로 명시하지 않는다. |
| css/자바스크립트 파일 | type을 표시하지 않는다. |
| css 파일 | 상단에 불러온다. |
| 자바스크립트 파일 | 하단에 불러온다. |
| HTML 문서 형식을 명확하게 지정한다. | |
| 불필요한 태그 작성을 피한다 | |
| 목적에 맞는 HTML 태그를 사용한다. | |
| 엔티티 참조는 사용하지 않는다. | |
| 컨벤션 | 설명 |
|---|---|
| 들여쓰기 | 공백 2문자를 사용한다 |
| 클래스, 아이디 명 | -를 사용하는 케밥 케이스를 사용한다. |
| 선언 블록 | 여는 중괄호({) 앞에 공백 1문자를 넣고 닫는 중괄호(})는 새로운 행에 배치한다. |
| 단일 스타일 한줄, 다중 스타일은 한줄에 하나씩 표시한다. | |
| 선언시 | 이후 공백 1문자를 추가한다. |
| 스타일 지정시 | 아이디 대신 클래스를 사용한다. |
| 자바스크립트 | Hook에서 스타일 지정을 위해 만들어진 클래스를 사용하지 않는다. |
| 16진법 컬러 | 될 수 있으면 3글자로 표현한다. |
| 태그 선택자 대신 클래스 선택자를 사용한다. | |
| 선택자 길이는 최대 3개이상 넘지 않게 제한한다. | |
| 부모선택자를 표시해야한다면 꼭 필요한 경우만 작성한다. | |
| 축약이 가능한 프라퍼티는 축약해서 사용한다. | |
| @import 대신 <link>를 사용한다. | |
- 즐기고 창의적으로 하자