Any component that we will use in React JS will use JSX.

Example :-

You can or can’t use JSX in your React Js applications, its just a matter of convenience.

JSX helps in writing Javascript inside the html code using curly braces {}. After compilation JSX expressions become regular javascript function calls. We can use JSX inside the if-else statements, inside loops and we can also assign JSX as a value to any variable.

Due to some reserved keywords of Javascript, which are used as HTML attributes, JSX uses camelCase notation for specifying the attributes of a HTML element. For example, class as className, for as htmlFor, etc.

The singleton tags or void tags need to be closed inside the JSX code. Otherwise it will throw an error.

JSX also prevents injection attacks, as the ReactDOM coverts any value which is inside the JSX to strings before rendering them. This helps in preventing the cross-site-scripting attacks.

The post What is JSX in React Js? appeared first on MaXEster Technologies | Technical Blog.