JSX

What’s JSX?

JSX is a preprocessor step that adds XML syntax to JavaScript. You can definitely use React without JSX but JSX makes React a lot more elegant. - http://buildwithreact.com/tutorial/jsx

Tip: 🤔 You can play around with JSX here.

// This is JSX
function hello() {
  return <div className="myclass">Hello world!</div>;
}

// When compiled it gets turned into a function
"use strict";

function hello() {
  return React.createElement(
    "div",
    { className: "myclass" },
    "Hello world!"
  );
}

What does JSX really do for me?

This is the sort of stuff JSX saves you from having to manage Jonny Buchanan @jbscript

Can I use JSX for conditionals?

Yes there’s a babel plugin for that jsx-control-statements