Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript React Basics (retired) Thinking in Components Properties

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

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.

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

Hej Lucas!

Thank you, that clarifies it :)