How do props and state differ?

Props are data passed to a component from outside, usually by its parent. State is what the component manages while it runs, e.g. a typed phrase or whether a form is open. I don't change props directly — if the parent needs to change something, I tell it through a suitable function.

For example, a list receives products as props, and a search form can keep the current text in state. Sometimes it's worth moving that text up to the parent or into the URL, if other parts of the app need it too. Not every variable has to be React state.