Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript React Basics (retired) Thinking in Components Properties

Cezary Burzykowski
Cezary Burzykowski
18,291 Points
Posted by Cezary Burzykowski
Cezary Burzykowski
18,291 Points

How the "props" works?

Hey there!

I would like to ask what exactly "props" give us here? What does it stand for and what is its role? I don't quite get why we pass it as an argument and then use it as:

<h1>{props.title}</h1>

Can anyone clarify this? :)

2 Answers

Lucas Santos
Lucas Santos
19,315 Points
Lucas Santos
Lucas Santos
19,315 Points

Props stands for "Properties" and they are the properties of your components much like a regular javascript object would have properties describing the object. Same thing here except you're using props.title instead of this.title

The purpose of the prop is to describe the component detail such as data points and what not. You use props when defining the component as an attribute.

READ THIS from the official documentation and you'll understand it pretty quick.

props is super easy to understand and is probably the easiest concept in React if you understand basic OOP.

Gonzalo Blasco
Gonzalo Blasco
10,405 Points

Anyway, something that would be changing as often as a title should be a State, not a Prop...

Cezary Burzykowski
Cezary Burzykowski
18,291 Points
Cezary Burzykowski
Cezary Burzykowski
18,291 Points

Hej Lucas!

Thank you, that clarifies it :)