どう動くものなのか、Next.jsのお気持ちがわからんのでメモ。
TL;DR
SPAのイメージ通りのClient Side Renderingも、サーバサイドでレンダリングするSSRも、事前にレンダリングしておくSSGも、さらには事前に生成しつつ必要に応じて再生成するISRも、組み合わせて使える。
getServerSideProps があるとSSRだよ！
レンダリング
Client Side Rendering(CSR)
CSRは、ページを表示する流れとして、
→ HTMLを取得して → HTMLからJSを読み込み → JSがAPIリクエストをしてデータを取得 → JS(React)がページをレンダリングする
Server Side Rendering(SSR)
SSRは、サーバサイドでHTMLを生成して返す。サーバサイドでやってきたやつ。
Static Site Generation(SSG)
事前に全てビルドしておくやつ。
Incremental Static Regeneration(ISR)
SSG生成しておくけれど、必要に応じて再生成したりするやつ
Next.jsの動作をコントロールする
Next.jsはCSR/SSR/SSGを組み合わせて使える。
SSRにするには pages以下のコンポーネントで getServerSideProps を定義してexportする。
SSGにするには pages以下のコンポーネントで getStaticPaths と getStaticProps を定義してexportする。
それ以外はCSR ということで良いのかな？
next export
観点替わるけれど、Node.jsサーバ無しで実行できるファイルを書き出すには next export する。
S3とかに置いて動かせる。
代わりに next exportでは使えない機能 がある。