Setting up react JSX in ruby on rails.

I'm trying to learn react and integrate it to Ruby on Rails.

To start with I included the following gem.

gem 'react-rails', '~> 1.0'

Rails app was set up and react integration was also done and working fine.

In my erb page i'm using helper method react_component to render some data.

<%= react_component 'Records', { data: @records } %>

Following is my react JS code react.DOM syntax

@Records = React.createClass
    render: ->
      React.DOM.div
        className: 'records'
        React.DOM.h2
          className: 'title'
          'Records'

Now my aim is to use JSX instead of react.DOM structure.

So i replaced the above code with .

@Records = React.createClass
 render: ->
    `<div className="records">
      <h2 className="title"> Records </h2>
    </div>`

And it gave me the following error.

Uncaught SyntaxError: Unexpected token <.

From my search I understood that this has to do with inclusion of JSX. How can i solve this issue ?

Which extension should i be using? .coffee or .js or .jsx.

Any information regarding this is highly appreciated.