เมตาดาต้าใน NextJS

ตอนนี้เรามาดูวิธีการเพิ่ม title และคำอธิบายเมตา (meta description) ลงในหน้าเว็บ ใน NextJS การทำงานกับสิ่งเหล่านี้จะดำเนินการร่วมกัน ดังนั้นจึงเรียกด้วยคำทั่วไปว่า เมตาดาต้า

เมตาดาต้าถูกกำหนดโดยใช้ออบเจ็กต์พิเศษที่ประกอบด้วย title และคำอธิบายเมตา:

{
	title: '...',
	description: '...',
};

ในขณะเดียวกัน NextJS จะทำการแทรกเมตาดาต้าในแท็กที่เกี่ยวข้องโดยอัตโนมัติ เราไม่จำเป็นต้องกังวลเกี่ยวกับเรื่องนี้ ดังนั้นในโครงร่างหลักของเว็บไซต์จึงไม่มีแท็ก head เพราะมันจะถูกสร้างขึ้นโดยอัตโนมัติ:

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

มีวิธีต่างๆ ในการกำหนดเมตาดาต้า ซึ่งเราจะศึกษาในบทเรียนต่อไป