SSG, SSR & ISR Rendering

// app/about/page.jsx — no request data → static (built once)
export default function About() {
  return <h1>About EduSite – since 2018</h1>
}

// app/courses/[slug]/page.jsx — static pages for every slug
export function generateStaticParams() {
  return courses.map((c) => ({ slug: c.slug }))
}

// app/dashboard/page.jsx — reads cookies → dynamic (rendered per request)
import { cookies } from 'next/headers'

export default async function Dashboard() {
  const store = await cookies()
  const name = store.get('student')?.value ?? 'Guest'
  return <h1>Welcome back, {name}</h1>
}

// app/blog/page.jsx — static, but rebuilt at most every 10 minutes
export const revalidate = 600

export default async function Blog() {
  const res = await fetch('https://cms.example.com/posts', { next: { revalidate: 600 } })
  const posts = await res.json()
  return posts.map((p) => <h2 key={p.id}>{p.title}</h2>)
}

// components/Clock.jsx — rendered and updated in the browser
'use client'
import { useEffect, useState } from 'react'
export default function Clock() {
  const [now, setNow] = useState('')
  useEffect(() => {
    const id = setInterval(() => setNow(new Date().toLocaleTimeString('en-IN')), 1000)
    return () => clearInterval(id)
  }, [])
  return <span>{now}</span>
}