TIL 23.08.18 [App router] layout

TIL

TIL 23.08.18 [App router] layout

passionfruit 2023. 8. 18. 21:31

Layout

layout 페이지는 앱 라우터에서 공통된 설정을 적용하는 페이지로 itle, description 은 제목과 내용을 설정해주면 제목에 들어간다.

import "./globals.css";
import Link from "next/link";

export const metadata = {
  title: "Create Next App",
  description: "Generated by create next app",
};

export default function RootLayout({ children }) {
  return (
    <html>
      <Link href="/">WEB</Link>
      <body>{children}</body>
    </html>
  );
}

메인페이지

import Image from "next/image";

export default function Home() {
  return (
    <>
      <h2>Welcome</h2>
    </>
  );
}

Detail 페이지

import React from "react";

const page = () => {
  return <div>page</div>;
};

export default page;

저작자표시 (새창열림)