getInitialProps 과 getServerSideProps... - 인프런

풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)

새글쓰기 기능 구현

getInitialProps 과 getServerSideProps에 대해서 질문드립니다!

해결된 질문

작성

해당 프로젝트에서 getInitialProps와 getServerSideProps를 동시에 쓰고 있는데 2개의 경우 pre-render를 하기 위해 작성했다고 이해했는데 둘 중 하나만 써도 되는 부분 아닌가요??? 어떤 상황떄문에 2개를 동시에 사용하는지 궁금합니다

rest-api graphql react

답변 1

정재남

지식공유자

둘을 동시에 쓰고 있는것은 아닙니다.
getInitialProps는 오직 _app.js에서만 쓰고 있으며,
이는 app customizing을 위해 필요한 내용입니다.
자세한 내용은 https://nextjs.org/docs/advanced-features/custom-app 를 참고하세요 :)

bj2525

질문자

그렇다면 pre render를 담당하고 있는건 getServerSideProps인거구 getInitialProps는

app customizing시에 해당 문서에 나와있는 장점들을 이용하려고 했던 건가여??

정재남

지식공유자

customizing을 한 _app에서는 'getStaticProps'나 'getServerSideProps'를 사용할 수 없습니다.

App does not support Next.js Data Fetching methods like getStaticProps or getServerSideProps. If you need global data fetching, consider incrementally adopting the app/ directory.

getInitialProps가 어떻게 동작하는지는
https://nextjs.org/docs/api-reference/data-fetching/get-initial-props 를 참고하세요. 특히 SSR과 관련한 다음 문단이 중요합니다.

For the initial page load, getInitialProps will run on the server only. getInitialProps will then run on the client when navigating to a different route via the next/link component or by using next/router. However, if getInitialProps is used in a custom _app.js, and the page being navigated to implements getServerSideProps, then getInitialProps will run on the server.

그밖에 비공식적으로 next.js의 server-side lifecycle을 분석한 블로그 글들을 찾아보시면 흐름을 파악하는 데에 도움이 되리라 생각합니다.

인프런 커뮤니티 질문&답변

getInitialProps 과 getServerSideProps에 대해서 질문드립니다!