Cacher is the code snippet organizer for pro developers

// JS, ReactJS, Stateless, ES6, Template

import * as React from "react";
import PropTypes from 'prop-types';

const StatelessComponent = (props) => {
  const sayHi = (event) => {
    alert(`Hi ${props.name}`);
  };

  return(<div>
    <a href="#" onClick={sayHi}>Say Hi</a>
  </div>);
};

StatelessComponent.propTypes = {
  name: PropTypes.string.isRequired
};

export default StatelessComponent;

// JS, React, ES6, Template

import * as React from "react";
import PropTypes from 'prop-types';

class ComponentES6 extends React.Component{
  constructor(props){
    super(props);
  }

  sayHi(event){
    alert(`Hi ${this.props.name}`)
  }

  render(){
    return(<div>
      <a href="#" onClick={this.sayHi.bind(this)}>Say Hi</a>
    </div>);
  }
}

ComponentES6.propTypes = {
  name: PropTypes.string.isRequired
};

export default ComponentES6;