[ETC] 리팩토링 체크리스트

하서율·2022년 7월 30일
1

위코드

목록 보기
9/15

리펙토링 체크리스트

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는 가독성이 없기 때문에 많이쓰지 않는것이 좋다.
profile
매일 매일 기록하기

0개의 댓글