inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

한 입 크기로 잘라먹는 Next.js

5.2) 풀 라우트 캐시 2

강의에서 인덱스 페이지는 정적 페이지인 건가요 동적 페이지인 건가요?

해결된 질문

262

고고고

작성한 질문수 3

0

처음에 인덱스 페이지는 정적 페이지인데 그 안에 있는 useSearchParams 훅을 사용해서 오류가 난 걸 해결했잖아요 근데 그 후 빌드를 실행하고 결과를 보니 not found 페이지 외에는 다 동적 페이지로 나오는데 그럼 인덱스 페이지는 정적 페이지인 건가요 동적 페이지인 건가요?

react typescript next.js

답변 2

0

이정환 Winterlood

안녕하세요 이정환입니다.

5.2 챕터에서 말씀하시는 거라면 동적 페이지 -> 정적 페이지로 변환하는 과정을 설명드리고 있습니다.

따라서 강의 막바지인 14분 5초 경에는 다음과 같이 인덱스 페이지가 스태틱 페이지로 설정됩니다.

image.png

 

1

고고고

5.2 챕터의 2분 7초 경에 '인덱스 페이지를 정적으로 생성하다가...'라고 하셔서 저는 처음에 인덱스 페이지가 정적 페이지인 줄 알았거든요 근데 그 후에 동적 페이지를 정적 페이지로 변환하셔서 그 부분이 헷갈려 여쭤봤습니다!

1

이정환 Winterlood

안녕하세요 아..! 그렇군요 오해가 있었네요 ㅠㅠ 죄송합니다.

빌드타임에 오류가 발생하는거라고 이해하시면 될 것 같습니다!

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. 만두찐빵님.

Next.js에서 페이지가 정적(Static) 인지 동적(Dynamic) 인지는 페이지의 데이터를 얻는 방식에 따라 달라집니다. 기본적으로 특정 데이터를 사용하여 페이지를 렌더링할 때, 정적 생성(Static Generation) 또는 서버 측 렌더링(Server-Side Rendering)을 선택할 수 있습니다.

만두찐빵님께서 질문하신 인덱스 페이지의 경우 useSearchParams 훅을 사용하셨다면, 서버 측이나 정적으로 데이터를 얻는 과정이 아닌 클라이언트 측에서 동적으로 데이터를 검색하고 반영하는 구조일 가능성이 큽니다.

다음과 같은 기존 질문과 답변들이 만두찐빵님께 도움이 될 수 있습니다:

  1. On-Demand ISR 방식을 index 페이지에 적용하는 방법

    • 이 질문에서는 On-Demand ISR을 어떻게 인덱스 페이지에 적용할 수 있는지 다룹니다. 이와 같이 서버 요청을 통해 동적으로 페이지를 갱신하는 방식과 relate된 내용을 찾아보실 수 있습니다.
  2. 4.1) 빌드 시 오류 질문 드립니다.

    • 이 질문은 Next.js 빌드 시 발생하는 오류와 관련하여 정적 페이지와 동적 페이지의 차이점을 이해하는 데 도움이 될 수 있습니다. 특히 useSearchParams와 같은 클라이언트 측 훅의 사용에 관한 문제를 다루고 있으니 참고하시기 바랍니다.

페이지의 재생성을 위해 사용된 방법에 따라 인덱스 페이지가 동적 페이지로 처리될 수 있습니다. 특히 전체 빌드 후 결과에서 대부분의 페이지가 동적(Dynamic)으로 나오는 것은 서버에서 요청을 받을 때마다 데이터를 렌더링해야 하는 구조이기 때문일 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

풀라우트캐시 동작 원리에서 데이터 캐시 관련 질문

0

48

2

next.js 프로젝트

0

47

1

Next.js + Tanstack Query BFF 구조 질문

0

44

2

Next.js 사전렌더링 이해하기 부분

0

49

2

모달 관련 질문

0

51

3

렌더링 관련 질문

0

89

2

중복으로 하나의 api를 요청할 때 캐싱 옵션 통일화

0

73

2

라우트 세그먼트 옵션 강좌 노트에 사소한 제보 남깁니다.

0

72

2

SSR시 context에 params말고 query를 사용하면 안되나요?

0

87

2

npx prisma db push 시 에러가 뜹니다.

0

104

3

vercel 배포를 실패하였습니다.

0

116

3

Image 컴포넌트 사용시 브라우저 콘솔에 경고는 왜 뜨는걸까요?

0

68

2

getServerSideProps 함수와 SSR의 관계

0

85

6

없는 페이지인데 풀라우트캐시로 저장이 되는 이유가 궁금합니다

0

66

2

실제 프로젝트에서 SSR 사용에 관해서 질문드립니다.

0

120

2

일반적인 nextjs project architecture에 대하여..

0

96

2

2.14 Search에서 작성한건 static이긴하지만 CSR이 아닌가요?

0

79

2

배포 시 오류 발생

0

94

2

백엔드 서버 오류납니다.

0

92

2

취약점 제거시 nestjs 버전 문제가 생길까요?

0

100

1

eslint.config.mjs 내 rules 어떻게 설정 하나요?

0

113

1

[book]/[id]/page.tsx 모달 띄울 때 성능 하락 현상은 ReviewList를 불러오면서 발생하는 문제 같습니다.

0

69

2

빨간줄 설정

0

87

2

익스텐션 질문

0

64

1