리펙토링 체크리스트

Basic

1. console.log 지우기 (JS)

• 테스트하며 쓴 콘솔로그 지우기

2. 변수명,함수명,class/id명

• 의미가 직관적으로 드러나게 작성
• boolean은 보통 is 를 붙여 작성

3. 들여쓰기

• 태그별로, 부모자식요소 별로 구분이 잘 되게 들여쓰기 하기
• tip! VS code의 prettier 을 사용하면 자동으로 조정된다

4. HTML

• Semantic Tag 사용하여 가독성을 높이기
• img tag alt 속성이용하기
  - 이미지로딩에 오류가 있을경우 텍스트로 대체.
• self closing tag
  - 마지막에 /을 사용하여 끝나는 부분 표시하기
• 불필요한 div는 사용하지 않는다.

5. CSS

• 레이아웃에 영향을 많이 주는 순서대로, 인접 속성끼리 묶어서 작성
• 다른 CSS 선택자들 사이 한 줄 띄우기
• 불필요한 style 지우기
  - 예 ) 블록요소에 display: block / width:100% 부여하는것. (display는 이미 블럭 요소)
  
• 레이아웃은 bottom-up 방식으로 구성
• nth:child는 가독성이 없기 때문에 많이쓰지 않는것이 좋다.