원티드 프리 온보딩 3일차 TIL

오늘 한 일

1. css module과 css in js에 대한 고찰
2. 개인 과제

1. css module과 css in js에 대한 고찰

오늘 팀원들과 프로젝트를 하면서 css module과 css in js을 이용해서 style을 핸들링하는 것에 대해 얘기를 나누었습니다.

css module의 장점

• 일단 css in js와는 다르게 시멘틱한 태그를 유지할 수 있다.

css module의 단점

• js파일에서 핸들링하는 변수들을 css에 이용해야하는 경우가 있는데 이런 경우에 inline style을 이용하는 방법 밖에 찾지 못했습니다.

요즘에 SEO에 대한 중요도가 점차 올라가면서 시멘틱한 태그를 유지하는 것도 중요한 요소이라고 할 수 있겠지만 보통 inline으로 style을 적용하는 방법은 좋은 방법으로 여겨지지 않기 때문에 적재적소에 적절한 방법으로 선택해서 사용해야 할 것 같습니다.

2. 개인 과제

이번 주 개인 과제는 내가 프리온보딩 코스를 들어오기 위해 만들었던 과제를 강사님의 eslint에 맞춰 업그레이드 하는 것이 과제 였습니다.

향상된 부분

1. classNames 라이브러리를 이용해서 className을 정의하였습니다.
   기존

   className={isToggle === true ? "toggle" : ""}

   현재

   className={cx({"toggle" : isToggle})}

   조금 더 깔끔해졌습니다.