✅ Props in ReactJS

In ReactJS, Props (short for Properties) are used to pass data from one component to another. They act like function arguments in JavaScript and are read-only (immutable).

📌 Why Use Props?

• Reusable Components → Pass different data to customize components.

• Parent to Child Communication → Props allow data to flow from parent to child components.

• Dynamic Rendering → Components can render dynamic content using props.

📌 Example 1: Basic Props Example

Parent Component (App.jsx)

jsx
<h1>Hello, {props.name}!<h1>Hello, {name}!<div>      <button <div <div>      <h1>{name}</h1>      <p>Age: {age}</p>    </div>  );};Profile.propTypes = {  name: PropTypes.string.isRequired,  age: PropTypes.number};Profile.defaultProps = {  age: 18};export default Profile;

• PropTypes.string.isRequired → Ensures name is a required string.

• defaultProps → Sets default age to 18 if not provided.

✅ Final Thoughts

• Use props to pass data from parent to child components.

• Props are immutable and cannot be changed within the child component.

• Use defaultProps and PropTypes for safer component design.