[Next.js] LinkコンポーネントとuseRouterの違い

に公開

はじめに

Next.jsの学習の為に、下記書籍を読みました。
下記書籍のLinkコンポーネントとuseRouterの違いについて情報を整理したかったので、執筆します。

結論

  • ユーザーがクリックすることで別のページにナビゲートするための宣言的な方法を提供する
  • 主に静的なリンクや、アプリケーション内の他のページへのリンクを作成する際に使用する
  • ページ間のナビゲーションを高速化するために、クライアントサイドのナビゲーションを実現する->これにより、ページ遷移が高速になり、フルページのリロードを避けることができる

useRouter について

  • Next.js のルーティング機能にアクセスするためのフックです。
  • 現在のルートの情報を取得したり、プログラムによるページ遷移(例えば、フォームの送信後に別のページにリダイレクトする)を行う場合に使用する
  • pushreplacequeryなどのメソッドやプロパティにアクセスでき、これらを使って動的にページ遷移を制御したり、現在の URL のクエリパラメータを読み取ることができます。

Discussion