4 ms·

Any resources you can provide about how to use React without JSX? JSX is a blocker for me.

kccqzy 9y ago
> JSX is not a requirement for using React. Using React without JSX is especially convenient when you don't want to set up compilation in your build environment. > Each JSX element is just syntactic sugar for calling React.createElement(component, props, ...children). So, anything you can do with JSX can also be done with just plain JavaScript. Source: https://facebook.github.io/react/docs/react-without-jsx.html https://facebook.github.io/react/docs/react-without-jsx.html
ng12 9y ago
It's basically just to use the React.createElement API that JSX transpiles to. I say give JSX a chance though.
- tdfx 9y ago
  I had an initial negative reaction to JSX, as well. It grows on you, though.
acemarke 9y ago
Sure. At the bare minimum, you write "manual" `React.createElement()` calls. To simplify or shorten things, you can alias `React.createElement()` to something like `h()`. There's also a variety of libs to help with that process. We have an existing ES5/Backbone app that's built with Require.js, and we don't have a "compile" step in there. We just added our first couple React+Redux-based features into that codebase, but can't use JSX due to that lack of compilation. I opted to bring in https://github.com/Jador/react-hyperscript-helpers https://github.com/Jador/react-hyperscript-helpers as an alternative to JSX. Not perfect, but it's a suitable alternative given our limitations. There's several other "virtual DOM/hyperscript"-ish packages out there as well.
akamaozu 9y ago
Just React.js Please http://designbymobi.us/just-react-js-please/ http://designbymobi.us/just-react-js-please/
styfle 9y ago
Might I suggest .dom[0] instead of React if you are planning to use plain JS. It is tiny and has a slightly simpler API which is nice for plain ES6 [0]: https://github.com/wavesoft/dot-dom https://github.com/wavesoft/dot-dom

> JSX is not a requirement for using React. Using React without JSX is especially convenient when you don't want to set up compilation in your build environment. > Each JSX element is just syntactic sugar for calling React.createElement(component, props, ...children). So, anything you can do with JSX can also be done with just plain JavaScript. Source: https://facebook.github.io/react/docs/react-without-jsx.html https://facebook.github.io/react/docs/react-without-jsx.html

ng12 9y ago

It's basically just to use the React.createElement API that JSX transpiles to. I say give JSX a chance though.

tdfx 9y ago
I had an initial negative reaction to JSX, as well. It grows on you, though.

acemarke 9y ago

Sure. At the bare minimum, you write "manual" `React.createElement()` calls. To simplify or shorten things, you can alias `React.createElement()` to something like `h()`. There's also a variety of libs to help with that process. We have an existing ES5/Backbone app that's built with Require.js, and we don't have a "compile" step in there. We just added our first couple React+Redux-based features into that codebase, but can't use JSX due to that lack of compilation. I opted to bring in https://github.com/Jador/react-hyperscript-helpers https://github.com/Jador/react-hyperscript-helpers as an alternative to JSX. Not perfect, but it's a suitable alternative given our limitations. There's several other "virtual DOM/hyperscript"-ish packages out there as well.

akamaozu 9y ago

Just React.js Please http://designbymobi.us/just-react-js-please/ http://designbymobi.us/just-react-js-please/

styfle 9y ago

Might I suggest .dom[0] instead of React if you are planning to use plain JS. It is tiny and has a slightly simpler API which is nice for plain ES6 [0]: https://github.com/wavesoft/dot-dom https://github.com/wavesoft/dot-dom