React (coupled with Flux) has been a joy to work with. The uni-directional data flow makes understanding the state of your application at any point easy to understand. The gradual componentization of our UI codebase is a beautiful thing to witness. That, coupled with a component based CSS system (using BEM guidelines for naming classes) has removed the messy bleed over we were having with some of our old css code.
One thing that has consistently annoyed my team has been JSX. Basically, we wish we had something like handlebars that React could use on top of its virtual DOM.
(And yes, we know about Ractive.js. If there was better community support for it, we’d probably be using it).
What is annoying us?
- You can write template code ANYWHERE.
- It’s just close enough to HTML to annoy you.
This should be a minor annoyance. But when you’re copying between HTML and React on a massive rewrite of a legacy system, it becomes painful.
How is this a problem? I take the markup for an existing component. I copy the markup into React, convert over some fields, get everything working, and then I open up my browser console to get waylaid with tons of React warnings. About what? About my using “for” or “class” attributes in my markup.
These are valid HTML attributes, but in React, you have to use “htmlFor” and “className” respectively.
Why? Because Facebook hates you and decides against logical arguments.