1.에러 상황
보통 이런 오류는 'data' 변수가 배열이 아닐 때 발생한다.
가장 흔한 원인은 'data'가 배열이 아니라 객체일 때이다.
이 경우 배열이 아닌 변수에 map() 메서드를 사용할 수 없기 때문에 에러가 난 것으로 추측된다.
2.현재 코드
Main 페이지 중 전체 리뷰 data를 가져오는 부분에서 error가 난 것이다.
data를 map으로 뿌려주는 코드이다.
현재 data는 useQuery를 활용해서 가져왔다.
3.문제 이유 및 해결 방향
"review data 요청 url 형식이 바뀌었다."
기존 request url 형식: /reviews
변경 request url 형식: /reviews?page=1&size=8
한정된 최신의 데이터만 메인페이지에서 보여주고 싶었기 때문에 이를 백엔드 개발자분께 요청했고,
응답 data의 구조도 바뀌었다.
따라서, 기존의 data를 가져오는 방식과는 다르게 접근해야한다.
바뀐 api 응답 구조다.
그럼 기존의 data에 접근했던 방식으로는 data는 객체 타입인게 맞다.
그러니 data.data 처럼 실제 리뷰 데이터를 담고 있는 배열에 접근해야 한다.
4.문제 해결
01) req url 변경
기존 요청 방식)
변경 요청 방식)
02) 타입스크립트 변경
기존에는 Review_Data 타입만 있었던걸, Review_Full를 추가했다.
데이터 불러올 때 Review_Full 타입을 명시해줬다.
03) data 접근 방식 변경
기존에 data 로 접근해서 객체를 map으로 뿌려줬던 잘못된 방식에서, data.data로 배열로 접근을 했다.
5.고민
백엔드 개발자 분과 discord로 소통하고, jira로 진행상황을 공유하고 있다.
소통하는 방식에서 요즘 고민이 많다.
공유된 "화면설계"가 없으니, 소통을 할 때 서로 다른걸 생각하고 이야기하는 경우가 생긴다.
또 이런 상황에서 분명하게 요청사항을 기록하지 않으면 백엔드 분이 헛고생을 하는 경우가 생기고 있다.
예를들어) "메인" 리뷰 api 변경 요청 사항을, 백엔드분은 "상세페이지" 리뷰 api로 변경해주셨다.
'그때 이야기 했으니,,,'라는 안일한 생각에 간략하게 정리해서 디스코드에 남긴 것은 좋지 않다.
시간은 흘러 기억은 사라진다.
사실, 오늘 블로그에 기록한 error도, error로 코드를 수정했으면 안됐다.
백엔드 분이 데이터를 변경했으니, 변경을 할 생각을 했어야 했는데
디스코드에 정보가 퍼져있다보니, 내가 어떤 코드를 변경해야 하는지 까먹는다.
error가 왜났는지 고민하고 찾다가 그제서야 생각이 난다.
'아 데이터 변경해주셨지'
서로의 요청사항을 분명하게 기록하고, 한 곳에 모아 자신이 해야할 일을 인지할 수 있도록 해야겠다.
