【8章】Next.js基礎学習＋課題の振り返り

今回、前回の実装をReactからNext.jsに置き換えれる箇所は置き換えることをした。コーディングでは、全くわからないので、検索と生成AIに頼った。ただ、それでも、まともなものができているかはわからなかった。

提出することで、知ったことがある。Reactのモジュールでコードを組んでいた箇所で、上層からIDを渡す時に、下記のようなコードを組めばいいということ。腕力で強引に組むよりも、ずっといいやり方があることを知った。

この変更により気づいたことですが、Visual Studio CodeのESLintでは、エラーの原因がわかりづらい。内部の変数への値の代入が間違っていたのですが、関数全体がサポートされていないような表示になり、かなり悩んだ。一度経験したので、今後は気をつけたい。

interface Props {
  params: Promise<{
    id: string;
  }>;
}

export default async function Page(props: Props) {
  const { id } = await params;
}