ReactJS – JSX

What is JSX

JSX is an XML-STYLED syntax for use in javascripts. JSX is  a preprocessor step that adds XML syntax to JavaScript.

Just like XML, JSX tags have a tag name, attributes, and children. If an attribute value is enclosed in quotes, the value is a string. Otherwise, wrap the value in braces and the value is the enclosed JavaScript expression.

Rules:

• JSX is XML and not to be mistaken with HTML
• JSX avoids Javascript keywords such as ‘CLASS’ uses classname instead
• LOWER-CASE for html tabs
• CAPITAL-CASE for react components
• CAMEL-CASE for html attributes
• Style is mostly a json object

Compilers

• This is the link to compile the html to JSX.
• Babel link for the compiler JSX to ReactJS