getInitialProps
サーバサイドでデータを更新し、ページコンポーネントの引数にそのデータを渡すことができる関数
まず前提として Next の SSR・SSG ではコンポーネントの初期データを設定できる個所が２つある
サーバサイド: サーバでコンポーネントを作るときにデータを取得、設定
クライアントサイド: クライアントで ry)
これの１つ目が getInitailProps
next/linkやRouterでナビゲートするときはローカルで実行される
コードを見たほうがはやい
code:js
// 関数コンポーネント
function Page({ stars }) {
return <div>Next stars: {stars}</div>
}
// getInitalProps はコンポーネントのプロパティとして存在している
Page.getInitialProps = async (ctx) => {
const json = await res.json()
// この返り値がコンポーネントの Props になる
// 返り値はオブジェクト形式のみ
return { stars: json.stargazers_count }
}
export default Page
SSR SSG でも処理を分けるため以下の２つのどちらかに置き換えるのが推奨されている
getServerSideProps: SSR 用
getStaticProps: SSG 用