Метадані та SEO-оптимізація в Next.js App Router

import type { Metadata } from 'next';

export const metadata: Metadata = {
  // Обов'язково: базовий домен для коректного резолву відносних шляхів в абсолютні URL
  metadataBase: new URL(process.env.NEXT_PUBLIC_APP_URL || 'https://agenticlab.dev'),
  
  title: {
    template: '%s | Fullstack Agentic Lab',
    default: 'Fullstack Agentic Lab — Освітня платформа для інженерів',
  },
  description: 'Поглиблені курси з Next.js, React, архітектури баз даних та агентних систем.',
  keywords: ['Next.js 15', 'React 19', 'TypeScript', 'App Router', 'Fullstack'],
  authors: [{ name: 'Команда Fullstack Agentic Lab', url: 'https://agenticlab.dev' }],
  creator: 'Fullstack Agentic Lab',

  openGraph: {
    type: 'website',
    locale: 'uk_UA',
    url: 'https://agenticlab.dev',
    siteName: 'Fullstack Agentic Lab',
    title: 'Fullstack Agentic Lab — Освітня платформа для інженерів',
    description: 'Високопродуктивна програма навчання для досвідчених інженерів.',
    images: [
      {
        url: '/og-default.png', // Перетворюється на https://agenticlab.dev/og-default.png
        width: 1200,
        height: 630,
        alt: 'Прев’ю платформи Fullstack Agentic Lab',
      },
    ],
  },

  twitter: {
    card: 'summary_large_image',
    title: 'Fullstack Agentic Lab',
    description: 'Архітектура сучасного стека Next.js, React та AI-агентів',
    images: ['/og-default.png'],
  },

  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      'max-video-preview': -1,
      'max-image-preview': 'large',
      'max-snippet': -1,
    },
  },
};

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="uk">
      <body>{children}</body>
    </html>
  );
}

import type { Metadata, ResolvingMetadata } from 'next';
import { notFound } from 'next/navigation';

interface BlogPostPageProps {
  params: Promise<{ slug: string }>;
  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
}

// Запит через шар доступу до даних (DAL) з дедуплікацією
async function getPostBySlug(slug: string) {
  // Реальна реалізація: return await db.post.findUnique({ where: { slug } });
  if (slug === 'not-found') return null;
  return {
    slug,
    title: 'Архітектура React Server Components',
    excerpt: 'Поглиблений посібник із серіалізації та стрімінгу через протокол React Flight.',
    publishedAt: '2026-03-01T10:00:00.000Z',
    updatedAt: '2026-03-05T14:30:00.000Z',
  };
}

export async function generateMetadata(
  { params }: BlogPostPageProps,
  parent: ResolvingMetadata
): Promise<Metadata> {
  // Обов'язковий await для params у Next.js 15+
  const { slug } = await params;
  const post = await getPostBySlug(slug);

  if (!post) {
    return {
      title: 'Статтю не знайдено',
    };
  }

  // За потреби успадковуємо або доповнюємо зображення з батьківських layouts
  const parentImages = (await parent).openGraph?.images || [];

  return {
    title: post.title, // Перетворюється на: "Архітектура React Server Components | Fullstack Agentic Lab"
    description: post.excerpt,
    alternates: {
      canonical: `/blog/${post.slug}`, // Розв'язується через metadataBase
    },
    openGraph: {
      type: 'article',
      publishedTime: post.publishedAt,
      modifiedTime: post.updatedAt,
      title: post.title,
      description: post.excerpt,
      images: [`/blog/${post.slug}/og-image.png`, ...parentImages],
    },
  };
}

export default async function BlogPostPage({ params }: BlogPostPageProps) {
  const { slug } = await params;
  const post = await getPostBySlug(slug);

  if (!post) notFound();

  return (
    <article className="max-w-3xl mx-auto py-10 space-y-6">
      <h1 className="text-4xl font-extrabold text-text-primary tracking-tight">{post.title}</h1>
      <p className="text-lg text-text-muted leading-relaxed">{post.excerpt}</p>
    </article>
  );
}

import type { MetadataRoute } from 'next';

export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
  const baseUrl = process.env.NEXT_PUBLIC_APP_URL || 'https://agenticlab.dev';

  // Динамічний запит до бази даних для всіх опублікованих публікацій
  // const posts = await db.post.findMany({ select: { slug: true, updatedAt: true } });
  const posts = [
    { slug: 'rsc-deep-dive', updatedAt: new Date('2026-03-01') },
    { slug: 'form-validation', updatedAt: new Date('2026-03-04') },
  ];

  const postUrls: MetadataRoute.Sitemap = posts.map((post) => ({
    url: `${baseUrl}/blog/${post.slug}`,
    lastModified: post.updatedAt,
    changeFrequency: 'weekly',
    priority: 0.8,
  }));

  return [
    {
      url: baseUrl,
      lastModified: new Date(),
      changeFrequency: 'daily',
      priority: 1.0,
    },
    {
      url: `${baseUrl}/courses`,
      lastModified: new Date(),
      changeFrequency: 'weekly',
      priority: 0.9,
    },
    ...postUrls,
  ];
}

import type { MetadataRoute } from 'next';

export default function robots(): MetadataRoute.Robots {
  const baseUrl = process.env.NEXT_PUBLIC_APP_URL || 'https://agenticlab.dev';

  return {
    rules: [
      {
        userAgent: '*',
        allow: '/',
        disallow: ['/admin/', '/api/', '/dashboard/private/'],
      },
      {
        userAgent: 'Googlebot',
        allow: '/',
        disallow: ['/admin/', '/api/'],
      },
    ],
    sitemap: `${baseUrl}/sitemap.xml`,
  };
}

import React from 'react';

interface CourseJsonLdProps {
  title: string;
  description: string;
  courseUrl: string;
}

export function CourseStructuredData({ title, description, courseUrl }: CourseJsonLdProps) {
  const schema = {
    '@context': 'https://schema.org',
    '@type': 'Course',
    name: title,
    description: description,
    provider: {
      '@type': 'Organization',
      name: 'Fullstack Agentic Lab',
      sameAs: 'https://agenticlab.dev',
    },
    hasCourseInstance: {
      '@type': 'CourseInstance',
      courseMode: 'online',
      courseWorkload: 'PT25H',
    },
    url: courseUrl,
  };

  return (
    <script
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
    />
  );
}

export const metadata: Metadata = {
  title: {
    absolute: 'Fullstack Agentic Lab — Провідна інженерна платформа для Senior розробників',
  },
};

// app/admin/layout.tsx
export const metadata: Metadata = {
  title: 'Консоль адміністратора',
  robots: {
    index: false,
    follow: false,
    nocache: true,
  },
};