Код IT
← Каталог

Первая программа на Next.js — Layout и навигация

Фрагмент из «Первая программа на Next.js»: Layout и навигация.

typescript javascriptencyclopedia3-ecosystem-3-meta-frameworks-2731 embed URL статья в энциклопедии
Plain text main.tsx 

import type { Metadata } from 'next';
import Link from 'next/link';

export const metadata: Metadata = {
  title: 'Моё Next-приложение',
  description: 'Первая программа на Next.js',
};

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="ru">
      <body className="p-8 font-sans">
        <nav className="mb-6 flex gap-4">
          <Link href="/">Главная</Link>
          <Link href="/about">О проекте</Link>
          <Link href="/counter">Счётчик</Link>
          <Link href="/notes">Заметки</Link>
        </nav>
        <main>{children}</main>
      </body>
    </html>
  );
}

import type { Metadata } from 'next';
import Link from 'next/link';

export const metadata: Metadata = {
  title: 'Моё Next-приложение',
  description: 'Первая программа на Next.js',
};

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="ru">
      <body className="p-8 font-sans">
        <nav className="mb-6 flex gap-4">
          <Link href="/">Главная</Link>
          <Link href="/about">О проекте</Link>
          <Link href="/counter">Счётчик</Link>
          <Link href="/notes">Заметки</Link>
        </nav>
        <main>{children}</main>
      </body>
    </html>
  );
}