4월 19일

미들웨어는 여러가지가 있을 수 있고, 체크해서 넘어간다.
공통사항
asset 폴더를 만들어서 이미지 등을 넣어놓는다.
하드코딩: /login 등 여러군데에서 쓰이는 것은 공통화(변수화)를 한다.
navigation.config.ts 등에 경로에 대한 것을 한번에 정리할 수 있게 한다. 반복되는 것은 빼세요.
미들웨어에서 왜 학교인정에 대한 것을 다루는가? : 학교인증을 안한 사람이 들어갈 수 있는 페이지가 한정되기 때문에 각각 하기에는 비효율적이다.
초반에 걸러낼 수 있는 로직이 있는 경우(특정 경로)에는 필터링을 먼저 거는게 좋다.
usequery에 타입을 지정할 수 있다 ⇒ 옵셔널체이닝이 너무 많다.
절대경로로 바꿀 수 있는지.
queryFn에 async await는 없어도 된다.
useState에서 state를 쓰지 않으면 삭제하는 것이 좋다.
쿼리의 mutate 인자는 하나여야 한다. 두개 이상이면 작동하지 않는다.
Navbar
상단에서 구독해서 리얼타임으로 모두 영향권에 넣는다.
isLoading과 isPanding의 차이?
isLoading 등은 스켈레톤이 구현되는 것이 좋다.
프로필 이미지가 변경되지 않는 이유 : supabase, react-query를 함께 썼을 때의 오류일 확률이 있다. 이 경우에는 조정이 불가능할 수 있다.
Review
서버에서 정렬해서 클라이언트로 가져올 수 있다.
페이지네이션은 1페이지면 필요 없으니 보이지 않게 한다.
meetingRoom
useSuspensequery를 쓰는 상위에서 사용된다. : 무거운 컴포넌트는 써야 하는 고민이 필요하다. 느려질 수 있다.
데이터가 다 받아와질때까지 기다렸다가 → 없으면 무한로딩이 들린다.
끊기는것 에니메이션을 넣으면 된다. 슬라이더로? 하나씩 넘어가게? react-slick!
내려가면 작아지고, 위로 올리면 다시 커지게?
상수는 선언해서 사용하기
onClick에서 매개변수가 없으면 괄호가 없게 만들어라.
길면 컴포넌트 분리를 하세요.
위쪽 데이터 부분은 스켈레톤 넣으면 좋을듯
페이지의 이름은 대문자로 시작하고 뒤에 페이지를 넣는다.
네트워크 통신 오류면 catch의 오류로, supabase의 데이터의 오류는 error를 나온다.
postgres_change는 회사에서 제공하는 것
new: chatRoomPayloadType 등으로 as 대신 넣을 수 있다.
함수를 만들 때 async가 있는 것도 있고, 없는 것도 있다.
mutateAsync는 await를 걸어줄 수 있다. promise를 반환하지 않아도 가능하다.
female이 너무 많이 사용된다. ⇒ 변수로 바꾸서 사용한다.
tailwind로 지정하고 클래스로 들어온다. : 반복적인 이미지?
usequery는 isloading 처리: isLoading을 쓰는 부분은 optional chainging을 하는 경우에, enable 처리를 하는 경우가 좋다.
isfetching은 리벨리데이트에서도 true다. isLoading은 갱신 안된다.