codesoom week8 회고

Facts

• redux-toolkit 도입
• emotion 도입하여 css in js 적용
• useCallback,useMemo 사용하여 최적화 진행

Findings

• global css 를 설정할 때는 아얘 index.html style 에 넣던지 아얘 별도 js 파일로 분리하는게 좋다.
• 스타일 컴포넌트는 사용하는 리액트 컴포넌트에서 관리하는게 좋다.
• rem 단위를 쓰면, 변환된 픽셀 크기는 페이지 최상위(root) 요소, 그러니까 html 요소의 폰트 크기가 기준이 된다.
  rem 을 사용하면 사용자가 설정한 폰트 크기에 따라 사이트에 배치된 모든 구성 요소가 적절하게 반응하게 할 수 있다.
• em, rem 을 사용한다면 fontSize style 을 가장 먼저 설정하는게 좋다.
• css 는 요소의 위치, 요소내부 자식 배치, 요소 크기 , margin & padding , border 등으로 group 화 시키면 가독성이 높아진다.
  https://dev.to/thekashey/happy-potter-and-the-order-of-css-5ec

Feelings

redux-toolkit 이 있는지도 모르고 actionType 관리하는 파일 따로 reducer 따로 selecetor 따로 해왔었는데

도입하면 코드양을 상당히 줄일 수 있을 것 같다.

css 는 원래 보기 더러울 수 밖에 없다고 생각했는데 group 화 시키면 가독성이 높아진다는 것을 깨달았다.

개인프로젝트 때 철저히 적용해봐야겠다!