Programming/React(2)
-
[React] MutableRefObject와 LegacyRef
Input의 onChange에 setState를 할당해서 값이 바뀔때마다 상태값이 변경되도록 설정했더니, 매번 Input에 입력한 값이 변경될 때마다 렌더링이 다시 되는 기염을 토했다. 당연한 얘긴 줄 알고 있었는데 주리님이 보시고 ‘이럴때는 이런 식으로 최적화가 가능해요’라고 말씀해주셔서, react-hook-form, react-final-form, formic같은 애들에 대해 알게됐다. 조금 고민해보다가 ‘엥? 얘는 일단 간단하니까 useRef만 써도 되는거 아닐까?’라는 결론에 도달, Input에 ref를 냅다 꽂아버렸더니 LegacyRef에 MutableRefObject를 할당할 수 없다는 에러가 발생했다. 우선 Input의 ref를 보면 요 녀석은 LegacyRef|undefined를 받게 되..
2022.02.04 -
[React] Remix에 Pico.css를 적용해보자
Remix에 Pico.css를 적용해보자 React 기반 풀 스택 프레임워크라고 소개된 Remix. 대충 Blog tutorial를 따라서 해봤는데, CSS와 관련된 내용이 하나도 없더라구요. 기왕 마크다운을 읽고 쓰는 것 까지 됐는데말이죠. 그래서 좀 꾸며볼까하다가 얼마전에 건너건너로 들은 10Kb미만의 CSS 프레임워크, Pico.css를 적용해보기로 합니다. 당연히 삽질에 삽질을 했지만 검색해봐도 뾰족한 답이 없었기에, 나중에 까먹으면 찾아보려고 작성합니다. Pico.css를 설치하자 Pico.css의 Getting Started 페이지를 보면 Pico.css를 설치하기 위한 세 가지 방법이 나와있습니다. Pico.css 다운로드 후 {/* ... */} ); } 이렇게 간단한 걸 못해서 삽질을 하..
2021.12.21