Динамично преношење метаподатака из садржаја у NextJS

У претходној лекцији смо научили да постављамо метаподатке у садржају сајта. Овај метод је добар, али није увек примењив. Проблем је што се метаподаци странице могу мењати у зависности од параметара динамичке руте.

Погледајмо на примеру. Претпоставимо да имамо фајл са садржајем за приказ корисника по његовом id. Нека у овом фајлу постоји низ са корисницима:

let users = [
	'user1',
	'user2',
	'user3',
	'user4',
	'user5',
];

Хајде да прикажемо податке корисника који одговара прослеђеном параметру:

export default function User({ params }) {
	return <>
		<h1>корисник {params.id}</h1>
		<p>
			име: {users[params.id]}
		</p>
	</>;
}

Вратимо се сада на наш проблем. Пошто приказујемо различите кориснике, метаподаци за њих такође морају бити различити. Морамо их динамички формирати, у зависности од вредности параметра.

То се ради помоћу специјалне функције generateMetadata, коју морамо експортовати из наше компоненте:

export const generateMetadata = () => {
	return {
		title: '',
		description: '',
	};
};

У овој функцији су нам доступни параметри руте:

export const generateMetadata = ({params}) => {
	console.log(params);
};

Хајде да враћамо потребне метаподатке у зависности од вредности параметра:

export const generateMetadata = ({params}) => {
	return {
		title: `Страница за корисника {params.id}`,
		description: `Опис за корисника "{users[params.id]}"`,
	};
};

Направите руту која обрађује адресе облика /post/:id, где уместо :id може бити било који број.

Нека је дат следећи низ:

let posts = [
	{
		id: '1',
		title: 'објава 1',
		desc: 'опис за објаву 1',
		text: 'текст1 текст1 текст1 текст1 текст1 текст1 текст1 текст1',
	},
	{
		id: '2',
		title: 'објава 2',
		desc: 'опис за објаву 2',
		text: 'текст2 текст2 текст2 текст2 текст2 текст2 текст2 текст2',
	},
	{
		id: '3',
		title: 'објава 3',
		desc: 'опис за објаву 3',
		text: 'текст3 текст3 текст3 текст3 текст3 текст3 текст3 текст3',
	},
];

export default function Post() {
	
}

Направите тако да за задати id буде приказано HTML кôд потребне објаве, као и да се постави исправан наслов и мета-опис.