React
1.[React-TypeScript] React useRef 사용할 때 Ref is possibly 'null', useRef Error
useRef를 사용해서 scroll을 조정하기 위해서 jsx문법으로 작성된 코드를 tsx로 바꾸니 listReft.current 부분에 위 사진처럼 오류가 생겼다. 기존의 React 프로젝트를 typescript를 적용하면서 발생한 문제였다. useRef는 초기값이 있
2.[React-TypeScript] jsx에서 txs로 마이그레이션시 오류, No overload matches this call.
No overload matches this call.Overload 1 of 2, '(props: PolymorphicComponentProps<"web",FastOmitDetailedHTMLPropsButtonHTMLAttributesHTMLButtonElem
3.[React-TypeScript] React input common component 마이그레이션. jsx에서 tsx
common components를 마이그레이션 하면서 여러가지 오류들을 맞이 했다. 오류에서 배워가는 와중에 궁금증이 들었던 부분이 있다.🤔 바로 ...props 부분이었는데 작성한 컴포넌트와 스타일 컴포넌트의 타입들을 명시해주었을 때 ...props로 들어오는 속성
4.[React-TypeScript] TSX에서 svg, png import
기존의 jsx에 import 되어있던 이미지들이 tsx로 바꾸니 from 뒤로 오류가 생겼났다.its corresponding type declarations. TypeScript에게 해당 모듈이 어떤 타입을 가지는지 알려줘야한단다. 그래서 declare module
5.[React] React does not recognize prop on a DOM element. 오류, styled-components props 오류, StyleSheetManager
위와 같은 오류가 한 세개정도 나왔는데, 모두 styled-components props 들이었다. 이 오류가 무엇인고 하니 GPT는 아래와 같이 설명했다. zIdx와 같은 컴포넌트 속성명을 사용할 때 경고가 발생하는 이유는 해당 속성들이 HTML의 표준 속성이 아니기
6.useEffect 의존성배열 ESLint warning, React Hook useEffect has missing dependencies
늘 아무 생각없이 썼었던 useEffect를 ESLint에게 크게 혼나면서 의존성 배열에 대해서 다시 생각해보게 되었다.의존성 배열이란? useEffect에 두번째로 인자로 넘기는 배열이다. 두번째 인자가 없으면 effect는 매번 실행되고, 빈 배열이라면 렌더링시 최
7.[React] Twin Macro, Tailwind + Styled-Components 사용기
tailwind + styled-components, twin macro 사용기