One of the nicest things about designing a React app is that React makes it so easy to divide your app up into tiny little components that compose and reuse well, and are really easy to understand. Where an angular app might have 5 different controllers and accompanying templates, a similar React app might have 50 different components.

One of the reasons that it's so easy to split off a new React component is because JSX is inline. Putting that into a separate file increases the impedance and maintenance burden substantially.

In other words your

  var createItem = function(itemText) {
    return <li>{itemText}</li>;
  };
  return <ul>{this.props.items.map(createItem)}</ul>;

  return <MyList items={items} />;