[22.05.24] TIL

dl, dt, dd

https://developer.mozilla.org/ko/docs/Web/HTML/Element/dl
정의형 목록을 나타낼 때 사용하는 HTML 요소이다.

여러개의 목록이 있는 경우 각각의 dt와 dd를 div로 묶어준다.

<dl>
  <div>
	<dt>
	<dd>
  </div>
  <div>
	<dt>
	<dd>
  </div>
</dl>

React Common Components

버튼, 드롭다운과 같은 여러 페이지에서 사용하는 공통 컴포넌트는 각각 페이지마다 스타일이 다를 수 있다.
size, primary, children과 같은 속성을 prop으로 넘겨주고 각 페이지에 맞게 사용하면된다.

interface Props {
  size: string
  primary?: boolean
  children: ReactNode
}

====

<button className={cx(styles.button, styles[size], {[styles.primary]: primary})}

Tips

• https://codeclimate.com/
  위 사이트에서 자신의 코드를 평가받을 수 있다.

• Chrome 개발자도구 내 Lighthouse를 이용해 문제점을 발견하고 고쳐나가보자
  ex) button에 이미지만 있고 텍스트가 없다면 aria-label 속성을 사용해라