Breadcrumbs Example

Example Breadcrumbs:

Usage in Server Components:

import { Breadcrumbs, generateBreadcrumbsFromPath } from "@/components/Breadcrumbs";

export default function MyPage() {
  const breadcrumbs = generateBreadcrumbsFromPath("/vocabulary/a1/food");
  
  return (
    <div>
      <Breadcrumbs items={breadcrumbs} />
      {/* Your page content */}
    </div>
  );
}

Usage in Client Components:

"use client";
import { BreadcrumbsClient } from "@/components/BreadcrumbsClient";

export default function MyPage() {
  return (
    <div>
      <BreadcrumbsClient />
      {/* Your page content */}
    </div>
  );
}