Кантэнт у макеце сайта ў 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.