📬 React Props

Props (short for "properties") are used to pass data from one component to another, especially from parent to child. They are read-only and help make components reusable and dynamic.

🔗 How Props Work

Props are passed like HTML attributes and accessed using the props object in function parameters.

Example:

function Greeting(props) {
  return <h1>Hello, {props.name}!</h1>;
}

function App() {
  return <Greeting name="Sangram" />;
}

In this example, name="Sangram" is a prop passed to the Greeting component.

✂️ Destructuring Props

function Greeting({ name }) {
  return <h1>Hello, {name}!</h1>;
}

This is a cleaner way to access props, using object destructuring.

📋 Common Props Use Cases

📌 Important Points

• Props are read-only. You cannot change them inside the child component.
• Props allow component reuse with different data.
• Props can be strings, numbers, arrays, objects, or functions.

✅ Summary

• Used to pass data between components
• Accessed via props or destructuring
• Essential for dynamic and reusable UIs