Садржај у изгледу сајта у NextJS-у

Размотримо главни изглед сајта, који смо почели да разматрамо у претходној лекцији:

export default function RootLayout({children}) {
	return (
		<html lang="en">
			<body>
				{children}
			</body>
		</html>
	);
}

Као што видите, изглед сајта представља компоненту са функцијом. При томе у параметар функције се прослеђује објекат, из ког извлачимо кључ children у одговарајућу променљиву. У овој променљивој се чува садржај фајла page.jsx, који одговара траженом URL-у.

Односно у фајлу layout.jsx нама се чува изглед сајта, а помоћу променљиве children наводимо место у изгледу сајта, у које треба да се уметне садржај странице.

За пример, хајде да обликујемо садржај странице у неки таг:

export default function RootLayout({children}) {
	return (
		<html lang="en">
			<body>
				<main>
					{children}
				</main>
			</body>
		</html>
	);
}

Обликујте садржај вашег сајта у тагу main.