DEV Community
•
2026-04-21 03:41
head.tsx Is Just a React Component: Dynamic SEO Meta from Loader Data
Look at how most frameworks handle <head>:
// Next.js
export const metadata = {
title: 'Blog Post',
description: '...',
openGraph: { title: '...', images: [...] },
}
// Remix
export const meta: MetaFunction = ({ data }) => [
{ title: 'Blog Post' },
{ name: 'description', content: '...' },
{ property: 'og:image', content: data.post.coverImage },
]
Metadata is a config...
![I Do the Same 4 Steps Every Time I Scan a Document. So I Automated All of Them. [Devlog #5]](https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fq6m6p3rbsfnr27sjvfe3.gif)
