According to the documentation, props are a way of passing data from parents to child. Props create a one-way communication channel for data that allows it to flow from the top, or parent component, to the bottom, or child components. An important concept to understand is that once the value of props is set, they are immutable within the component. The only way to change the props values in a component is to get it rear-rendered by a parent with the new values for props. Components get their props from this point of render. 

You can see here that the component called ComponetWithProps, is being given a prop called headerText, that has a value "Heading text from headerText prop". This value will be available inside the component with props component, and can be used in any display logic or as part of the return markup. The value supplied as a prop need not be primitive data like a string. It can be any type of data including objects, arrays, and functions. You can supply them as JavaScript expressions inside curly braces to do this. You can save samples of these in the code. Just so you know, I could have chosen any name for a prop. It's good practice to call them something useful.

Lectures

• Static Versions
• React and Data
• Receiving and Using Props
• Default Props
• Prop Types