What are props in react js ?

#webdev #react #beginners #programming

Props are basically arguments passed in a react component and with the help of props you can pass the data instead of hard coding it and rendering on the screen.

export default function Card(props) {
    return (
        <div className="card">
            <img src={`../images/${props.img}`} className="card--image" />
            <div className="card--stats">
                <img src="../images/star.png" className="card--star" />
                <span>{props.rating}</span>
                <span className="gray">({props.reviewCount}) • </span>
                <span className="gray">{props.country}</span>
            </div>
            <p>{props.title}</p>
            <p><span className="bold">From ${props.price}</span> / person</p>
        </div>
    )
}

The above is an example of a prop with some property names such as image, rating, etc.