Next.jsはオープンソースのWebアプリケーションフレームワークです。WebフロントエンドライブラリのReactをベースに構築・開発されています。
サーバーサイドレンダリングや静的なWebサイトの生成などReactをベースにWebアプリケーション開発に便利な機能を追加しています。Reactベースではありますが、フロントエンドだけではなく、サーバーの機能も一部持ち合わせています。
従来のReactアプリケーションはすべてのコンテンツをクライアントサイドのブラウザでレンダリングしていました。
これはReactがWebフロントエンドのレンダリングに特化したライブラリであるためです。Next.jsはReactの機能をサーバーサイドでレンダリングされるアプリケーションにも拡張するために利用できます。
SPA
シングルページアプリケーション(SPA)とは起動時に一度HTML全体をロードし、以後はユーザーインタラクションに応じてAjaxで情報を取得し、動的にページを更新するWebアプリケーションのことです。
SPAは従来型のHTML全体をページ遷移のたびに読み込む方法よりもより高速なUIの動作を実現できます。
ブラウザのURLを指定してサーバーからコンテンツを返す従来の方式ではなく、SPAではページ遷移をクライアントサイドで行います。その際にAjaxを使用して必要な時に必要な部分だけデータを取得してViewを表示するため、オーバーヘッドが軽減されます。
サーバーサイドはJSONをクライアントサイドに渡し、そのJSONを元にクライアントサイドはビューを構築します。
HTMLを逐一渡すのに比べ、JSONを渡す場合はビューの部分的な更新・高速な更新が可能になるメリットがあります。
Contextを利用する目的はpropsによるバケツリレーを避けることです。