- JSX is known as JavaScript XML.
- This file makes the React application robust.
- Boosts its performance.
- We can write HTML structures in the same file that contains JavaScript code,while using JSX.
- It is easy to understand in HTML file.
- It is like XML/HTML, JSX tags have a tag name, attributes, and children.
Let’s see how JSX works:
Create an element without using JSX.
[pastacode lang=”markup” manual=”const%20text%20%3D%20React.createElement(‘p’%2C%20%7B%7D%2C%20’Welcome%20to%20kaashiv’)%3B%0A%0Aconst%20container%20%3D%20React.createElement(‘div’%2C’%7B%7D’%2Ctext%20)%3B%0A%0AReactDOM.render(container%2CrootElement)%3B” message=”” highlight=”” provider=”manual”/]Create an element using JSX:
[pastacode lang=”markup” manual=”const%20container%20%3D%20(%0A%0A%3Cdiv%3E%0A%0A%C2%A0%20%3Cp%3EWelcome%20to%20kaashiv%3C%2Fp%3E%0A%0A%3C%2Fdiv%3E%0A%0A)%3B%0A%0AReactDOM.render(container%2CrootElement)%3B” message=”” highlight=”” provider=”manual”/]
