Server Componentのpage.tsxから、ボタンのクリック処理を持つClient Componentを読み込んで表示したいです。正しい理解はどれですか？

解説

正解: Server ComponentからClient Componentをimportして表示することはできるApp Routerでは、Server Componentの中にClient Componentを子として配置できます。サーバー側で静的な部分やデータ取得を処理し、必要な部分だけをクライアントでハイドレーションする構成が基本です。補足: ただしClient Componentへ渡すpropsはJSONとして表現できる値に限るのが原則です。関数やクラスインスタンスを直接渡す設計は避けます。A. Server ComponentからClient Componentをimportして表示することはできる: これが正解です。B. Client ComponentはClient Componentからしかimportできない: Server Componentから子として使うことは可能です。C. Client Componentを使うページではpage.tsxにも必ず同じディレクティブを書く: ページ全体をクライアント化する必要はありません。D. Client Componentを使うにはRoute Handler経由でHTMLを返す必要がある: Route HandlerはAPI用途であり、コンポーネント境界の条件ではありません。