The light-weight structure that React imposes is what lets you get rid of jquery (and much of the plugins) and Handlebars/Mustache special syntax. React removes a layer of syntax and favours using plain old JavaScript.

Can you please elaborate on 3.?

Yes.

Since your HTML is all Javascript now, there are people that went a bit further and created libraries for modularising your CSS files, based on that components [1][2].

The basic idea is that, since you are using ReactJS and you are compiling your JSX files to normal JS files, for which you are using a tool like "browserify" or "webpack". These tools are so powerful that can capture your `require` statements and convert your "non-javascript" required modules to something that javascript can use.

In a similar way I'm using webpack & css-loader. My JSX file looks like this :

    // Component.jsx

    var styles = require('./Component.css'); // Component.css is a normal css file that has a .component class inside

    class Component extends React.Component {
       render() { return ( <div className={ styles.component }></div> ) }
    }

Now your webpack / browserify tools captures those require files, parses their class names and outputs a concatenated "stylesheets.css" file that has all the class names with a hash prefix. And the final Html/Css look like this :

    <div class="_12az2X"></div>

with stylesheets file

    ._12az2X { color: red; }    

[1] https://github.com/css-modules/css-modules [2] https://github.com/webpack/css-loader

I think he's talking about css modules. Postcss or something like that. Webpack can generate unique names for you when you use that loader. I think it's more about webpack for #3 than react.

Yes it is. But those tools usually rely on your Javascriptified HTML, which is something that React does.

So React is a prerequsite on that.

Can you explain 3.?