IT-Q

Server Component の中で useEffect を使ってデータを取ることはできますか。

使えません。useEffect も useState も Client Component のものです。Server Component はサーバーで1回実行されて結果を返すだけで、再レンダリングがありません。

面接官が見ているのは境界の理解の補強。

これは「一覧データの取得はどこに書きますか。」への追撃質問です。

よくある答えと、面談でどう見られるか

  • 使えない。Server Component ではフックが使えないため
    その通りです。そもそも async にして直接 await できるので不要です。
  • 使えるが、サーバーでは1回しか実行されない
    使えません。Server Component には再レンダリングもライフサイクルも無いので、フックの前提そのものが成り立ちません。
  • 使えないが、'use client' を付ければ使える
    事実としては合っています。ただしこの設問の要点は「Server Component ではフックが使えない」という理由の方です。付ければ使えるのは、それが Client Component になるからです。
  • 使えるが、非推奨とされている
    非推奨ではなく、そもそも使えません。エラーになります。

面接官は何を見ているか

  • できないと答えた
  • Server Component はフックが使えないと理解している
  • サーバーで await すればよいと繋げられた

模範解答

できません。useEffect も useState も Client Component のものです。

Server Component はサーバーで1回実行されて結果を返すだけで、再レンダリングもライフサイクルもありません。だからフックの前提が成り立ちません。

そもそも Server Component では useEffect が要りません。コンポーネント自体を async にして直接 await できるので、「マウント後に取りに行く」という段取りが不要になります。