From the course: Master Next.js: Elaborate Hands-On Web Development, React Basics, Advanced Next.js, and Deployment

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

How props work in React

How props work in React

If you look at the structure here of what we're logging, it's not just the string, I love React. We're actually logging out an object. Properties is an object. And since it's an object, we can use object destructuring to explicitly name the values of the properties in our parameters, and that's how we can customize it. All right, still confused? Let me show you. So I could destructure out from our header, specifically in our properties, but let's say we just want the title. I can say, hey, I just want the title. I'll just destructure out title. And that should give us access to title. And if we go back now and then refresh and we check our logs, we're no longer getting this object. We're now getting the title. We're now getting the title, I love React. So that now, instead of returning this hardcoded text, we have now a dynamic, customized header with access to title. So we could therefore return title. But if we just write title like this in JSX, it's not gonna work because it thinks…

Contents