본문 바로가기

전체 글

(203)
리액트 에러 바운더리를 사용하여 에러 핸들링하기 (+ react-query) 에러 케이스 에러가 발생하는 원인 관점에서 두가지 케이스가 있다. 1. 프론트 에러 : 주로 Type Error, 참조 에러 등 2. 백엔드 API 에러 : HTTP 케이스와 웹사이트 로직에 따라서 세부로 나뉨 (Get / Post / Put / Delete .. 등) 처리 방안 1. 프론트 에러 a) axios 요청 전부터 에러 발생 (accessToken 없음) 👉 토큰 없음 메시지 Toast UI 표출 & 로그인 페이지로 이동 b) 참조에러 👉 발생하는 컴포넌트를 ErrorBoundary 로 감싸고 fallBackComponent 처리 + Uncaught Error 메시지 제공 2. 백엔드 API 에러 a) GET 조회 결과 빈 데이터 👉 에러로 처리하지 않고, 200 성공에 데이터가 없는 경우 보..
Frontend 관점 HTTP 응답 상태 코드(RESTful API) * 케이스를 마주할 때마다 업데이트 할 예정 Frontend 에서 처리하기 용이하면서도 RESTful API 관점을 잃지 않고 HTTP 응답 상태 코드를 어떻게 약속할지에 대한 생각과 의견이다. 상태 코드 Case 1. GET 조회 시 빈 데이터 - customer/order/{userId} : userId 에 해당하는 order 리스트를 조회했는데, 해당 유저의 오더 건이 없는 경우 - product?word={text} : 쿼리로 조회시 검색 결과가 없는 경우 [응답] status : 200 response : { result : true, data: [] } [추가 고려사항] - result : true / false 의 용도를 어떻게 정의해야 하는가? - 사실상 result : false 인 케이..
[1D1C] 0202 기록