Why use Semantic UI react bindings over Semantic UI?

Hi, I had a general doubt over why using these binding are necessary. I can straight away see that, yes we need React bindings since we do not have the good old javascript. But, if I do not require the JavaScript, does it make sense to use a React component for a simple grid like

<Grid>
</Grid>

instead of rendering it as

<div class="ui grid">
</div>

Note that in the second case I’ve loaded the semantic.min.css in my index.html page so that does work. As for just design and non-JavaScript aspects, is there any caveat that I’m missing out for using react bindings over SUI tags. Ofcourse, keeping aside the usual advantages such as re usability of react components, etc etc.

On a more general note. Is it not advised to use the jQuery with react which is why using react bindings helps? I’ve seen some answers in the past about the general usage of mixing jQuery with react but haven’t gotten any solid reason for it.

Any feedback is greatly appreciated!

[levithomason]

@brianespinosa is absolutely right, though I’d extend this statement:

If you were working on an extremely simple project, it would be much easier.

Even a simple project uses a Dropdown. Try using a SUI jQuery dropdown with dynamic options in a React app and you’ll understand the exact reason I wrote SUIR 😃

[levithomason]

That answer was more directed at the props vs className discussion. Reasons for using SUIR over SUI are detailed in the docs:

http://react.semantic-ui.com/introduction

The primary reason is that we removed all jQuery and rewrote the components in React. Everything else is bonus material.