Membuat Komponen Pertama

Membuat Komponen React Pertama

Komponen adalah blok bangunan dasar dari setiap aplikasi React. Setiap komponen adalah sebuah fungsi JavaScript yang mengembalikan JSX — sintaks yang mirip HTML tapi sebenarnya adalah JavaScript.

Komponen Fungsi (Function Component)

Cara paling modern dan direkomendasikan untuk membuat komponen adalah menggunakan fungsi:

function Greeting({ name }) {
  return (
    <div>
      <h1>Hello, {name}!</h1>
      <p>Selamat datang di aplikasi kami.</p>
    </div>
  );
}

export default Greeting;

Aturan JSX

• Setiap komponen harus mengembalikan satu elemen root
• Atribut HTML menggunakan camelCase: className bukan class
• Ekspresi JavaScript di dalam JSX ditulis dalam kurung kurawal: {variabel}