Skip to main content

React Props

What should be a prop what shouldn't​

The Standard​

It's easy to slap a prop on a component, but you should be asking yourself. Is it necessary?

Component verbiage​

Rule:​

  • If the verbiage is dynamic or meant to be supplied be the user then make it a prop.
  • If the verbiage is static like the text for a label such as Customer Profile then that is not meant to change and doesn't require a prop.

Common props​

If you require multiple options for the same thing such as background color, size, image. Don't create multiple props.

Bad:​

<Example backgroundColor="red" backgroundSize="cover" backgroundImage="/assets/sample.jpg" />

Good:​

<Example background={{
    color: "red",
    size: "cover",
    image:"/assets/sample.jpg" 
  }}
/>