Zenn
Open1

Next.js学習メモ

Next.js
React
non_technon_tech

App Routerを利用したページ遷移

importすべきもの

import Link from "next/link";

ホーム画面

import Link from "next/link";

export default function Home() {
  return (
    <div>
      <p>Home</p>
      <Link href="/about">about</Link>
    </div>
  );
}

About画面

appディレクトリ内にaboutディレクトリを作成し、その中にpage.tsxを作成する

import Link from "next/link";

export default function AboutPage() {
  return (
    <div>
      <p>About</p>
      <Link href="/">Home</Link>
    </div>
  );
}