🧐 문제/목표 파악
사실 손수 백엔드를 만들어서 배포하는 게 늘 해오던 거라 속편하긴한데, Baas(서비스형 백엔드)도 한번 써보고 싶기도하고, 써보는 능력도 도 필요할 거 같아서 도전했다. Netlify로 클라이언트를 구축중이라 동일하게 연동이 잘되는 서비스로 Convex를 찾았다. 해당 서비스의 공식 문서에 따라 useQuery 훅으로 데이터를 불러올 수 있다고 해서 시도했는데 에러가 떴다.

에러 메시지가 말하는 바는 분명했다.
Hooks can only be called inside of the body of a function component.
그러니까 나는 지금 useEffect라는 훅 안에 useQuery라는 훅을 썼기 때문에 에러를 맞닥뜨린 것이다.
🎯 문제/목표 해결

useQuery는 페이지를 랜더링할 때, 딱 처음에만 호출되어야 한다.
내가 원하는 것은 그것인데, useEffect밖에서 쓰니, 다른 useEffect(1초마다 갱신하는)의 영향을 받아, useQuery도 1초마다 호출되어 에러가 발생했다.
즉, useQuery를 한번만 호출하는 정보를 얻던가, 그 대신 다른 메서드를 찾아야한다는 것.
그러다가 나는 Node.js에서는 리액트 훅을 안쓴다는 것을 떠올리고 해당 문서를 참고했다.

Node.js에서는 'convex/browser'의 ConvexHttpClient로 데이터를 fetch해 받아오는 것으로 이해되어 적용해보았다.
결과는 성공....!
깨달은 점
공식문서의 불친절함을 인정하고 그 안에서 나만의 창의력으로 문제를 바라보자
'Today I Errored 🔥 (문제해결력)' 카테고리의 다른 글
| [kaplay] 동영상 강의를 보고 똑같이 코드를 쳐도 에러가 뜨는 이유 (0) | 2024.06.24 |
|---|---|
| [Convex] 배포된 서버에서 convex함수가 작동되지 않는 건에 대하여 (0) | 2024.06.24 |
| [kaplay] 크롬정책과 BGM 설정 (0) | 2024.06.21 |
| [kaplay] 플레이어 Touch 조작 총정리 (0) | 2024.06.21 |
| [Kaplay] 기존의 템플릿에 내가 필요한 기능을 녹여내기 (0) | 2024.06.19 |