Curriculum Outline

Vertical learning path with done, current, and locked steps connected by a colored rail.

Your learning path

Foundations

Patterns & hooks

Performance tuning

Shipping at scale

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Education7 } from "@/components/beste/piece/education7";

<Education7
  title="Your learning path"
  steps={[
    {
      "title": "Foundations",
      "status": "done"
    },
    {
      "title": "Patterns & hooks",
      "status": "done"
    },
    {
      "title": "Performance tuning",
      "status": "current"
    },
    {
      "title": "Shipping at scale",
      "status": "locked"
    }
  ]}
/>