| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | |||||
| 3 | 4 | 5 | 6 | 7 | 8 | 9 |
| 10 | 11 | 12 | 13 | 14 | 15 | 16 |
| 17 | 18 | 19 | 20 | 21 | 22 | 23 |
| 24 | 25 | 26 | 27 | 28 | 29 | 30 |
| 31 |
Tags
- inferred type error
- 리스티웨이브
- node.js(express) + ws(websocket) + react
- http.createserver
- 코드잇 스프린트 FE 1기
- pure functions
- type reference cannot be named error
- useimperativehandle 사용법
- css module classNames
- 특정 dom node만 노출시키고 싶을 때
- React
- express로 채팅 기능 구현하기
- trigger additional callbacks
- 리액트 19 useref
- 이미지 업로드 과정
- useimperativehandle 사용할때
- components as formulas
- next.js
- 스프린트 여정 마침
- 회고
- 오블완
- 리액트로 채팅 기능 구현하기
- express react
- dynamic metadata
- 프리렌더링
- 티스토리챌린지
- app.listen
- usemutation custom hook
- useref 타입
- CSS module 장점
Archives
- Today
- Total
목록components as formulas (1)
Life is connecting the dots .
React 컴포넌트를 순수 함수로 작성하는 이유
지난 프로젝트를 진행하면서 Next.js에 기본값으로 StrictMode 값이 true로 설정되어 있어서 버그를 발견하고 예방할 수 있었다. 그때의 상황을 대략 설명하자면 컴포넌트 안에서 useEffect를 실행했었고, useEffect의 콜백함수로 API를 호출하는 중이었다. 단순히 데이터를 불러오는 API라면 여러 번 호출해도 이상 없겠지만, 해당 API는 로그인 인증 관련된 부분이어서 동일한 데이터를 두 번 호출했기 때문에 에러가 발생하는 상황이었다. 결론적으로 컴포넌트가 다시 마운트 될 때, 이전 API요청을 취소하는 방법으로 해결했고, 개발환경에서만 React StrictMode가 동작하므로 배포환경에서는 문제가 안 되는 것을 확인했지만 혹시 모를 상황에 대비하여 코드를 제대로 작성할 수 있었다..
Programming/React
2024. 4. 2. 13:06