loading...
Cover image for JSX and Rendering elements

JSX and Rendering elements

adityasharan01 profile image Aditya Sharan ・1 min read

Alt Text
This is neither a string nor HTML,it's JSX.

JSX or Javascript XML, is an XML/HTML-like syntax used by react that extends ECMAScript(ES) so that XML/HTML-like-text can co-exist with Javascript/React code.


Since JSX is closer to Javascript than to HTML,ReactDOM uses camelCase property naming convention instead of HTML attribute names.
For eg :
class becomes className
tabindex becomes tabIndex


Let's say there is a somewhere in your HTML file :

Alt Text

# This is the 'root' DOM node because everything inside it will be managed by ReactDOM.

To render a React element into a root DOM node, pass both to ReactDOM.render() :
Alt Text
Running you react app after this will give the following output :
Alt Text

That's all folks.
Thanks for reading!

Posted on by:

adityasharan01 profile

Aditya Sharan

@adityasharan01

Not Talented ,Just Obesessed !

Discussion

markdown guide