목록스터디/Next.js (2)
구어체로 설명하는 다이어리

getServerSideProps는 Next.js에서 SSR (Server Side Rendering) 하기 위한 방법입니다.서버 단에서 데이터를 받아와 클라이언트 페이지에 렌더링하는데요.이 함수는 페이지를 요청할 때마다 호출되고, HTML을 서버 단에서 먼저 생성하여 클라이언트에 전달합니다.미리 페이지를 생성한다는 점에서 역시 SEO에 좋은 선택입니다. import type { InferGetServerSidePropsType, GetServerSideProps } from 'next';type Repo = { name: string; stargazers_count: number;};export const getServerSideProps = (async () => { // Fetch data f..

Next.js는 Static Site Generation (SSG, 정적 사이트 생성) 을 합니다.SSG는 프로젝트 빌드 시점에 미리 사이트를 만들어 놓는 것인데요.이렇게 미리 사이트를 만들어 놓으면 클라이언트 측에서 페이지에 접속했을 때 서버 측에서는 빌드 시 미리 생성해두었던 페이지를 클라이언트로 전달하고,클라이언트에서는 서버 측에서 받은 페이지를 그대로 뷰에 띄워주기만 하면 되기 때문에 페이지 로딩 속도가 빨라집니다.getStaticProps와 getStaticPaths는 이 SSG를 하기 위한 두 가지 방법입니다. getStaticProps getStaticProps는 빌드 시에 데이터를 가져와서 페이지를 생성합니다. import type { InferGetStaticPropsType, Ge..