State&Props, JSX

React.js is one of the most widely used JavaScript libraries.Understanding what props and state are and the differences between them is important for learning React.
Today I will explain what props and state are:

*1. What are props?
*
Ans: React’s data flow between components is uni-directional that is from parent to child only. Props are used to pass data between React components.

*2. How do you pass data with props?
*
Ans:

const ParentComponent = () => {

return{

}

}

const ChildComponent = (props) => {

return

{props.name}

;
};

*3. What is state?
*
Ans: React has another built-in object called state, which is allow components to create and manage their own data. Components cannot pass data with state, but internally they can create and manage it.

*4. How do you update a component’s state?
*
Ans: State should not be modified directly, but it can be modified with a special method called setState().

this.setState({

name: "Arif"
});

*5. What happens when state changes?
*
Ans: When A change in the state happens based on user-input or something any other reason. React components (with state) are rendered based on the data in the state. State holds the initial information.

So when state changes, React gets and immediately re-renders the DOM and updated state. And thats why React is fast.

*1. What is JSX?
*
Ans: This is a JavaScript Extension Syntax which is used in React to easily write HTML and JavaScript together.

*2. How to Add JavaScript Code in JSX
*
Ans:
const = () => {
const number = 10;
return (

Number: {number}

);
};

*3. What is Conditional Operators in JSX Expressions?
*
Ans: We can't write if conditions in JSX expressions like others programming languages. But we can use like this

{a > b ? "Greater" : "Smaller"}

{shouldShow && "Shown"}