inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)

무한 스크롤 기능 구현하기, 더 나은 검색을 위한 SEO 작업하기

무한스크롤 기능, 검색기능 대소문자

100

코딩딩딩

작성한 질문수 2

0

강의 잘 보고 있습니다.

무한 스크롤 기능 구현 해보았는데요

영화가 60개까지 나오고 진행이 되지 않다가 개발자 도구를 켜면 더 스크롤이 되는데 그것도 120번 영화에서 끊깁니다. 머가 문제일까요 ...ㅠ

 

검색기능에서 title 첫글자 대소문자 상관없이 하려면 어디를 수정해야 하나요?

firebase next.js tailwindcss react-query supabase

답변 1

0

로펀

혹시 전체 코드를 저에게 보내주실 수 있을까요? Github 링크 남겨주시거나 초대주시면 코드를 한번 살펴보겠습니다!

0

코딩딩딩

넵~ 깃헙 초대 드렸습니다~!

0

로펀

  1. 쿼리 상으로는 아무리 봐도 문제가 없네요. 제 추측에는 intersection observer 때문인 것 같습니다. 우선 useEffect 함수의 의존성 배열을 아래처럼 수정해보시겠어요?

      useEffect(() => {
        if (inView && hasNextPage && !isFetching && !isFetchingNextPage) {
          fetchNextPage();
        }
      }, [inView, hasNextPage, isFetching, isFetchingNextPage]);
  2. title을 대소문자 구분없이 쿼리 하시기 위해서는 like 함수가 아니라 ilike 함수를 사용하시면 됩니다. 관련 링크

     

0

코딩딩딩

감사합니다 대소문자는 잘 해결 되었습니다. 아직 출력되는 영화 수에 문제가 있는데 말씀해주신 방법으로 수정 후엔 72개 까지 나오고 멈춥니다. 정리하면 수정전에 60개에서 개발자도구를 켜면 120개, 지금은 72개 개발자도구 on 140개 전체..

anjrkanswpdlfrk.JPG.webp

그리고 콘솔에 요렇게 뜨네요. pageParam, pageSize 에 문제가 있는걸까요?

Recoil 에러

0

66

1

투두 리스트 ui 작업 중에 material-tailwind가 리액트와 호환 문제가 있는지 리액트 19에서 18로 낮춰도 인풋과 아이콘 버튼 컴포넌트가 제대로 표시되지 않아요 ㅜㅜ

0

67

1

supabase 오픈 소스 사용에 대해서

0

83

0

next와 react query 버전 업데이트 관련 질문

0

62

1

Vercel 무료버전 서버속도

0

509

2

material 붉은 밑줄

0

107

2

파일 이름이 한글일 때 에러 발생

0

241

2

recoil 타입 에러

0

100

2

강의 code 올려논 github 있나요 ?

0

106

2

아니... 강의 자료가 없나요?

0

173

3

smtp부분

0

85

2

모듈 에러

0

142

2

20:34초에 await이 아무 효과가 없다고 뜨는데 사용하신 이유가 궁금합니다

0

163

2

latest 버전 변경에 따른 프로젝트 설정 방식 업데이트 가능하신가요

0

151

2

개인 개발자 비즈 앱 전환 버튼이 안보여요

0

231

2

supabase에서 가입된 유저를 강제로 로그아웃 시키는 방법?

0

412

2

메세지를 전송하면 DB에는 남는데 화면에 보이지 않아요.

0

127

2

globals.css 설정 질문드립니다

0

258

2

6:29 movie-card-list.tsx파일작성하시기전에

0

82

2

todolist할때 컴포넌트 분리 안했던 것 같은데...

1

130

2

vscode에서 @material-tailwind/react component를 가져왔을 때 뜨는 빨간줄 제거할 수는 없나요?

0

313

2

searchMovies에서 hasNextPage가 필요한 이유

0

132

2

react 19버전에서는 recoil사용이 어렵나요?

0

1472

2

netflix clone 할 때 recoil을 하는 순간 에러가 없어지지 않아요

2

302

3