React.js starter template

<!DOCTYPE html>
<html>

  <head>
    <script data-require="react@*" data-semver="0.14.0" src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react.js"></script>
    <script data-require="react@*" data-semver="0.14.0" src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react-dom.js"></script>
    <link rel="stylesheet" href="style.css" />
  </head>

  <body>
    <div id="example"></div>
    <script src="script.js"></script>
  </body>

</html>

class Dialog extends React.Component {
  render() {
    return (<h1>Message {this.props.message}</h1>)
  }
}
class Card extends React.Component {
  render() {
    return (<h1 onClick={this.props.setDialogMessage.bind(this, this.props.title )}>{this.props.title}</h1>)
  }
  
}
class Main extends React.Component {
   constructor(props) {
    super(props);
    this.state = {message: "Initial message"};
  }
  setDialogMessage(message) {
    this.setState({dialogMessage:message})
  }
  render() {
    return  (<div>
    <Dialog message={this.state.dialogMessage} />
    {this.props.cards.map((card,i) =>
      <Card
      key={i}
        title={card}
        setDialogMessage={message => this.setDialogMessage(message)}
      />
    )}
    </div>
    )
  }
}


ReactDOM.render(
  <Main cards={["a","b","c"]}></Main>,
  document.getElementById('example')
);

/* Styles go here */