Usually in ReactJS project, we create many components and these components are objects having their presentation and behaviour logic written within their definition. A component is visual object with some behaviour and the visual part is defined using the JSX or HTML with CSS styles and behaviour is created using life cycle functions, event handling and state object.
If there is components hierarchy in which top level component is rendering child component, sometimes we would need to pass the value from parent component to child component. This can be done using props which is already available variable in component.
In each component, there is props object which holds data/properties passed to this component object at the time of creation. After component gets created, this associated property object props of that component could not be updated. So, props is read-only object in component.
Here is the example to create components in ReactJS
Example to render list of items using components. How to generate ul li from array or list in ReactJS or JavaScript Here, many time we will get lists of item from database or api or other sources and we would have to display these values in either list view or in tabular form. In javascript we have many approached but this approach looks better to wrap each item from array or list in html tag without writing much of code.
Here, we are not using any setup of local machine to create react component. We are using online libraries for creating react project.
State management in ReactJS is handled in a way that is anything change occurs in state, DOM gets updated automatically. And this will help you write no code for rendering html element after data is gets changed.
