Component

Component adalah konsep fundamental di modern frontend development. Component adalah blok UI yang independen yang mengenkapsulasi struktur (HTML/template), styling (CSS), dan behavior (JavaScript) dalam satu unit. Component bisa digunakan kembali (reusable) di berbagai tempat dalam aplikasi. Setiap component punya state (data internal) dan props (data dari parent). Component bisa memiliki lifecycle (mount, update, unmount). Contoh component: Button, Card, Navbar, Modal. Component-based architecture membuat kode lebih terorganisir, mudah di-maintain, dan mudah di-test.

Contoh Kode

// React Component
function Button({ label, onClick, variant = 'primary' }: ButtonProps) {
  return (
    <button
      className={`btn btn-${variant}`}
      onClick={onClick}
    >
      {label}
    </button>
  );
}

// Penggunaan
<Button label="Simpan" onClick={handleSave} variant="primary" />