Learn About Props 
in React

Learn About Props in React

ยท

2 min read

Introduction

React is one of the popular JavaScript libraries for building user interfaces. In My last blog, We learned how To create our first React app. If you haven't I strongly recommend you to Read that too it will help you on the go And I will be skipping those things here. If You already have Let's Learn About Props

Let's begin

First of all, We can start by understanding what props and states are.

Props

Props mean property that allows us to pass data from one component to another. Props are mainly used when we reuse components.

Now let's familiarise ourselves with some of the props passing ways mainly used.

below code, snippet is an example of passing props to a component. props can be an object with 1 or more values. We can access all those values using {} this and Optional chaining if we want to drill deep down.

const Greet = (props) => {
  return <div>
<h1>Hello, {props.name}</h1>
<h1>place, {props.place}</h1>
<div/>;
}

We pass this data from where we use Greet. we just have to follow the below-shown method We can pass data of any kind Now we have shared to string. We can also pass an image URL and something like that.

<Greet name= "Nidhin" place = "India"/>

Conclusion

In this article, we have discussed props. Props are arguments passed into React components. And it is read-only. I hope you got an idea about it.

Thank you for reading ...

ย