I use coffeescript too, so I should be able to use reactionary to write the dom helpers it exposes in my JSX. So then the coffeescript -> jsx on server side, then jsx -> javascript browser side, is how it works, right?
I think I'm slowly being convinced putting it together in the same file makes sense, since it's a single component, and the what's being displayed is coupled with what you'd do with it, so I guess it should belong in the same place?
Well, the way you should do it is abandon .jsx completely, and just stick to .coffee.
Something like this:
React.createClass
render: ->
{div, h1, span} = require 'reactionary'
div class: 'home',
h1 "Hows it going!"
Clean and simple, particularly with CoffeeScripts default return.
As far as templates go -- and this is what I always tell people -- structure your code in a clean way which makes the render function pop out and you might as well be working with a separate file! It really does make more sense after a while.
But really, once you get used to keeping everything together it really does feel better. You just have to try it out.
Personally, since I use CoffeeScript, I like this lib:
https://github.com/atom/reactionary
which, since it strips out the required `null` or `{}` first parameter, feels very much like haml or jade.