cjsx is lovely, more natural and easier to read/write than JSX

comparison.cjsx

# implicit returns, simpler than bullshitting around with return ()
ThreadList = (props)->
  <ul id="threads">
    <ThreadListItem threads={props.threads} />
  </ul>

# everything as an expression FTW

# for loops more natural than map, no bullshitting around with binding this
<ul id="threads">
  { for thread in props.threads
    <ThreadItem thread={thread} />
  }
</ul>

# if / else, no bullshitting around with ternary and nulls
ThreadItem = ->
  <div>
    { if thread.active
      <span>Active</span>
    else
      <span>Inactive</span>
    }
  </div>

# @ shorthand saves a lot of keystrokes
<ul id="threads">
  { for thread in @state.threads
    <ThreadItem thread={thread} />
  }
</ul>