Props

📘What it really is

• Props (properties) are values passed into a component, like arguments to a function:

<EnquiryCard name="Asha" subject="Course fees" />

• The component receives them as one object, usually unpacked straight away:

interface EnquiryCardProps {
  name: string;
  subject: string;
}

export function EnquiryCard({ name, subject }: EnquiryCardProps) {
  return (
    <article className="card">
      <h3>{name}</h3>
      <p>{subject}</p>
    </article>
  );
}

• With TypeScript, the props interface documents exactly what the component needs. Missing or wrong props are errors, before you run anything.

• Pass text in quotes; anything else in braces: count={3}, isUrgent={true}, enquiry={enquiry}.

• Props are read-only. A component must never change its own props; it only reads them.