What is jsx? when we use jsx? why we use jsx?how we use jsx? difference b/w js and jsx?

What is jsx?

• JSX (JavaScript XML).
• Syntax extension for JavaScript use in react.
• You write HTML-like code inside JavaScript.

Why do we use JSX?

• Cleaner code looks like HTML, easy to read.
• Combines logic and UI write UI directly in JavaScript.
• Helps detect errors at compile time.
• Faster development more intuitive than manually writing React.createElement().

How do we use JSX?

• Wrap JSX inside a React component.
• Use curly braces {} to embed JavaScript expressions. (ex)

function GreetingMessage(){
return(
<h1>Hi Lakshmi!</h1>
)
}

When do we use JSX?

• JSX whenever we want to describe the UI inside a React component.
• For rendering HTML-like elements.
• For displaying dynamic data ({} expressions).
• For conditionally showing elements.