Metadatos y Optimización SEO en Next.js App Router

import type { Metadata } from 'next';

export const metadata: Metadata = {
  // Obligatorio: dominio base para resolver rutas relativas en URLs absolutas
  metadataBase: new URL(process.env.NEXT_PUBLIC_APP_URL || 'https://agenticlab.dev'),
  
  title: {
    template: '%s | Fullstack Agentic Lab',
    default: 'Fullstack Agentic Lab — Plataforma Educativa para Ingenieros',
  },
  description: 'Cursos avanzados de Next.js, React, arquitectura de bases de datos y flujos agénticos.',
  keywords: ['Next.js 15', 'React 19', 'TypeScript', 'App Router', 'Fullstack'],
  authors: [{ name: 'Equipo de Fullstack Agentic Lab', url: 'https://agenticlab.dev' }],
  creator: 'Fullstack Agentic Lab',

  openGraph: {
    type: 'website',
    locale: 'es_ES',
    url: 'https://agenticlab.dev',
    siteName: 'Fullstack Agentic Lab',
    title: 'Fullstack Agentic Lab — Plataforma Educativa para Ingenieros',
    description: 'Plan de estudios de alto rendimiento para ingenieros senior.',
    images: [
      {
        url: '/og-default.png', // Se resuelve como https://agenticlab.dev/og-default.png
        width: 1200,
        height: 630,
        alt: 'Vista previa de la plataforma Fullstack Agentic Lab',
      },
    ],
  },

  twitter: {
    card: 'summary_large_image',
    title: 'Fullstack Agentic Lab',
    description: 'Arquitectura avanzada con Next.js, React y agentes de IA',
    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="es">
      <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 }>;
}

// Consulta de la capa de acceso a datos (DAL) con deduplicación
async function getPostBySlug(slug: string) {
  // Implementación real: return await db.post.findUnique({ where: { slug } });
  if (slug === 'not-found') return null;
  return {
    slug,
    title: 'Arquitectura de React Server Components',
    excerpt: 'Guía exhaustiva sobre serialización y streaming con el protocolo 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 obligatorio en params en Next.js 15+
  const { slug } = await params;
  const post = await getPostBySlug(slug);

  if (!post) {
    return {
      title: 'Artículo no encontrado',
    };
  }

  // Opcionalmente hereda o extiende imágenes de layouts padre
  const parentImages = (await parent).openGraph?.images || [];

  return {
    title: post.title, // Se resuelve como: "Arquitectura de React Server Components | Fullstack Agentic Lab"
    description: post.excerpt,
    alternates: {
      canonical: `/blog/${post.slug}`, // Se resuelve mediante 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';

  // Consulta dinámica a la base de datos para todos los artículos publicados
  // 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 — Plataforma de Ingeniería Avanzada para Desarrolladores Senior',
  },
};

// app/admin/layout.tsx
export const metadata: Metadata = {
  title: 'Consola de Administración',
  robots: {
    index: false,
    follow: false,
    nocache: true,
  },
};