what are props and how use them in react js

 Props (properties) are how you pass data from a parent component to a child component.

They are read-only — the child component can use them but should not change them.

Passing props (Parent ➜ Child)

Parent component

function App() {
  return (
    <Greeting name="Achla" message="Welcome to React!" />
  );
}
Child component (receiving props)
function Greeting(props) {
  return (
    <h2>Hello {props.name} — {props.message}</h2>
  );
}
Passing numbers, arrays, objects & functions
function App() {
  const user = { name: "Achla", age: 25 };

  return (
    <Profile
      user={user}
      hobbies={["reading", "traveling"]}
      onLogin={() => alert("Logged in!")}
    />
  );
}
Child:
function Profile({ user, hobbies, onLogin }) {
  return (
    <>
      <p>{user.name} — {user.age}</p>
      <p>Hobbies: {hobbies.join(", ")}</p>
      <button onClick={onLogin}>Login</button>
    </>
  );
}