묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자"로
useInfiniteQuery promise와 react use 사용시 페이지 무한 로딩
리액트 쿼리의 suspense 스트리밍 기능 구현 중 버그가 발생해 인사이트를 얻고자 질문드립니다.상위 컴포넌트에서 useInfiniteQuery로 promise를 반환하고, 해당 promise를 자식 컴포넌트의 props로 넘긴 뒤 React의 use hook으로 감싸서 data를 반환하도록 구현했습니다. 그리고 promise를 throw하는 자식 컴포넌트를 Suspense로 감싸서 promise를 캐치하도록 했는데요.페이지 렌더링 자체는 정상적으로 되는데, request가 완료되지 않는 문제가 있습니다. 크롬 개발자도구의 Network 탭에서 document를 확인하면 "Caution: request is not finished yet"이라는 경고가 표시됩니다.TanStack Query 공식 문서에도 useInfiniteQuery의 promise 사용 시 "This can be used with React.use() to fetch data"라고 명시되어 있어 React use와 함께 사용하라고 안내하고 있는데, 혹시 이 문제의 원인을 알 수 있을까요?참고로 prefetch는 안했습니다. 그리고 prefetch 안하는 방법으로 suspense 스트리밍을 구현하고 싶습니다. 코드는 아래와 같습니다. 감사합니다! export default function DetailReviewWrapper({ pid, userId }: DetailReviewProps) { const { observerRef, isFetchingNextPage, refetch, promise } = useReviewListInfinity({ userId, pid, }) return ( <Suspense fallback={<DetailReviewLoading />}> <DetailReview pid={pid} userId={userId} promise={promise} refetch={refetch} isFetchingNextPage={isFetchingNextPage} observerRef={observerRef} /> </Suspense> ) }export default function DetailReview({ pid, userId, promise, refetch, isFetchingNextPage, observerRef, }: DetailReviewProps) { const data = use(promise) return ( <> <section> <ReviewListView userId={userId} pid={pid} data={data?.list || []} className={cn('review-list')} refetch={refetch} showPoint /> {isFetchingNextPage && <Loading />} <div ref={observerRef} /> </section>export function useReviewListInfinity(params: UseReviewListInfinityProps) { const section = useSearchParams().get('contentType') as SectionType const orderType = useRecoilValue(commentOrderState) const filterType = useRecoilValue(filterTypeState) const { fetchNextPage, hasNextPage, isFetchingNextPage, isLoading, refetch, promise } = useInfiniteQuery({ queryKey: [REVIEW_LIST_KEY, params, orderType, filterType, section], queryFn: ({ pageParam = 1 }) => getReviewApi({ uid: params.userId, pid: params.pid, section, pageInfo: { curPage: pageParam, pageSize: 20, }, orderType: orderType === 'RECOMMENDED' ? 'like' : 'date', filterType, }), select: (data) => { return { list: data.pages.flatMap((page) => page.data.list), info: data.pages[0].data.info, } }, getNextPageParam: (lastPage) => { const nextPage = lastPage.data.pageInfo.curPage + 1 return nextPage <= lastPage.data.pageInfo.pageCount ? nextPage : undefined }, initialPageParam: 1, }) const { observerRef } = useIntersectionObserver({ onScroll: () => { if (hasNextPage && !isFetchingNextPage) { fetchNextPage() } }, }) return { isLoading, isFetchingNextPage, observerRef, refetch, promise, } }const getQueryClient = (): QueryClient => new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, refetchInterval: false, refetchOnReconnect: true, refetchOnMount: true, staleTime: Infinity, gcTime: Infinity, retry: false, experimental_prefetchInRender: true, }, }, }) 무한 로딩 시 개발자 도구 캡쳐이미지입니다.
-
미해결
아이유가 인천 송도로 이사갑니다.
아이유가 인천 송도로 이사갈 예정입니다.
-
해결됨피그마 시작하기
6번강의 샘플예제
6번 강의 스타일 만들기 예제 는 제공이 안되나요? 실습 파일에 없어요
-
해결됨PM을 위한 데이터 리터러시(프로덕트 데이터 분석)
3장 강의자료 다운로드 시, 2강이 다운로드 됩니다.
안녕하세요 3강 강의자료 다운로드 시 2강이 다운로드 되는데 확인가능할까요? 감사합니다!
-
미해결(2026) 일주일만에 합격하는 정보처리기사 실기
1번유형
Int x = 25는 아무것도 아닌건가요? 부모에서 5가 가는게 이해 안됩니다.
-
미해결BHPT - 호스트 기반 모의해킹 기초
받은 메일에는 코드가 없습니다. 그래서 /verify 코드 입력을 진행할 수 없습니다
레드라쿤 가이드북 애플리케이션에서 초대를 받았습니다!메일에는 아래 내용만 있고 코드가 없습니다. 레드라쿤 가이드북레드라쿤 가이드북 애플리케이션에 가입한 기록이 있습니다.아래 버튼을 클릭하여 계정 비밀번호를 설정하고 접근 권한을 얻으세요:비밀번호 설정비밀번호 설정를 클릭할 수 없을 때는 웹 브라우저에서 다음 링크로 접속할 수 있습니다.https://guides.redraccoon.kr/register/invite/ztoviU9MYpbRfBIEhamCAOt5그래서 /verify 코드 입력을 진행할 수 없습니다.
-
미해결한 입 크기로 잘라먹는 실전 프로젝트 - SNS 편
`2.4 Shadcn/ui를 소개합니다` 에서 궁금한 부분이있습니다.
강사님 안녕하세요!! 항상 좋은 퀄리티의 강의를 만들어 주셔서 감사합니다 다름이 아니라 강의를 듣는중 단순 궁금증이 생겨서 질문을 남깁니다!! 14분30초즈음 부터 index.css에서 현재 색상코드가 미리보기 형식으로 background로 표시가 되어있는데, 이건 확장프로그램인걸까요?? 저렇게 미리보기를 할 수 있는게 엄청 좋아보여서요!!
-
미해결정보보안기사 실기 - 문제풀이 중심 Part.5 정보보안 관리, 법률
강의자료
다운받는 강의 자료에는 부가적으로 나오는 개념부분이 빠져있는데 이 장표도 포함해서 업데이트 해주실 수 있나요?
-
해결됨38군데 합격 비법, 2025 코딩테스트 필수 알고리즘
DFS 에서 스택을 사용하는 이유
안녕하세요, 현재 DFS 관련하여 내용을 수강하고 있습니다. (39강. DFS & BFS) 깊이 탐색인 알고리즘인 DFS를 처음엔 재귀로 접근하셨다가 RecursionError의 이유로 스택을 사용하셨는데요, 스택을 생각하게 된 생각의 흐름(?)을 잡아보고싶어 질문을 드리게되었습니다.(나중에 코테 연습 때 대비가 될까하여 더 고민을 해보는 것인데, 시간대비 효율이 나지않는다면 말씀해주세요 ㅎㅎ) 일단 제가 이해한 흐름은 여기까지입니다.DFS는 깊이 우선 탐색깊이 파고들었다가 다시 나오고 반복 그래프의 끝까지 깊이 파고들었다가, 방문하지 않는 노드를 방문하기 위해 나중에 다시 돌아갈 "기준점"이 필요하게 될 것임그렇다면 이전에 어디까지 방문했는지 기록을 해놓아야함어떻게 해야 기록을 더 효율적으로 할 수 있을까?하지만 여기서 스택을 사용해야겠다고 생각이 들게 되는 이유를 찾고 싶습니다 ㅎㅎ 알고리즘을 잘하시는 분들 보시면 이런 부분은 큐를 써야겠고, 스택을 써야겠다 라고 바로 생각을 하시는데, 저로서는 왜 이게 바로 스택을 써야한다고 생각이 드는지 이해가 되질 않아서요 혹여 이전에 강의때 설명하신 부분이라면 죄송합니다..ㅎㅎ
-
해결됨[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
문제 7번, 풀이 코드 cond = df.iloc[1] > mean_2001 관련
저는 저 부분을 아래와 같이 for문 안에 if구문으로 처리 하고 싶었는데...if구절에서 i 값을 찍어보면 처음 값만 데이터 그대로 나오고.. 그 담부턴 어뚱한 값이 나오네요..뭘 잘못한걸까요? ㅠㅠmean_2001 = df.iloc[1].mean() print(mean_2001) #print(df.iloc[1]) #cond = df.iloc[1] > mean_2001 #sum(cond) for i in list2001: if i > mean_2001: print(i)
-
해결됨(2026) 일주일만에 합격하는 정보처리기사 실기
메서드 오버라이드
2025년 2회 코드문제 -1 11:40이해 안되는게 있는데 자식에서 재정의 하면 자식에서 실행되어야 하는거 아닌가요? 순수 부모여서그런건가요? 또한 만약 Parent ref= new 자식이였다면 4P가 되는건가요? 스테틱이면 부모꺼 출력으로 알고 있어서 혹시 제가 잘못 알고 있는부분있으면 추가적으로 알려주세요 ㅜ
-
해결됨코딩 없이 AI 자동화 전문가가 되는 법, n8n 완벽 가이드
4강에서 SerAPI 부분에 에러가 났어요. ^^;
위와 같이 에러가 나네요. ㅠ..ㅠOpenAI에 물어보니 Add Option에서 Add Option Manually나 Expression Editor에 들어가서 q {{ $json.chatInput }} 입력하고 Execute Step을 다시 눌러보면 된다고 하는데...Add Option에 해당 메뉴가 아예 없습니다. ^^+Q&A를 찾아보니 해당 게시글이 몇 개 있는데...당췌 무슨 말인지 잘 모르겠어요. ㅠ..ㅠstep by step으로 화면 캡쳐해서 해결 방법을 좀 보여주시면 안될까요?이제4강인데...벌써 포기할 수는 없어요.부탁드려요~
-
해결됨[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
2회 기출 1번 문제
1번 문제 코드를 짜보았는데 결과 값이 조금 다른 것 같아서 질문 드립니다import pandas as pd df = pd.read_csv("https://raw.githubusercontent.com/lovedlim/inf/refs/heads/main/p1/members.csv") df.nlargest(10, 'views') m=df.loc[21,'views'] df.iloc[:10,-1]=m cond=df['age']>=80 df[cond]['views'].mean()
-
해결됨10주완성 C++ 코딩테스트 | 알고리즘 코딩테스트
3-D 반례
안녕하세요 강사님. 궁금한부분이 반례부분이 잘 이해가 안됩니다. 만약 불이 없을 경우 fireCheck가 0으로 초기화 되는게 왜 안되는지 궁금합니다. 0으로 초기화할 경우에 if (fireVisited[sy][sx] <= jihunVisited[y][x] +1) continue;이부분에서 무조건 true가 되서 그런건가용??
-
미해결[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
혹시 해당 강의에서invalidateQueries를 사용한 이유가 있을까요?
invalidateQueries와 setQueryData이전 강의 영상에서는 네트워크 요청을 최소화의 목적으로 setQueryData를 사용했는데이번 강의 영상에서는 invalidateQueries를 사용한 이유가 있을까요?단순히 궁금해서 입니다!
-
해결됨직장인을 위한 '나만의 AI 직원 만들기' [인프런 어워드 수상]
혹시 수업중 사용하신 프롬프트ppt도 받을수 있을까요?
내용이 너무 좋고 요점 정리가 잘되있어서 실제 프롬프트를 입력할때 항상 옆에 두고 체크하면서 활용하면 많은 도움이 될거같습니다
-
미해결미드저니 마스터 클래스, 미드저니로 생성하고 포토샵으로 완성하는 AI 디자인 실무
4강 스타일 코드로 이미지 생성 실패
Creation failedPersonalization code ``6dw1eg8`` is not compatible with ``--version 6.1``. It is compatible with: ``--version 7`스타일 코드를 클릭해서 만들기 하면 호환 문제로 실패합니다. 버전 7과 버전 6의 구별을 어떻게 하는지 궁금합니다.
-
해결됨전동킥보드로 배우는 임베디드 실전 프로젝트
쓰로틀 신호 입력 받기 - ADC 이론 16:46
SAR ADC의 샘플링 타임을 크게 한다는 것은 결국( 3 cycles -> 15 cycles -> 28 cycles ...)정밀도 향상이라고 강의 영상에서 말씀하셨습니다.그리고, 정밀도 향상과 시간 덜 쓰기는 Trade-off 관계라는 말씀을 하셨습니다.그러면 결국SAR ADC의 샘플링 타임 작게 하기 = 정밀도 하락 but 시간 덜 쓰기(T_conv)SAR ADC의 샘플링 타임 크게 하기 = 정밀도 향상 but 시간 많이 쓰기(T_conv)라고 이해했습니다. 제가 옳게 이해했는지 궁금합니다.
-
미해결C# 윈폼_ 응용프로그램 개발(.NetFramework)
C#.NET 0.5년차~3년차(파트1) 후속강의 질문
C#.NET 0.5년차~3년차(파트1) 후속강의 질문 안녕하세요 혹시 후속 강의 C#.NET 강의가 .NET CORE 강의인지 .NET FRAMEWORK 강의인줄 알려주실 수 있나요??
-
해결됨1시간만에 Chat GPT 클론 with Cursor (원데이 클래스)
api 테스트용 curl 생성 오류
영상처럼 curl -X POST로 시작하는 명령어가 아닌, 다른 명령어가 나오는 거 같습니다. 어떤 점이 문제일까요? 포트는 3001으로 수정된 상태입니다.