Generarea Dinamică de Imagini Social Media (opengraph-image.tsx) în Next.js

// app/articole/[slug]/opengraph-image.tsx
import { ImageResponse } from 'next/og';

export const size = { width: 1200, height: 630 };
export const contentType = 'image/png';

export default async function Image({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = await params;

  return new ImageResponse(
    (
      <div style={{ fontSize: 64, background: '#0b0f19', color: 'white', width: '100%', height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        Articol: {slug} | Dexblog.ro
      </div>
    ),
    { ...size }
  );
}

Configurare Zero: Next.js detectează automat fișierul și adaugă antetele corespunzătoare <meta property="og:image"> în documentul HTML fără intervenție manuală.