What are React Props?

Props represent a component’s ” properties, ” and it’s similar to the concept of parameters and arguments in JavaScript functions. Props enable us to share dynamic data from one component to another.

How Props works in React

1. React uses unidirectional data flow, which means that props are passed from the top component to the bottom component. This is useful for only transferring data (properties) from a parent component to a child component (and not the other way around).
2. Component props are an object data type and are present in both class and functional components.
3. Component props are a type of object and any JavaScript data type can be passed into the component as props.
4. Component props are read-only. They cannot be modified from the child component that receives the prop. However, the child component can emit events to modify the props.
5. Component props can also be used to pass state to other components.

EX=>

Sending the "brand" property from the Garage component to the Car component:

import React from 'react';
import ReactDOM from 'react-dom/client';

function Car(props) {
  return <h2>I am a { props.brand }!</h2>;
}

function Garage() {
  return (
    <>
        <h1>Who lives in my garage?</h1>
        <Car brand="Ford" />
    </>
  );
}