Metadata & SEO

// app/courses/page.jsx  (EduSite)
export const metadata = {
  title: 'All Courses',
  description: 'Coding courses in C, Python, Web Development, Next.js, Android and MySQL with fees and duration.',
  alternates: { canonical: '/courses' },
}

// app/layout.jsx  (EduSite)
import { site } from '@/lib/site'

export const metadata = {
  metadataBase: new URL(site.url),          // makes relative URLs absolute
  title: {
    default: `${site.name} – ${site.tagline}`,   // used when a page sets no title
    template: `%s | ${site.name}`,                // "All Courses | EduSite"
  },
  description: site.description,
  alternates: { canonical: '/' },
  openGraph: { type: 'website', siteName: site.name, locale: 'en_IN' },
  twitter: { card: 'summary_large_image' },
  robots: { index: true, follow: true },
}

export const viewport = { themeColor: '#4f46e5' }

// app/courses/[slug]/page.jsx  (EduSite)
export async function generateMetadata({ params }) {
  const { slug } = await params
  const course = getCourse(slug)
  if (!course) return { title: 'Course not found' }
  return {
    title: `${course.title} Course (${course.duration})`,
    description: `${course.summary} Fee ${rupees(course.fee)}. Level: ${course.level}.`,
    alternates: { canonical: `/courses/${course.slug}` },
    openGraph: { images: [course.image] },
  }
}

// app/opengraph-image.jsx  (EduSite) — generates a 1200×630 PNG
import { ImageResponse } from 'next/og'
import { site } from '@/lib/site'

export const alt = `${site.name} – ${site.tagline}`
export const size = { width: 1200, height: 630 }
export const contentType = 'image/png'

export default function OpengraphImage() {
  return new ImageResponse(
    (
      <div style={{ width: '100%', height: '100%', display: 'flex', flexDirection: 'column',
                    justifyContent: 'center', padding: 80,
                    background: 'linear-gradient(135deg,#4f46e5,#0f172a)', color: '#fff' }}>
        <div style={{ fontSize: 88, fontWeight: 800 }}>{site.name}</div>
        <div style={{ fontSize: 44, marginTop: 16, opacity: 0.9 }}>{site.tagline}</div>
      </div>
    ),
    size
  )
}

// components/JsonLd.jsx  (EduSite)
export default function JsonLd({ data }) {
  return (
    <script type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(data).replace(/</g, '\\u003c') }} />
  )
}

// app/courses/[slug]/page.jsx — Course schema
<JsonLd data={{
  '@context': 'https://schema.org',
  '@type': 'Course',
  name: course.title,
  description: course.summary,
  provider: { '@type': 'Organization', name: site.name, sameAs: site.url },
  offers: { '@type': 'Offer', price: course.fee, priceCurrency: 'INR', category: 'Paid' },
}} />

// app/blog/[slug]/page.jsx — BlogPosting schema
<JsonLd data={{
  '@context': 'https://schema.org',
  '@type': 'BlogPosting',
  headline: post.title,
  datePublished: post.date,
  author: { '@type': 'Organization', name: site.name },
}} />