[Code Review] 02. React 실습 과제_가독성 관련

코드 리뷰 내용 정리

check 1. 코드의 가독성 측면을 고려해 import하는 파일 순서에 대한 convention 고려하기

• React → Library/Package → Component → 변수/이미지 → css/scss 파일
  
• reset -> common.scss 순서로 import 해서 사용
  

check 2. import되는 파일들 중 누락이나 불필요하게 중복으로 import되는 파일은 없는지 확인

• common.scss과 reset.scss은 전체 페이지에 적용되어야 하는 부분으로 index.js에서 import 해서 사용하지만, 각 컴포넌트의 scss 파일은 해당 컴포넌트의 js파일에서만 import

check 3.태그에 맞는 표기법 확인 및 상황에 맞는 closing-tag 적용하기

• 속성에 부여하는 값이 문자열일 때는 중괄호를 사용하지 않아도 되며, Input 태그 사이에 입력 값이 없는 경우, self-closing을 적용
  

check 4. 이미지 태그의 alt 속성 누락하지 않기

• 이미지 태그 alt 속성 작성 시 누락하지 않고, 최대한 구체적으로 작성하여 Redundant alt attribute 오류 방지 하기

  Redundant alt attribute. Screen-readers already announce img tags as an image. You don’t need to use the words image, photo, or picture (or any specified custom words) in the alt prop

check 5. scss 작성 시에는 각 요소마다 className 부여 후 스타일링

• 빈번히 사용되는 태그로 스타일링 시 depth에 무관하게 적용되어 의도치 않은 스타일링이 될 수 있으며, 동일한 태그로 선언된 다른 요소에도 영향을 미칠 수 있기 때문이다.