ルーター

@lazarv/react-serverランタイムには、すべてのルート、リンク、パラメータ、検索パラメータに対するコンパイル時の型安全性を備えた完全な型付きルーターが含まれています。createRouteとcreateRouterを使用して、型付きLinkコンポーネント、型付きフック、スキーマバリデーション、IDEオートコンプリートを定義できます — サーバーとクライアントの両方で。ルートはサーバーレンダリング、クライアント専用、または環境間で共有できます。

ランタイムには型付きルーティングプリミティブの上に構築されたファイルシステムベースのルーターも含まれています。react-server CLIを使用するときにエントリーポイントを省略するだけで、ルーターが自動的に使用されます。サードパーティのソリューションを好む場合は、代わりにReact RouterやTanStack Routerを使用できます。これらのサードパーティルーターの使い方については、サンプル集をチェックしてください。

ルートを定義する方法とルーターを構成する方法について学習し、レイアウト、ページ、ネストされたルート、動的ルート、キャッチオールルートなどのさまざまな種類のルートを作成できます。

アウトレットを作成して、さまざまなレイアウトで使用できるアプリケーションの再利用可能な部分を作成することもできます。また、ルーターではエラー処理およびローディングコンポーネントもサポートされています。

このルーターは、ミドルウェアとAPIルートハンドラーの作成もサポートしており、ページやレイアウトを作成するときに既に学習したすべてのルールと、ファイルシステムを使用してミドルウェアとAPIエンドポイントを作成できます。

このドキュメントは、MarkdownやMDXファイルを使ってページを作成する実例でもあります。これは、アプリケーションで静的ページを作成する非常に簡単な方法です。

次に、ルーターとランタイムを組み合わせて静的Webサイトを生成する方法を学びます。生成するすべてのルートを定義すると、ルーターが静的ファイルを生成します。ページだけでなく、Webサイトのsitemap.xmlなど任意の静的ファイルも生成します。

ルーターには、フラッシュなしのページリロード、ネストされたコンテナサポート、ルートごとのカスタマイズを備えた組み込みのスクロール復元が含まれています — 単一の設定オプションまたは<ScrollRestoration>コンポーネントで有効にできます。

最後に、ニーズに合わせてルーターを設定する方法を学びます。ルートパスや静的ファイルのパブリックパスを定義し、globパターンを使用してルーティングに特定のファイルを含めたり、ルーティングからファイルとディレクトリを除外したりできます。

@lazarv/react-serverがNext.js、TanStack Router、React Routerとどのように比較されるかは、比較表を参照してください。